kazhnuz/kazhnuz.css
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

improvement: make vertical rythm work by using rem

Browse source
This commit is contained in:
Kazhnuz 2019-10-17 09:58:36 +02:00
parent af3633ca84
commit 0ffa2940bb
7 changed files with 141 additions and 123 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

165
css/style.css
View file

@ -245,14 +245,14 @@ body {
font-family: Work Sans, WorkSans, sans-serif; font-family: Work Sans, WorkSans, sans-serif;
text-align: left; text-align: left;
font-size: 4.75mm; font-size: 4.75mm;
line-height: 1.55em; line-height: 1.5rem;
color: #073642; color: #073642;
font-weight: 300; font-weight: 300;
} }
body, body #wrapper { body, body #wrapper {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(255, 255, 255, 0) 1px); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(255, 255, 255, 0) 1px);
background-repeat: repeat-y; background-repeat: repeat-y;
background-size: 100% 7.3625mm; background-size: 100% 1.5rem;
} }
.night-mode { .night-mode {
@ -278,7 +278,7 @@ a:hover, a:active {
p { p {
padding: 0; padding: 0;
padding-bottom: 1.55em; padding-bottom: 1.5rem;
margin: 0; margin: 0;
} }
p:last-child { p:last-child {
@ -287,7 +287,7 @@ p:last-child {
ul, ol { ul, ol {
padding: 0; padding: 0;
padding-bottom: 1.55em; padding-bottom: 1.5rem;
margin: 0; margin: 0;
} }
ul ul, ul ol, ol ul, ol ol { ul ul, ul ol, ol ul, ol ol {
@ -296,8 +296,8 @@ ul ul, ul ol, ol ul, ol ol {
} }
ul li, ol li { ul li, ol li {
margin: 0; margin: 0;
margin-left: 1.55em; margin-left: 1.5rem;
line-height: 1.55em; line-height: 1.5rem;
} }
::selection { ::selection {
@ -338,7 +338,7 @@ ul li, ol li {
margin: 0; margin: 0;
} }
.container-typographic .bypass-flex-fontsize { .container-typographic .bypass-flex-fontsize {
line-height: 1.55em; line-height: 1.5rem;
} }
/* 2.3 - Titles */ /* 2.3 - Titles */
@ -375,55 +375,55 @@ h1.page-title-flex > a:hover, h1.page-title-flex > a:focus, h1.page-title-flex >
h1 { h1 {
font-family: Amatic SC; font-family: Amatic SC;
font-size: 15.8175mm; font-size: 3.33rem;
line-height: 1.3963963964em; line-height: 4.5rem;
padding: 0; padding: 0;
padding-bottom: 0.4654654655em; padding-bottom: 1.5rem;
font-weight: 200; font-weight: 200;
} }
h2 { h2 {
font-family: Amatic SC; font-family: Amatic SC;
font-size: 12.94375mm; font-size: 2.725rem;
line-height: 1.1376146789em; line-height: 3rem;
padding: 0; padding: 0;
padding-bottom: 0.5688073394em; padding-bottom: 1.5rem;
font-weight: 200; font-weight: 200;
} }
h3 { h3 {
font-family: Work Sans; font-family: Work Sans;
font-size: 10.5925mm; font-size: 2.23rem;
line-height: 1.3901345291em; line-height: 3rem;
padding: 0; padding: 0;
padding-bottom: 0.6950672646em; padding-bottom: 1.5rem;
font-weight: 500; font-weight: 500;
} }
h4 { h4 {
font-family: Work Sans; font-family: Work Sans;
font-size: 8.66875mm; font-size: 1.825rem;
line-height: 1.698630137em; line-height: 3rem;
padding: 0; padding: 0;
padding-bottom: 0.8493150685em; padding-bottom: 1.5rem;
font-weight: 500; font-weight: 500;
} }
h5 { h5 {
font-family: Work Sans; font-family: Work Sans;
font-size: 6.83525mm; font-size: 1.439rem;
line-height: 1.0771369006em; line-height: 1.5rem;
padding: 0; padding: 0;
padding-bottom: 1.0771369006em; padding-bottom: 1.5rem;
font-weight: 500; font-weight: 500;
} }
h6 { h6 {
font-family: Work Sans; font-family: Work Sans;
font-size: 5.8045mm; font-size: 1.222rem;
line-height: 1.2684124386em; line-height: 1.5rem;
padding: 0; padding: 0;
padding-bottom: 1.2684124386em; padding-bottom: 1.5rem;
font-weight: 800; font-weight: 800;
} }
@ -439,24 +439,27 @@ hr {
} }
/* 2.5 - Wells and quotes */ /* 2.5 - Wells and quotes */
blockquote, .quote, .well { blockquote, .quote {
border-width: 0 0 0 0em; border-width: 0 0 0 0em;
border-style: none; border-style: none;
border-radius: 0px; border-radius: 0px;
margin: 0.75em -0.325em 0.75em -0.325em; margin: 0 0 1.5rem 0;
padding: 0.75em 1em 0.75em 1em; padding: 1.5rem 1rem 1.5rem 1rem;
max-width: 100%; max-width: 100%;
background-color: #eee8d5; background-color: #eee8d5;
font-style: italic; font-style: italic;
color: #073642; color: #073642;
} }
blockquote:before, .quote:before {
content: "";
}
pre, .pre, .well-pre { .well, pre, .pre, .well-pre {
border-width: 0 0 0 0em; border-width: 0 0 0 0em;
border-style: none; border-style: none;
border-radius: 0px; border-radius: 0px;
margin: 0.75em -0.325em 0.75em -0.325em; margin: 0 0 1.5rem 0;
padding: 0.75em 1em 0.75em 1em; padding: 1.5rem 1rem 1.5rem 1rem;
max-width: 100%; max-width: 100%;
background-color: #eee8d5; background-color: #eee8d5;
font-style: italic; font-style: italic;
@ -574,7 +577,7 @@ mark {
/* ------------------ HEADERS ------------------- */ /* ------------------ HEADERS ------------------- */
#page-header { #page-header {
background: #2aa198 url("../img/background.png") center bottom repeat-x; background: #2aa198 url("../img/background.png") center bottom repeat-x;
height: 22.5em; height: 22.5rem;
border-top: 6px solid #073642; border-top: 6px solid #073642;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(255, 255, 255, 0) 1px); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(255, 255, 255, 0) 1px);
background-repeat: repeat-y; background-repeat: repeat-y;
@ -676,8 +679,8 @@ ul.social li a:hover {
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0); box-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
border: none; border: none;
margin: 0; margin: 0;
margin-bottom: 1.5em; margin-bottom: 1.5rem;
padding: 1.5em; padding: 1.5rem;
} }
.card .card-body { .card .card-body {
padding: 0; padding: 0;
@ -689,9 +692,9 @@ ul.social li a:hover {
font-size: 1.1em; font-size: 1.1em;
font-weight: 600; font-weight: 600;
border-radius: 0; border-radius: 0;
padding: 0.75em; padding: 0.75rem;
padding-bottom: 0.75em !important; padding-bottom: 0.75rem !important;
margin-left: -3em; margin-left: -3rem;
} }
.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6, .card-header h7, .card-header h8, .card-header h9, .card-header h10 { .card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6, .card-header h7, .card-header h8, .card-header h9, .card-header h10 {
font-size: 1em; font-size: 1em;
@ -709,16 +712,16 @@ ul.social li a:hover {
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0); box-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
border: none; border: none;
margin: 0; margin: 0;
margin-bottom: 1.5em; margin-bottom: 1.5rem;
padding: 0.75em; padding: 0.75rem;
} }
.smallcard-header, .toast-header, .menu-header { .smallcard-header, .toast-header, .menu-header {
font-size: 1.1em; font-size: 1.1em;
font-weight: 600; font-weight: 600;
border-radius: 0; border-radius: 0;
padding: 0.75em; padding: 0.75rem;
padding-bottom: 0.75em !important; padding-bottom: 0.75rem !important;
margin-left: -3em; margin-left: -3rem;
} }
.smallcard-header h1, .smallcard-header h2, .smallcard-header h3, .smallcard-header h4, .smallcard-header h5, .smallcard-header h6, .smallcard-header h7, .smallcard-header h8, .smallcard-header h9, .smallcard-header h10, .toast-header h1, .toast-header h2, .toast-header h3, .toast-header h4, .toast-header h5, .toast-header h6, .toast-header h7, .toast-header h8, .toast-header h9, .toast-header h10, .menu-header h1, .menu-header h2, .menu-header h3, .menu-header h4, .menu-header h5, .menu-header h6, .menu-header h7, .menu-header h8, .menu-header h9, .menu-header h10 { .smallcard-header h1, .smallcard-header h2, .smallcard-header h3, .smallcard-header h4, .smallcard-header h5, .smallcard-header h6, .smallcard-header h7, .smallcard-header h8, .smallcard-header h9, .smallcard-header h10, .toast-header h1, .toast-header h2, .toast-header h3, .toast-header h4, .toast-header h5, .toast-header h6, .toast-header h7, .toast-header h8, .toast-header h9, .toast-header h10, .menu-header h1, .menu-header h2, .menu-header h3, .menu-header h4, .menu-header h5, .menu-header h6, .menu-header h7, .menu-header h8, .menu-header h9, .menu-header h10 {
font-size: 1em; font-size: 1em;
@ -909,12 +912,14 @@ ul.social li a:hover {
* *
*/ */
.btn { .btn {
padding: 1.5em; padding: 1.5rem;
padding-top: 0.75em; padding-top: 0.5rem;
padding-bottom: 0.75em; padding-bottom: 0.5rem;
margin: 0.75rem;
margin-top: 0.5rem;
margin-bottom: 1.5rem;
line-height: 1.5rem;
height: auto; height: auto;
margin: 0.75em;
margin-bottom: 1em;
border: 0px solid rgba(0, 0, 0, 0.3); border: 0px solid rgba(0, 0, 0, 0.3);
border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px;
position: relative; position: relative;
@ -929,8 +934,8 @@ ul.social li a:hover {
content: " "; content: " ";
position: absolute; position: absolute;
top: 0; top: 0;
left: -0.75em; left: -0.75rem;
right: -0.75em; right: -0.75rem;
bottom: 0; bottom: 0;
z-index: -1; z-index: -1;
transform: skewX(-15deg); transform: skewX(-15deg);
@ -946,14 +951,19 @@ ul.social li a:hover {
.btn:hover, .btn:active { .btn:hover, .btn:active {
border: 0px solid rgba(0, 0, 0, 0.3); border: 0px solid rgba(0, 0, 0, 0.3);
} }
p .btn:last-child {
margin-bottom: 0;
}
.label, label.label, a.label, .chip, a.chip { .label, label.label, a.label, .chip, a.chip {
padding: 0.375em; padding: 0.375rem;
padding-top: 0.1875em; padding-top: 0.125rem;
padding-bottom: 0.1875em; padding-bottom: 0.125rem;
margin: 0.1875rem;
margin-top: 0.125rem;
margin-bottom: 1.5rem;
line-height: 1.5rem;
height: auto; height: auto;
margin: 0.1875em;
margin-bottom: 0.25em;
border: 0px solid rgba(0, 0, 0, 0.3); border: 0px solid rgba(0, 0, 0, 0.3);
border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px;
position: relative; position: relative;
@ -967,8 +977,8 @@ ul.social li a:hover {
content: " "; content: " ";
position: absolute; position: absolute;
top: 0; top: 0;
left: -0.1875em; left: -0.1875rem;
right: -0.1875em; right: -0.1875rem;
bottom: 0; bottom: 0;
z-index: -1; z-index: -1;
transform: skewX(-15deg); transform: skewX(-15deg);
@ -996,7 +1006,7 @@ ul.social li a:hover {
} }
.btn-toolbar { .btn-toolbar {
padding: 0 1.5em; padding: 0 1.5rem;
} }
.btn-group { .btn-group {
@ -1006,7 +1016,7 @@ ul.social li a:hover {
} }
.btn-group .btn { .btn-group .btn {
margin: 0 0.95em 0 0.95em !important; margin: 0 0.95rem 0 0.95rem !important;
} }
/* ------------------ BREADCRUMB ------------------- */ /* ------------------ BREADCRUMB ------------------- */
@ -1014,7 +1024,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
padding-top: 0em; padding-top: 0em;
background-color: transparent; background-color: transparent;
margin: 0; margin: 0;
padding-bottom: 1.5em; padding-bottom: 2rem;
} }
.breadcrumb li.breadcrumb-item { .breadcrumb li.breadcrumb-item {
@ -1025,19 +1035,21 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
} }
.breadcrumb li.breadcrumb-item a, .breadcrumb li.breadcrumb-item span { .breadcrumb li.breadcrumb-item a, .breadcrumb li.breadcrumb-item span {
display: inline-block; display: inline-block;
padding: 1.5em; padding: 1.5rem;
padding-top: 0.75em; padding-top: 0.5rem;
padding-bottom: 0.75em; padding-bottom: 0.5rem;
margin: 0.75rem;
margin-top: 0.5rem;
margin-bottom: 1.5rem;
line-height: 1.5rem;
height: auto; height: auto;
margin: 0.75em;
margin-bottom: 1em;
border: 0px solid rgba(0, 0, 0, 0.3); border: 0px solid rgba(0, 0, 0, 0.3);
border-radius: 0px 0px 0px 0px; border-radius: 0px 0px 0px 0px;
position: relative; position: relative;
z-index: 1; z-index: 1;
overflow: visible; overflow: visible;
color: #073642; color: #073642;
margin: 0 0.6em 0 0.6em; margin: 0 0.6rem 0 0.6rem;
} }
.breadcrumb li.breadcrumb-item a:hover, .breadcrumb li.breadcrumb-item a:active, .breadcrumb li.breadcrumb-item a:focus, a:hover > .breadcrumb li.breadcrumb-item a, a:active > .breadcrumb li.breadcrumb-item a, a:focus > .breadcrumb li.breadcrumb-item a, .breadcrumb li.breadcrumb-item span:hover, .breadcrumb li.breadcrumb-item span:active, .breadcrumb li.breadcrumb-item span:focus, a:hover > .breadcrumb li.breadcrumb-item span, a:active > .breadcrumb li.breadcrumb-item span, a:focus > .breadcrumb li.breadcrumb-item span { .breadcrumb li.breadcrumb-item a:hover, .breadcrumb li.breadcrumb-item a:active, .breadcrumb li.breadcrumb-item a:focus, a:hover > .breadcrumb li.breadcrumb-item a, a:active > .breadcrumb li.breadcrumb-item a, a:focus > .breadcrumb li.breadcrumb-item a, .breadcrumb li.breadcrumb-item span:hover, .breadcrumb li.breadcrumb-item span:active, .breadcrumb li.breadcrumb-item span:focus, a:hover > .breadcrumb li.breadcrumb-item span, a:active > .breadcrumb li.breadcrumb-item span, a:focus > .breadcrumb li.breadcrumb-item span {
text-decoration: none; text-decoration: none;
@ -1046,8 +1058,8 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
content: " "; content: " ";
position: absolute; position: absolute;
top: 0; top: 0;
left: -0.75em; left: -0.75rem;
right: -0.75em; right: -0.75rem;
bottom: 0; bottom: 0;
z-index: -1; z-index: -1;
transform: skewX(-15deg); transform: skewX(-15deg);
@ -1327,7 +1339,15 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
background-color: rgba(26, 26, 26, 0); background-color: rgba(26, 26, 26, 0);
} }
/* social */ /* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
.share-buttons {
margin-top: 1.5rem;
}
.reagir {
text-align: right;
}
.btn-facebook, a.btn-facebook { .btn-facebook, a.btn-facebook {
color: #fdf6e3; color: #fdf6e3;
} }
@ -1389,15 +1409,6 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
background-color: #3d4455; background-color: #3d4455;
} }
/* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
.share-buttons {
margin: 15px;
}
.reagir {
text-align: right;
}
/* ------------------ PREVIEWS ------------------- */ /* ------------------ PREVIEWS ------------------- */
.previews-section { .previews-section {
display: flex; display: flex;

2
css/style.css.map
View file

File diff suppressed because one or more lines are too long

32
scss/_buttons.scss
View file

@ -7,8 +7,8 @@
$color-button-light: $color-light; $color-button-light: $color-light;
$color-button-dark: $color-dark; $color-button-dark: $color-dark;
$button_large: 1.5em; $button_large: 1.5rem;
$button_small: 0.375em; $button_small: 0.375rem;
@mixin biseau($size) { @mixin biseau($size) {
position: relative; position: relative;
@ -30,11 +30,14 @@ $button_small: 0.375em;
@mixin button($size) { @mixin button($size) {
padding: $size; padding: $size;
padding-top: $size/2; padding-top: $size/3;
padding-bottom:$size/2; padding-bottom: $size/3;
height:auto;
margin:$size/2; margin:$size/2;
margin-bottom:$size/1.5; margin-top: $size/3;
margin-bottom: 1.5rem;
//font-size: 4.75mm;
line-height:1.5rem;
height:auto;
@include borders(); @include borders();
@include border-radius(); @include border-radius();
@ -86,6 +89,10 @@ $button_small: 0.375em;
&:hover, &:active { &:hover, &:active {
@include borders(); @include borders();
} }
p &:last-child {
margin-bottom:0;
}
} }
.label, label.label, a.label, .chip, a.chip { .label, label.label, a.label, .chip, a.chip {
@ -100,7 +107,7 @@ $button_small: 0.375em;
// BUTTONS GROUPS // BUTTONS GROUPS
$grouped-test: $button-large/1.5 - 0.05em ; $grouped-test: $button-large/1.5 - 0.05rem ;
.btn-toolbar { .btn-toolbar {
padding: 0 $button-large; padding: 0 $button-large;
@ -122,7 +129,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
padding-top: 0em; padding-top: 0em;
background-color:transparent; background-color:transparent;
margin: 0; margin: 0;
padding-bottom:1.5em; padding-bottom:2rem;
} }
.breadcrumb li.breadcrumb-item { .breadcrumb li.breadcrumb-item {
@ -176,8 +183,15 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
&-link {@include button-color(transparent, $color-dark);} &-link {@include button-color(transparent, $color-dark);}
} }
/* social */ /* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
.share-buttons {
margin-top:1.5rem;
}
.reagir {
text-align:right;
}
.btn, a.btn { .btn, a.btn {
&-facebook {@include button-color(#3B5998, $color-button-light);} &-facebook {@include button-color(#3B5998, $color-button-light);}
&-twitter {@include button-color(#55ACEE, $color-button-light);} &-twitter {@include button-color(#55ACEE, $color-button-light);}

6
scss/_cards.scss
View file

@ -5,8 +5,8 @@
* *
*/ */
$card-bigpad: 1.5em; $card-bigpad: 1.5rem;
$card-smallpad: 0.75em; $card-smallpad: 0.75rem;
@mixin card($size) { @mixin card($size) {
@include border-radius(); @include border-radius();
@ -14,7 +14,7 @@ $card-smallpad: 0.75em;
box-shadow: $large-shadow; box-shadow: $large-shadow;
border: none; border: none;
margin:0; margin:0;
margin-bottom:1.5em; margin-bottom:1.5rem;
padding: $size; padding: $size;
} }

10
scss/_commons.scss
View file

@ -6,16 +6,6 @@
@import 'buttons'; @import 'buttons';
/* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
.share-buttons {
margin:15px;
}
.reagir {
text-align:right;
}
/* ------------------ PREVIEWS ------------------- */ /* ------------------ PREVIEWS ------------------- */
.previews-section { .previews-section {

2
scss/_global.scss
View file

@ -32,7 +32,7 @@
#page-header { #page-header {
background: $color-turquoise url('../img/background.png') center bottom repeat-x; background: $color-turquoise url('../img/background.png') center bottom repeat-x;
height:15*1.5em; height:15*1.5rem;
border-top: 6px solid $color-dark2; border-top: 6px solid $color-dark2;
@include limitedSize(); @include limitedSize();

47
scss/_typography.scss
View file

@ -10,8 +10,8 @@
/* 2.2 - Global Typography */ /* 2.2 - Global Typography */
$baseline: 1.55; $baseline: 1.5;
$base_lineheight: $baseline * 1em; $base_lineheight: $baseline * 1rem;
$base_fontsize: 4.75mm; $base_fontsize: 4.75mm;
@mixin paragraph() { @mixin paragraph() {
@ -31,7 +31,7 @@ body {
&, #wrapper { &, #wrapper {
background-image: linear-gradient(to bottom, rgba(0,0,0,0.25) 0, rgba(255, 255, 255, 0) 1px); background-image: linear-gradient(to bottom, rgba(0,0,0,0.25) 0, rgba(255, 255, 255, 0) 1px);
background-repeat: repeat-y; background-repeat: repeat-y;
background-size: 100% $baseline * $base_fontsize;} background-size: 100% 1.5rem;}
} }
.night-mode { .night-mode {
@ -118,15 +118,13 @@ ul, ol {
/* 2.3 - Titles */ /* 2.3 - Titles */
@mixin newTitle($font, $size, $lineNumber, $weight) { @mixin newTitle($font, $size, $weight) {
$linesize: $lineNumber * $baseline; $lineNumber: ceil($size / 1.5);
$lineheight: $linesize / $size;
$padding: $lineheight / $lineNumber;
font-family: $font; font-family: $font;
font-size: $size * $base_fontsize; font-size: $size * 1rem;
line-height: $lineheight * 1em; line-height: $lineNumber * 1.5rem;
padding: 0; padding: 0;
padding-bottom: $padding * 1em; padding-bottom: 1.5rem;
font-weight: $weight; font-weight: $weight;
} }
@ -167,28 +165,28 @@ h1, h2, h3, h4, h5, h6, h7 {
h1 { h1 {
//@include title(3.33em, 1.2em, 0.0em, 0.2em, 200); //@include title(3.33em, 1.2em, 0.0em, 0.2em, 200);
@include newTitle(Amatic SC, 3.33, 3, 200); @include newTitle(Amatic SC, 3.33, 200);
} }
h2 { h2 {
//@include title(2.725em, 1.125em, 0em, 0.5625em, 200); //@include title(2.725em, 1.125em, 0em, 0.5625em, 200);
@include newTitle(Amatic SC, 2.725, 2, 200); @include newTitle(Amatic SC, 2.725, 200);
} }
h3 { h3 {
@include newTitle(Work Sans, 2.23, 2, 500); @include newTitle(Work Sans, 2.23, 500);
} }
h4 { h4 {
@include newTitle(Work Sans, 1.825, 2, 500); @include newTitle(Work Sans, 1.825, 500);
} }
h5 { h5 {
@include newTitle(Work Sans, 1.439, 1, 500); @include newTitle(Work Sans, 1.439, 500);
} }
h6 { h6 {
@include newTitle(Work Sans, 1.222, 1, 800); @include newTitle(Work Sans, 1.222, 800);
} }
/* 2.4 - hr */ /* 2.4 - hr */
@ -210,8 +208,8 @@ hr {
border-style: none; border-style: none;
border-radius: 0px; border-radius: 0px;
margin: 0.75em -0.325em 0.75em -0.325em; margin: 0 0 1.5rem 0;
padding: 0.75em 1em 0.75em 1em; padding: 1.5rem 1rem 1.5rem 1rem;
max-width: 100%; max-width: 100%;
background-color: $color-light2; background-color: $color-light2;
@ -219,13 +217,18 @@ hr {
color: $color-dark2; color: $color-dark2;
} }
blockquote, .quote, .well { blockquote, .quote {
@include well();
&:before {
content:"";
}
}
.well, pre, .pre, .well-pre {
@include well(); @include well();
} }
pre, .pre, .well-pre {
@include well();
}
code { code {
background:transparent; background:transparent;