Created
August 4, 2016 16:24
-
-
Save cesasol/ef6535e99f3671808e6d04dad386aa62 to your computer and use it in GitHub Desktop.
Styling wordpress plugin "Membership 2 Pro" with foundation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.ms-alert-box { | |
@include callout-base; | |
ms-alert-success { | |
@include callout-style($success-color); | |
} | |
} | |
.ms-form-price-boxes { | |
@include flex-grid-row(); | |
.ms-membership-form{ | |
@include breakpoint(small) { | |
@include flex-grid-column(12); | |
} | |
@include breakpoint(medium) { | |
@include flex-grid-column(6); | |
} | |
.ms-membership-details-wrapper{ | |
@include flex-grid-row(nest collapse); | |
border: solid 1px #DDDDDD; | |
> div{ | |
@include flex-grid-column(12, 0); | |
} | |
.ms-top-bar { | |
background-color: $secondary-color; | |
.ms-title{ | |
color: $white; | |
font-size: 2rem; | |
font-weight: 200; | |
border-bottom: 0; | |
} | |
} | |
.ms-price-details{ | |
@include flex-grid-row(); | |
padding: 0; | |
} | |
.ms-description { | |
@include flex-order(2); | |
li{ | |
@include flex-grid-column(12); | |
@extend .no-bullet; | |
text-align: center; | |
text-align: justify; | |
border-bottom: solid 1px $secondary-color; | |
padding: 0.875rem 0rem; | |
&:last-child { | |
border-bottom: 0; | |
} | |
} | |
} | |
.ms-price{ | |
@include flex-grid-column(12, 0); | |
@include flex-order(1); | |
background-color: $blue-2; | |
color: $white; | |
text-align: center; | |
font-size: 1.75rem; | |
border-bottom: 0; | |
} | |
.ms-bottom-bar { | |
margin: 0; | |
background-color: 0; | |
padding: 0; | |
.button{ | |
@include button-expand(); | |
border-radius: 0; | |
font-weight: 500; | |
font-size: 1.2rem; | |
} | |
} | |
} | |
} | |
} | |
.ms-form-element{ | |
&.ms-form-element-xprofile{ | |
&.editfield{ | |
.checkbox,.radio{ | |
// @include fieldset(); | |
.label{ | |
font-size: 1rem; | |
line-height: 1.5; | |
background: $body-background; | |
padding: $legend-padding; | |
margin: 0; | |
margin-#{$global-left}: rem-calc(-3); | |
} | |
.input-options{ | |
&.radio-button-options{ | |
label{ | |
@include form-element(); | |
float: none; | |
padding: 0.2rem; | |
input{ | |
float: none; | |
min-width: unset; | |
} | |
} | |
} | |
&.checkbox-options{ | |
column-count: 2; | |
label{ | |
float: none; | |
display: list-item; | |
@extend .no-bullet; | |
// font-weight: bold; | |
@include form-element(); | |
// height: 2rem; | |
padding: 0.2rem; | |
&:nth-child(odd){ | |
} | |
input{ | |
min-width: unset; | |
float: none; | |
} | |
} | |
} | |
} | |
} | |
input{ | |
&[type="textbox"]{ | |
@include form-element(); | |
} | |
} | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment