mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-02-27 01:43:22 +00:00
Convert sass files to scss
This commit is contained in:
Kevin Christianson
@@ -1,86 +0,0 @@
|
||||
@import typography
|
||||
|
||||
.darkswarm
|
||||
|
||||
navigation
|
||||
display: block
|
||||
background: #f7f7f7
|
||||
|
||||
distributor.details
|
||||
box-sizing: border-box
|
||||
display: block
|
||||
min-height: 150px
|
||||
padding: 30px 0px 20px 0px
|
||||
select
|
||||
width: 200px
|
||||
position: relative
|
||||
img
|
||||
display: block
|
||||
height: 100px
|
||||
width: 100px
|
||||
margin-right: 12px
|
||||
|
||||
location
|
||||
@include headingFont
|
||||
@media all and (max-width: 768px)
|
||||
location, location + small
|
||||
display: block
|
||||
|
||||
#distributor_title h3
|
||||
margin-top: 0
|
||||
@media all and (max-width: 768px)
|
||||
margin-bottom: 8px
|
||||
|
||||
|
||||
ordercycle
|
||||
text-align: right
|
||||
p
|
||||
max-width: 400px
|
||||
h4 i
|
||||
margin-right: 0.3rem
|
||||
@media all and (max-width: 640px)
|
||||
float: left
|
||||
clear: left
|
||||
text-align: left
|
||||
padding: 12px 10px
|
||||
width: 100%
|
||||
margin-top: 10px
|
||||
background: #e5e5e5
|
||||
p
|
||||
max-width: 100%
|
||||
float: right
|
||||
form.custom
|
||||
text-align: right
|
||||
& > strong
|
||||
line-height: 2.5
|
||||
font-size: 1.29em
|
||||
padding-right: 14px
|
||||
@media all and (max-width: 768px)
|
||||
select
|
||||
width: inherit
|
||||
display: inline-block
|
||||
border-width: 1px
|
||||
border-color: #999
|
||||
color: #666
|
||||
font-size: 1em
|
||||
margin-bottom: 0
|
||||
padding: 8px 20px 8px 12px
|
||||
@media all and (max-width: 768px)
|
||||
font-size: 0.875em
|
||||
@media screen and (-webkit-min-device-pixel-ratio:0)
|
||||
font-size: 16px
|
||||
closing
|
||||
@include headingFont
|
||||
@media all and (max-width: 768px)
|
||||
font-size: 1.2em
|
||||
padding-bottom: 10px
|
||||
color: black
|
||||
font-size: 1.5em
|
||||
display: block
|
||||
padding-bottom: 12px
|
||||
span
|
||||
@media all and (max-width: 768px)
|
||||
font-size: 0.875em
|
||||
|
||||
|
||||
|
||||
103
app/assets/stylesheets/darkswarm/_shop-navigation.css.scss
Normal file
103
app/assets/stylesheets/darkswarm/_shop-navigation.css.scss
Normal file
@@ -0,0 +1,103 @@
|
||||
@import "typography";
|
||||
|
||||
.darkswarm navigation {
|
||||
display: block;
|
||||
background: #f7f7f7;
|
||||
|
||||
distributor.details {
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
min-height: 150px;
|
||||
padding: 30px 0 20px 0;
|
||||
position: relative;
|
||||
select {
|
||||
width: 200px;
|
||||
}
|
||||
img {
|
||||
display: block;
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
location {
|
||||
@include headingFont;
|
||||
}
|
||||
@media all and (max-width: 768px) {
|
||||
location, location + small {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
#distributor_title h3 {
|
||||
margin-top: 0;
|
||||
@media all and (max-width: 768px) {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
ordercycle {
|
||||
text-align: right;
|
||||
float: right;
|
||||
p {
|
||||
max-width: 400px;
|
||||
}
|
||||
h4 i {
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
@media all and (max-width: 640px) {
|
||||
float: left;
|
||||
clear: left;
|
||||
text-align: left;
|
||||
padding: 12px 10px;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
background: #e5e5e5;
|
||||
p {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
form.custom {
|
||||
text-align: right;
|
||||
& > strong {
|
||||
line-height: 2.5;
|
||||
font-size: 1.29em;
|
||||
padding-right: 14px;
|
||||
}
|
||||
select {
|
||||
width: inherit;
|
||||
display: inline-block;
|
||||
border: 1px #999;
|
||||
color: #666;
|
||||
font-size: 1em;
|
||||
margin-bottom: 0;
|
||||
padding: 8px 20px 8px 12px;
|
||||
@media all and (max-width: 768px) {
|
||||
font-size: 0.875em;
|
||||
}
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
closing {
|
||||
@include headingFont;
|
||||
color: black;
|
||||
font-size: 1.5em;
|
||||
display: block;
|
||||
padding-bottom: 12px;
|
||||
@media all and (max-width: 768px) {
|
||||
font-size: 1.2em;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
span {
|
||||
@media all and (max-width: 768px) {
|
||||
font-size: 0.875em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,86 +0,0 @@
|
||||
@import mixins
|
||||
@import branding
|
||||
@import animations
|
||||
|
||||
.order-summary
|
||||
background-color: #e1f0f5
|
||||
padding: 1em
|
||||
width: 100%
|
||||
border: none
|
||||
color: inherit
|
||||
|
||||
checkout
|
||||
display: block
|
||||
|
||||
@media all and (max-width: 640px)
|
||||
&.row .row
|
||||
margin-left: 0
|
||||
margin-right: 0
|
||||
|
||||
orderdetails
|
||||
.button, table
|
||||
width: 100%
|
||||
@media all and (max-width: 640px)
|
||||
form.edit_order
|
||||
border: 1px solid $disabled-bright
|
||||
margin-bottom: 2rem
|
||||
|
||||
#details, #billing, #shipping, #payment
|
||||
border: 0
|
||||
margin: 1em 0
|
||||
padding: 0
|
||||
.content
|
||||
border: 1px solid #efefef
|
||||
|
||||
h5
|
||||
margin: 0
|
||||
padding: 0.65em
|
||||
background: #f7f7f7
|
||||
|
||||
.label
|
||||
font-size: 1em
|
||||
padding: 0.3rem 0.35rem 0.275rem
|
||||
|
||||
// Logic to turn on & off the alerts for success against each fieldset
|
||||
|
||||
label, label.alert, label.success, &.valid label.alert, &.dirty label.success
|
||||
display: none
|
||||
|
||||
&.dirty label.alert
|
||||
display: inline
|
||||
&.dirty.valid label.alert
|
||||
display: none
|
||||
&.valid label.success
|
||||
display: inline
|
||||
|
||||
h5.dirty
|
||||
background: #f7ccc5
|
||||
h5.valid, h5.dirty.valid
|
||||
background: #bfefd1
|
||||
|
||||
orderdetails table tr th
|
||||
text-align: left
|
||||
|
||||
// Logic to swap out up / down accordion icons
|
||||
//Foundation overrides
|
||||
dd > a
|
||||
@include csstrans
|
||||
background: $disabled-light !important
|
||||
|
||||
dd > a:hover
|
||||
background: $disabled-v-dark !important
|
||||
color: white
|
||||
|
||||
dd
|
||||
span.accordion-up
|
||||
display: none
|
||||
span.accordion-down
|
||||
display: inline
|
||||
&.open
|
||||
span.accordion-up
|
||||
display: inline
|
||||
span.accordion-down
|
||||
display: none
|
||||
|
||||
.error
|
||||
color: #c82020
|
||||
117
app/assets/stylesheets/darkswarm/checkout.css.scss
Normal file
117
app/assets/stylesheets/darkswarm/checkout.css.scss
Normal file
@@ -0,0 +1,117 @@
|
||||
@import "mixins";
|
||||
@import "branding";
|
||||
@import "animations";
|
||||
|
||||
.order-summary {
|
||||
background-color: #e1f0f5;
|
||||
padding: 1em;
|
||||
width: 100%;
|
||||
border: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
checkout {
|
||||
display: block;
|
||||
|
||||
@media all and (max-width: 640px) {
|
||||
&.row .row {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
orderdetails {
|
||||
.button, table {
|
||||
width: 100%;
|
||||
}
|
||||
@media all and (max-width: 640px) {
|
||||
form.edit_order {
|
||||
border: 1px solid $disabled-bright;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#details, #billing, #shipping, #payment {
|
||||
border: 0;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
.content {
|
||||
border: 1px solid #efefef;
|
||||
}
|
||||
}
|
||||
|
||||
h5 {
|
||||
margin: 0;
|
||||
padding: 0.65em;
|
||||
background: #f7f7f7;
|
||||
|
||||
.label {
|
||||
font-size: 1em;
|
||||
padding: 0.3rem 0.35rem 0.275rem;
|
||||
}
|
||||
|
||||
// Logic to turn on & off the alerts for success against each fieldset
|
||||
|
||||
label, label.alert, label.success, &.valid label.alert, &.dirty label.success {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.dirty label.alert {
|
||||
display: inline;
|
||||
}
|
||||
&.dirty.valid label.alert {
|
||||
display: none;
|
||||
}
|
||||
&.valid label.success {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
h5.dirty {
|
||||
background: #f7ccc5;
|
||||
}
|
||||
|
||||
h5.valid, h5.dirty.valid {
|
||||
background: #bfefd1;
|
||||
}
|
||||
|
||||
orderdetails table tr th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
// Logic to swap out up / down accordion icons
|
||||
//Foundation overrides
|
||||
dd > a {
|
||||
@include csstrans;
|
||||
background: $disabled-light !important;
|
||||
}
|
||||
|
||||
dd > a:hover {
|
||||
background: $disabled-v-dark !important;
|
||||
color: white;
|
||||
}
|
||||
|
||||
dd {
|
||||
span.accordion-up {
|
||||
display: none;
|
||||
}
|
||||
span.accordion-down {
|
||||
display: inline;
|
||||
}
|
||||
&.open {
|
||||
span.accordion-up {
|
||||
display: inline;
|
||||
}
|
||||
span.accordion-down {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #c82020;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user