raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-01-24 20:36:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Extract shop searchbar styles to separate file

Browse Source
This commit is contained in:
Matt-Yorkley
2020-04-21 11:40:01 +02:00
parent 035bde9eff
commit d1ea2c5f77
2 changed files with 44 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
app/assets/stylesheets/darkswarm/shop.css.scss
View File

@@ -17,48 +17,6 @@ $sidebar-large-width: 45%;
$sidebar-footer-height: 5em;
.darkswarm {
.shop-searchbar {
background-color: $grey-100;
height: 5em;
padding: 1em 0;
margin-bottom: 1em;
position: relative;
z-index: 5;
input#search {
height: 3em;
border-radius: 0.25em;
border: solid 1px $grey-300;
margin: 0;
padding: 0 1em 0 2.75em;
width: 100%;
min-width: 0;
background: $white url("/assets/icn-search-grey.png") 1em center no-repeat;
font-size: 1em;
&::placeholder {
font-style: italic;
}
}
button {
background-color: $grey-600;
margin-left: 1em;
height: 3em;
width: 7em;
padding: 0;
font-size: 1em;
@include breakpoint(mobile) {
margin-left: 0.75em;
}
}
@include breakpoint(mobile) {
font-size: 0.9em;
}
}
.shop-filters-sidebar {
display: flex;
flex-direction: column;

44
app/assets/stylesheets/darkswarm/shop_search.css.scss Normal file
View File

@@ -0,0 +1,44 @@
@import "mixins";
@import "branding";
.shop-searchbar {
background-color: $grey-100;
height: 5em;
padding: 1em 0;
margin-bottom: 1em;
position: relative;
z-index: 5;
input#search {
height: 3em;
border-radius: 0.25em;
border: solid 1px $grey-300;
margin: 0;
padding: 0 1em 0 2.75em;
width: 100%;
min-width: 0;
background: $white url("/assets/icn-search-grey.png") 1em center no-repeat;
font-size: 1rem; // avoid zoom on iphone, see issue #4535
&::placeholder {
font-style: italic;
}
}
button {
background-color: $grey-600;
margin-left: 1em;
height: 3em;
width: 7em;
padding: 0;
font-size: 1em;
@include breakpoint(mobile) {
margin-left: 0.75em;
}
}
@include breakpoint(mobile) {
font-size: 0.9em;
}
}