improvement: make vertical rythm work by using rem
This commit is contained in:
Kazhnuz
parent
af3633ca84
commit
0ffa2940bb
7 changed files with 141 additions and 123 deletions
165
css/style.css
165
css/style.css
|
|
@ -245,14 +245,14 @@ body {
|
|||
font-family: Work Sans, WorkSans, sans-serif;
|
||||
text-align: left;
|
||||
font-size: 4.75mm;
|
||||
line-height: 1.55em;
|
||||
line-height: 1.5rem;
|
||||
color: #073642;
|
||||
font-weight: 300;
|
||||
}
|
||||
body, body #wrapper {
|
||||
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(255, 255, 255, 0) 1px);
|
||||
background-repeat: repeat-y;
|
||||
background-size: 100% 7.3625mm;
|
||||
background-size: 100% 1.5rem;
|
||||
}
|
||||
|
||||
.night-mode {
|
||||
|
|
@ -278,7 +278,7 @@ a:hover, a:active {
|
|||
|
||||
p {
|
||||
padding: 0;
|
||||
padding-bottom: 1.55em;
|
||||
padding-bottom: 1.5rem;
|
||||
margin: 0;
|
||||
}
|
||||
p:last-child {
|
||||
|
|
@ -287,7 +287,7 @@ p:last-child {
|
|||
|
||||
ul, ol {
|
||||
padding: 0;
|
||||
padding-bottom: 1.55em;
|
||||
padding-bottom: 1.5rem;
|
||||
margin: 0;
|
||||
}
|
||||
ul ul, ul ol, ol ul, ol ol {
|
||||
|
|
@ -296,8 +296,8 @@ ul ul, ul ol, ol ul, ol ol {
|
|||
}
|
||||
ul li, ol li {
|
||||
margin: 0;
|
||||
margin-left: 1.55em;
|
||||
line-height: 1.55em;
|
||||
margin-left: 1.5rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
::selection {
|
||||
|
|
@ -338,7 +338,7 @@ ul li, ol li {
|
|||
margin: 0;
|
||||
}
|
||||
.container-typographic .bypass-flex-fontsize {
|
||||
line-height: 1.55em;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
/* 2.3 - Titles */
|
||||
|
|
@ -375,55 +375,55 @@ h1.page-title-flex > a:hover, h1.page-title-flex > a:focus, h1.page-title-flex >
|
|||
|
||||
h1 {
|
||||
font-family: Amatic SC;
|
||||
font-size: 15.8175mm;
|
||||
line-height: 1.3963963964em;
|
||||
font-size: 3.33rem;
|
||||
line-height: 4.5rem;
|
||||
padding: 0;
|
||||
padding-bottom: 0.4654654655em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: Amatic SC;
|
||||
font-size: 12.94375mm;
|
||||
line-height: 1.1376146789em;
|
||||
font-size: 2.725rem;
|
||||
line-height: 3rem;
|
||||
padding: 0;
|
||||
padding-bottom: 0.5688073394em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-family: Work Sans;
|
||||
font-size: 10.5925mm;
|
||||
line-height: 1.3901345291em;
|
||||
font-size: 2.23rem;
|
||||
line-height: 3rem;
|
||||
padding: 0;
|
||||
padding-bottom: 0.6950672646em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-family: Work Sans;
|
||||
font-size: 8.66875mm;
|
||||
line-height: 1.698630137em;
|
||||
font-size: 1.825rem;
|
||||
line-height: 3rem;
|
||||
padding: 0;
|
||||
padding-bottom: 0.8493150685em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-family: Work Sans;
|
||||
font-size: 6.83525mm;
|
||||
line-height: 1.0771369006em;
|
||||
font-size: 1.439rem;
|
||||
line-height: 1.5rem;
|
||||
padding: 0;
|
||||
padding-bottom: 1.0771369006em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-family: Work Sans;
|
||||
font-size: 5.8045mm;
|
||||
line-height: 1.2684124386em;
|
||||
font-size: 1.222rem;
|
||||
line-height: 1.5rem;
|
||||
padding: 0;
|
||||
padding-bottom: 1.2684124386em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
|
|
@ -439,24 +439,27 @@ hr {
|
|||
}
|
||||
|
||||
/* 2.5 - Wells and quotes */
|
||||
blockquote, .quote, .well {
|
||||
blockquote, .quote {
|
||||
border-width: 0 0 0 0em;
|
||||
border-style: none;
|
||||
border-radius: 0px;
|
||||
margin: 0.75em -0.325em 0.75em -0.325em;
|
||||
padding: 0.75em 1em 0.75em 1em;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding: 1.5rem 1rem 1.5rem 1rem;
|
||||
max-width: 100%;
|
||||
background-color: #eee8d5;
|
||||
font-style: italic;
|
||||
color: #073642;
|
||||
}
|
||||
blockquote:before, .quote:before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre, .pre, .well-pre {
|
||||
.well, pre, .pre, .well-pre {
|
||||
border-width: 0 0 0 0em;
|
||||
border-style: none;
|
||||
border-radius: 0px;
|
||||
margin: 0.75em -0.325em 0.75em -0.325em;
|
||||
padding: 0.75em 1em 0.75em 1em;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding: 1.5rem 1rem 1.5rem 1rem;
|
||||
max-width: 100%;
|
||||
background-color: #eee8d5;
|
||||
font-style: italic;
|
||||
|
|
@ -574,7 +577,7 @@ mark {
|
|||
/* ------------------ HEADERS ------------------- */
|
||||
#page-header {
|
||||
background: #2aa198 url("../img/background.png") center bottom repeat-x;
|
||||
height: 22.5em;
|
||||
height: 22.5rem;
|
||||
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-repeat: repeat-y;
|
||||
|
|
@ -676,8 +679,8 @@ ul.social li a:hover {
|
|||
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
|
||||
border: none;
|
||||
margin: 0;
|
||||
margin-bottom: 1.5em;
|
||||
padding: 1.5em;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
.card .card-body {
|
||||
padding: 0;
|
||||
|
|
@ -689,9 +692,9 @@ ul.social li a:hover {
|
|||
font-size: 1.1em;
|
||||
font-weight: 600;
|
||||
border-radius: 0;
|
||||
padding: 0.75em;
|
||||
padding-bottom: 0.75em !important;
|
||||
margin-left: -3em;
|
||||
padding: 0.75rem;
|
||||
padding-bottom: 0.75rem !important;
|
||||
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 {
|
||||
font-size: 1em;
|
||||
|
|
@ -709,16 +712,16 @@ ul.social li a:hover {
|
|||
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
|
||||
border: none;
|
||||
margin: 0;
|
||||
margin-bottom: 1.5em;
|
||||
padding: 0.75em;
|
||||
margin-bottom: 1.5rem;
|
||||
padding: 0.75rem;
|
||||
}
|
||||
.smallcard-header, .toast-header, .menu-header {
|
||||
font-size: 1.1em;
|
||||
font-weight: 600;
|
||||
border-radius: 0;
|
||||
padding: 0.75em;
|
||||
padding-bottom: 0.75em !important;
|
||||
margin-left: -3em;
|
||||
padding: 0.75rem;
|
||||
padding-bottom: 0.75rem !important;
|
||||
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 {
|
||||
font-size: 1em;
|
||||
|
|
@ -909,12 +912,14 @@ ul.social li a:hover {
|
|||
*
|
||||
*/
|
||||
.btn {
|
||||
padding: 1.5em;
|
||||
padding-top: 0.75em;
|
||||
padding-bottom: 0.75em;
|
||||
padding: 1.5rem;
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
margin: 0.75rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
line-height: 1.5rem;
|
||||
height: auto;
|
||||
margin: 0.75em;
|
||||
margin-bottom: 1em;
|
||||
border: 0px solid rgba(0, 0, 0, 0.3);
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
position: relative;
|
||||
|
|
@ -929,8 +934,8 @@ ul.social li a:hover {
|
|||
content: " ";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -0.75em;
|
||||
right: -0.75em;
|
||||
left: -0.75rem;
|
||||
right: -0.75rem;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
transform: skewX(-15deg);
|
||||
|
|
@ -946,14 +951,19 @@ ul.social li a:hover {
|
|||
.btn:hover, .btn:active {
|
||||
border: 0px solid rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
p .btn:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.label, label.label, a.label, .chip, a.chip {
|
||||
padding: 0.375em;
|
||||
padding-top: 0.1875em;
|
||||
padding-bottom: 0.1875em;
|
||||
padding: 0.375rem;
|
||||
padding-top: 0.125rem;
|
||||
padding-bottom: 0.125rem;
|
||||
margin: 0.1875rem;
|
||||
margin-top: 0.125rem;
|
||||
margin-bottom: 1.5rem;
|
||||
line-height: 1.5rem;
|
||||
height: auto;
|
||||
margin: 0.1875em;
|
||||
margin-bottom: 0.25em;
|
||||
border: 0px solid rgba(0, 0, 0, 0.3);
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
position: relative;
|
||||
|
|
@ -967,8 +977,8 @@ ul.social li a:hover {
|
|||
content: " ";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -0.1875em;
|
||||
right: -0.1875em;
|
||||
left: -0.1875rem;
|
||||
right: -0.1875rem;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
transform: skewX(-15deg);
|
||||
|
|
@ -996,7 +1006,7 @@ ul.social li a:hover {
|
|||
}
|
||||
|
||||
.btn-toolbar {
|
||||
padding: 0 1.5em;
|
||||
padding: 0 1.5rem;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
|
|
@ -1006,7 +1016,7 @@ ul.social li a:hover {
|
|||
}
|
||||
|
||||
.btn-group .btn {
|
||||
margin: 0 0.95em 0 0.95em !important;
|
||||
margin: 0 0.95rem 0 0.95rem !important;
|
||||
}
|
||||
|
||||
/* ------------------ BREADCRUMB ------------------- */
|
||||
|
|
@ -1014,7 +1024,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
padding-top: 0em;
|
||||
background-color: transparent;
|
||||
margin: 0;
|
||||
padding-bottom: 1.5em;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
.breadcrumb li.breadcrumb-item {
|
||||
|
|
@ -1025,19 +1035,21 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
}
|
||||
.breadcrumb li.breadcrumb-item a, .breadcrumb li.breadcrumb-item span {
|
||||
display: inline-block;
|
||||
padding: 1.5em;
|
||||
padding-top: 0.75em;
|
||||
padding-bottom: 0.75em;
|
||||
padding: 1.5rem;
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.5rem;
|
||||
margin: 0.75rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
line-height: 1.5rem;
|
||||
height: auto;
|
||||
margin: 0.75em;
|
||||
margin-bottom: 1em;
|
||||
border: 0px solid rgba(0, 0, 0, 0.3);
|
||||
border-radius: 0px 0px 0px 0px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
overflow: visible;
|
||||
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 {
|
||||
text-decoration: none;
|
||||
|
|
@ -1046,8 +1058,8 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
content: " ";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -0.75em;
|
||||
right: -0.75em;
|
||||
left: -0.75rem;
|
||||
right: -0.75rem;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
transform: skewX(-15deg);
|
||||
|
|
@ -1327,7 +1339,15 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
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 {
|
||||
color: #fdf6e3;
|
||||
}
|
||||
|
|
@ -1389,15 +1409,6 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
background-color: #3d4455;
|
||||
}
|
||||
|
||||
/* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
|
||||
.share-buttons {
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.reagir {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* ------------------ PREVIEWS ------------------- */
|
||||
.previews-section {
|
||||
display: flex;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -7,8 +7,8 @@
|
|||
$color-button-light: $color-light;
|
||||
$color-button-dark: $color-dark;
|
||||
|
||||
$button_large: 1.5em;
|
||||
$button_small: 0.375em;
|
||||
$button_large: 1.5rem;
|
||||
$button_small: 0.375rem;
|
||||
|
||||
@mixin biseau($size) {
|
||||
position: relative;
|
||||
|
|
@ -30,11 +30,14 @@ $button_small: 0.375em;
|
|||
|
||||
@mixin button($size) {
|
||||
padding: $size;
|
||||
padding-top: $size/2;
|
||||
padding-bottom:$size/2;
|
||||
height:auto;
|
||||
padding-top: $size/3;
|
||||
padding-bottom: $size/3;
|
||||
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 border-radius();
|
||||
|
||||
|
|
@ -86,6 +89,10 @@ $button_small: 0.375em;
|
|||
&:hover, &:active {
|
||||
@include borders();
|
||||
}
|
||||
|
||||
p &:last-child {
|
||||
margin-bottom:0;
|
||||
}
|
||||
}
|
||||
|
||||
.label, label.label, a.label, .chip, a.chip {
|
||||
|
|
@ -100,7 +107,7 @@ $button_small: 0.375em;
|
|||
|
||||
// BUTTONS GROUPS
|
||||
|
||||
$grouped-test: $button-large/1.5 - 0.05em ;
|
||||
$grouped-test: $button-large/1.5 - 0.05rem ;
|
||||
|
||||
.btn-toolbar {
|
||||
padding: 0 $button-large;
|
||||
|
|
@ -122,7 +129,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
padding-top: 0em;
|
||||
background-color:transparent;
|
||||
margin: 0;
|
||||
padding-bottom:1.5em;
|
||||
padding-bottom:2rem;
|
||||
}
|
||||
|
||||
.breadcrumb li.breadcrumb-item {
|
||||
|
|
@ -176,8 +183,15 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
|||
&-link {@include button-color(transparent, $color-dark);}
|
||||
}
|
||||
|
||||
/* social */
|
||||
/* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
|
||||
|
||||
.share-buttons {
|
||||
margin-top:1.5rem;
|
||||
}
|
||||
|
||||
.reagir {
|
||||
text-align:right;
|
||||
}
|
||||
.btn, a.btn {
|
||||
&-facebook {@include button-color(#3B5998, $color-button-light);}
|
||||
&-twitter {@include button-color(#55ACEE, $color-button-light);}
|
||||
|
|
|
|||
|
|
@ -5,8 +5,8 @@
|
|||
*
|
||||
*/
|
||||
|
||||
$card-bigpad: 1.5em;
|
||||
$card-smallpad: 0.75em;
|
||||
$card-bigpad: 1.5rem;
|
||||
$card-smallpad: 0.75rem;
|
||||
|
||||
@mixin card($size) {
|
||||
@include border-radius();
|
||||
|
|
@ -14,7 +14,7 @@ $card-smallpad: 0.75em;
|
|||
box-shadow: $large-shadow;
|
||||
border: none;
|
||||
margin:0;
|
||||
margin-bottom:1.5em;
|
||||
margin-bottom:1.5rem;
|
||||
padding: $size;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -6,16 +6,6 @@
|
|||
|
||||
@import 'buttons';
|
||||
|
||||
/* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
|
||||
|
||||
.share-buttons {
|
||||
margin:15px;
|
||||
}
|
||||
|
||||
.reagir {
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
/* ------------------ PREVIEWS ------------------- */
|
||||
|
||||
.previews-section {
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@
|
|||
|
||||
#page-header {
|
||||
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;
|
||||
@include limitedSize();
|
||||
|
||||
|
|
|
|||
|
|
@ -10,8 +10,8 @@
|
|||
|
||||
/* 2.2 - Global Typography */
|
||||
|
||||
$baseline: 1.55;
|
||||
$base_lineheight: $baseline * 1em;
|
||||
$baseline: 1.5;
|
||||
$base_lineheight: $baseline * 1rem;
|
||||
$base_fontsize: 4.75mm;
|
||||
|
||||
@mixin paragraph() {
|
||||
|
|
@ -31,7 +31,7 @@ body {
|
|||
&, #wrapper {
|
||||
background-image: linear-gradient(to bottom, rgba(0,0,0,0.25) 0, rgba(255, 255, 255, 0) 1px);
|
||||
background-repeat: repeat-y;
|
||||
background-size: 100% $baseline * $base_fontsize;}
|
||||
background-size: 100% 1.5rem;}
|
||||
}
|
||||
|
||||
.night-mode {
|
||||
|
|
@ -118,15 +118,13 @@ ul, ol {
|
|||
|
||||
/* 2.3 - Titles */
|
||||
|
||||
@mixin newTitle($font, $size, $lineNumber, $weight) {
|
||||
$linesize: $lineNumber * $baseline;
|
||||
$lineheight: $linesize / $size;
|
||||
$padding: $lineheight / $lineNumber;
|
||||
@mixin newTitle($font, $size, $weight) {
|
||||
$lineNumber: ceil($size / 1.5);
|
||||
font-family: $font;
|
||||
font-size: $size * $base_fontsize;
|
||||
line-height: $lineheight * 1em;
|
||||
font-size: $size * 1rem;
|
||||
line-height: $lineNumber * 1.5rem;
|
||||
padding: 0;
|
||||
padding-bottom: $padding * 1em;
|
||||
padding-bottom: 1.5rem;
|
||||
font-weight: $weight;
|
||||
}
|
||||
|
||||
|
|
@ -167,28 +165,28 @@ h1, h2, h3, h4, h5, h6, h7 {
|
|||
|
||||
h1 {
|
||||
//@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 {
|
||||
//@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 {
|
||||
@include newTitle(Work Sans, 2.23, 2, 500);
|
||||
@include newTitle(Work Sans, 2.23, 500);
|
||||
}
|
||||
|
||||
h4 {
|
||||
@include newTitle(Work Sans, 1.825, 2, 500);
|
||||
@include newTitle(Work Sans, 1.825, 500);
|
||||
}
|
||||
|
||||
h5 {
|
||||
@include newTitle(Work Sans, 1.439, 1, 500);
|
||||
@include newTitle(Work Sans, 1.439, 500);
|
||||
}
|
||||
|
||||
h6 {
|
||||
@include newTitle(Work Sans, 1.222, 1, 800);
|
||||
@include newTitle(Work Sans, 1.222, 800);
|
||||
}
|
||||
|
||||
/* 2.4 - hr */
|
||||
|
|
@ -210,8 +208,8 @@ hr {
|
|||
border-style: none;
|
||||
border-radius: 0px;
|
||||
|
||||
margin: 0.75em -0.325em 0.75em -0.325em;
|
||||
padding: 0.75em 1em 0.75em 1em;
|
||||
margin: 0 0 1.5rem 0;
|
||||
padding: 1.5rem 1rem 1.5rem 1rem;
|
||||
|
||||
max-width: 100%;
|
||||
background-color: $color-light2;
|
||||
|
|
@ -219,13 +217,18 @@ hr {
|
|||
color: $color-dark2;
|
||||
}
|
||||
|
||||
blockquote, .quote, .well {
|
||||
blockquote, .quote {
|
||||
@include well();
|
||||
&:before {
|
||||
content:"";
|
||||
}
|
||||
}
|
||||
|
||||
.well, pre, .pre, .well-pre {
|
||||
@include well();
|
||||
}
|
||||
|
||||
pre, .pre, .well-pre {
|
||||
@include well();
|
||||
}
|
||||
|
||||
|
||||
code {
|
||||
background:transparent;
|
||||
|
|
|
|||
Loading…
Reference in a new issue