Style improvements

pull/3/head
assar 7 years ago
parent d5b2b8708b
commit bbdeffed65

@ -2,14 +2,14 @@ function overlay_in() {
$('.shadow').css({'display' : 'block'});
$('.overlay').css({'display' : 'block'});
$('.shadow').animate({'opacity' : 0.7});
$('.overlay').animate({'top' : '10%'});
$('.overlay').animate({'opacity' : 1.0, 'top' : '10%'});
}
function overlay_out() {
$('.shadow').animate({'opacity' : 0.0}, function () {
$('.overlay').css({'display' : 'none'});
});
$('.overlay').animate({'top' : '-70%'}, function () {
$('.overlay').animate({'opacity' : 0.0, 'top' : '5%'}, function () {
$('.shadow').css({'display' : 'none'});
});
end_edit();

@ -55,11 +55,11 @@ input[type=text].search-bar {
.filter-container {
background-color: #226666;
padding: 5pt;
margin: 10pt auto;
width: 48%;
padding: 10pt 15pt 10pt 15pt;
margin-top: 10pt;
margin-bottom: 10pt;
border-radius: 2pt;
padding-left: 15pt;
display: inline-block;
}
.filter-container p {
@ -71,6 +71,10 @@ input[type=text].search-bar {
margin-bottom: 4pt;
}
.filter-concontainertainer {
text-align: center;
}
input[type=checkbox]{
display: none;
}
@ -222,16 +226,14 @@ div label input {
display: none;
height: 70%;
left: 20%;
/*padding: 8pt;*/
padding: 0;
/*position: absolute; /*Should probably be 'fixed' instead*/
position: fixed;
top: -70%;
top:10%;
padding: 0;
position: fixed;
top:5%;
width: 60%;
z-index: 201;
border-radius: 2pt;
text-align: center;
opacity: 0.0;
}
/*.details-row {
@ -308,3 +310,7 @@ div label input {
#datasheet-info p {
font-size: 12pt;
}
.bottom-spacer {
height: 80pt;
}

@ -18,12 +18,14 @@
<div class="search-bar-container">
<input type="text" name="search-bar" class="search-bar" placeholder="Search parts">
</div>
<div class="filter-container">
<p>Search in:</p>
<input type="checkbox" id="type" checked></input><label class="toggle-btn" for="type">Manufacturer</label>
<input type="checkbox" id="partno" checked></input><label class="toggle-btn" for="partno">Part Number</label>
<input type="checkbox" id="description" checked></input><label class="toggle-btn" for="description">Description</label>
<input type="checkbox" id="notes" checked></input><label class="toggle-btn" for="notes">Notes</label>
<div class="filter-concontainertainer">
<div class="filter-container">
<p>Search in:</p>
<input type="checkbox" id="type" checked></input><label class="toggle-btn" for="type">Manufacturer</label>
<input type="checkbox" id="partno" checked></input><label class="toggle-btn" for="partno">Part Number</label>
<input type="checkbox" id="description" checked></input><label class="toggle-btn" for="description">Description</label>
<input type="checkbox" id="notes" checked></input><label class="toggle-btn" for="notes">Notes</label>
</div>
</div>
<div class="res-header-small">Block</div>
<div class="res-header">Manufacturer</div>
@ -33,6 +35,7 @@
<div class="res-header-small">Docs</div>
<div class="results">
</div>
<div class="bottom-spacer"></div>
<div class="shadow" onclick="overlay_out()"></div>
<div class="overlay">

Loading…
Cancel
Save