remove selection from landing page

fix styles on consol menu
pull/1/head
LianaHus 6 years ago
parent c49385cae5
commit a007399adc
  1. 8
      src/app/panels/styles/terminal-styles.js
  2. 4
      src/app/panels/terminal.js
  3. 16
      src/app/ui/dropdown.js
  4. 1
      src/app/ui/landing-page/landing-page.js
  5. 4
      src/app/ui/landing-page/section.js
  6. 12
      src/app/ui/styles/dropdown-styles.js

@ -22,6 +22,7 @@ var css = csjs`
align-items : center; align-items : center;
width : 100%; width : 100%;
border-bottom-style : ridge; border-bottom-style : ridge;
max-height : 35px;
} }
.clear { .clear {
margin-right : 20px; margin-right : 20px;
@ -92,7 +93,8 @@ var css = csjs`
.search { .search {
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: 10px; width: 200px;
padding-left: 20px;
} }
.filter { .filter {
width : 200px; width : 200px;
@ -102,13 +104,14 @@ var css = csjs`
border-bottom-left-radius : 0px; border-bottom-left-radius : 0px;
} }
.searchIcon { .searchIcon {
height : 25px; height : 100%;
width : 25px; width : 25px;
border-top-left-radius : 3px; border-top-left-radius : 3px;
border-bottom-left-radius : 3px; border-bottom-left-radius : 3px;
display : flex; display : flex;
align-items : center; align-items : center;
justify-content : center; justify-content : center;
margin-right : 5px;
} }
.listen { .listen {
margin-right: 30px; margin-right: 30px;
@ -123,7 +126,6 @@ var css = csjs`
.verticalLine { .verticalLine {
border-left : 1px solid var(--secondary) border-left : 1px solid var(--secondary)
height : 65%; height : 65%;
margin-right : 30px;
} }
.pendingTx { .pendingTx {
border : 1px solid var(--secondary); border : 1px solid var(--secondary);

@ -128,7 +128,7 @@ class Terminal {
self._view.bar = yo` self._view.bar = yo`
<div class="${css.bar}"> <div class="${css.bar}">
${self._view.dragbar} ${self._view.dragbar}
<div class=${css.menu}> <div class="${css.menu} bg-light">
${self._view.icon} ${self._view.icon}
<div class=${css.clear} onclick=${clear}> <div class=${css.clear} onclick=${clear}>
<i class="fa fa-ban" aria-hidden="true" title="Clear console" <i class="fa fa-ban" aria-hidden="true" title="Clear console"
@ -143,7 +143,7 @@ class Terminal {
</div> </div>
${self._view.dropdown} ${self._view.dropdown}
<div class=${css.search}> <div class=${css.search}>
<i class="fa fa-search ${css.searchIcon} bg-light btn" aria-hidden="true"></i> <i class="fa fa-search ${css.searchIcon} bg-light btn-light" aria-hidden="true"></i>
<input spellcheck="false" type="text" class=${css.filter} onkeydown=${filter} placeholder="Search transactions"> <input spellcheck="false" type="text" class=${css.filter} onkeydown=${filter} placeholder="Search transactions">
</div> </div>
</div> </div>

@ -45,11 +45,19 @@ class Dropdown {
</div> </div>
` `
self._view.el = yo` self._view.el = yo`
<div class="${css.dropdown}" onclick=${show}> <div name="dropdown" class="${css.dropdown} form-control form-control-sm" onclick=${show}>
${self._view.selected} ${self._view.selected}
<div class="${css.options} bg-light" style="display: none;"> <div class="${css.options} bg-light" style="display: none;}">
${self.data._options.map(label => { ${self.data._options.map(label => {
var input = yo`<input data-idx=${self.data._elements.length} onchange=${emit} type="checkbox" />` let index = self.data._elements.length
var input = yo`
<input
data-idx=${index}
onchange=${emit}
type="${index === 2 ? 'checkbox' : 'radio'}"
id="${label}"
/>
`
if (self.data.selected.indexOf(label) !== -1) { if (self.data.selected.indexOf(label) !== -1) {
input.checked = true input.checked = true
self.event.trigger('select', [label]) self.event.trigger('select', [label])
@ -58,7 +66,7 @@ class Dropdown {
return yo` return yo`
<div class=${css.option}> <div class=${css.option}>
${input} ${input}
<label>${label}</label> <label for="${label}">${label}</label>
</div> </div>
` `
})} })}

@ -29,6 +29,7 @@ var css = csjs`
padding : 20px; padding : 20px;
background-color: var(--bg-light); background-color: var(--bg-light);
margin-left : 75px; margin-left : 75px;
user-select : none;
} }
.im:hover { .im:hover {
} }

@ -6,6 +6,7 @@ var css = csjs`
cursor: pointer; cursor: pointer;
font-weight: normal; font-weight: normal;
max-width: 300px; max-width: 300px;
user-select: none;
} }
.text:hover { .text:hover {
font-weight: bold; font-weight: bold;
@ -14,6 +15,7 @@ var css = csjs`
cursor: pointer; cursor: pointer;
font-weight: normal; font-weight: normal;
text-decoration : none; text-decoration : none;
user-select: none;
} }
.link:hover { .link:hover {
font-weight: bold; font-weight: bold;
@ -31,7 +33,7 @@ class Section {
render () { render () {
let sectionLook = yo` let sectionLook = yo`
<div class="card ${this.cardStyle} p-3" style="min-width: 300px; min-height: 190px;"> <div class="card ${this.cardStyle} p-3" style="min-width: 300px; min-height: 190px;">
<div class="card-header font-weight-bold">${this.title}</div> <div class="card-header font-weight-bold" style="user-select: none;">${this.title}</div>
<p></p> <p></p>
</div> </div>
` `

@ -6,24 +6,22 @@ var css = csjs`
position : relative; position : relative;
display : flex; display : flex;
flex-direction : column; flex-direction : column;
margin-right : 10px;
margin-left : 10px; margin-left : 10px;
width : auto; width : auto;
} }
.selectbox { .selectbox {
display : flex; display : flex;
align-items : center; align-items : center;
margin : 3px;
cursor : pointer; cursor : pointer;
} }
.selected { .selected {
display : inline-block; display : inline-block;
min-width : 30ch;
max-width : 30ch; max-width : 30ch;
white-space : nowrap; white-space : nowrap;
text-overflow : ellipsis; text-overflow : ellipsis;
overflow : hidden; overflow : hidden;
padding : 3px; margin-right : 10px;
min-width : 200px;
} }
.icon { .icon {
padding : 0px 5px; padding : 0px 5px;
@ -34,15 +32,17 @@ var css = csjs`
flex-direction : column; flex-direction : column;
align-items : end; align-items : end;
top : 32px; top : 32px;
right : 0; left : 0;
width : 230px; width : 245px;
border : 1px solid var(--dark); border : 1px solid var(--dark);
border-radius : 3px; border-radius : 3px;
border-top : 0; border-top : 0;
padding-left : 5px;
} }
.option { .option {
margin-left : 5px; margin-left : 5px;
margin-top : 5px; margin-top : 5px;
width : -webkit-fill-available;
} }
` `

Loading…
Cancel
Save