vertical rythm
This commit is contained in:
parent
86c5ab4d22
commit
41fdb8ce1c
4 changed files with 47 additions and 81 deletions
|
@ -443,55 +443,37 @@ h6, .h6-like {
|
|||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* Vertical rythm for blocks */
|
||||
p,
|
||||
.p-like,
|
||||
ul,
|
||||
ol,
|
||||
dl,
|
||||
blockquote,
|
||||
pre,
|
||||
td,
|
||||
th,
|
||||
label,
|
||||
textarea,
|
||||
caption,
|
||||
details,
|
||||
figure {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0;
|
||||
line-height: 1.5;
|
||||
/* Vertical rythm */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
dd {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
/* Avoid top margins on first content element */
|
||||
p:first-child,
|
||||
.p-like:first-child,
|
||||
ul:first-child,
|
||||
ol:first-child,
|
||||
dl:first-child,
|
||||
blockquote:first-child,
|
||||
label:first-child,
|
||||
pre:first-child,
|
||||
h1:first-child,
|
||||
.h1-like:first-child,
|
||||
h2:first-child,
|
||||
.h2-like:first-child,
|
||||
h3:first-child,
|
||||
.h3-like:first-child,
|
||||
h4:first-child,
|
||||
.h4-like:first-child,
|
||||
h5:first-child,
|
||||
.h5-like:first-child,
|
||||
h6:first-child,
|
||||
.h6-like:first-child {
|
||||
p,
|
||||
address,
|
||||
ol,
|
||||
ul,
|
||||
dl,
|
||||
li,
|
||||
blockquote,
|
||||
pre {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Avoid margins on nested elements */
|
||||
li p,
|
||||
li .p-like,
|
||||
li ul,
|
||||
li ol {
|
||||
li ol,
|
||||
ol ol,
|
||||
ul ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -28,6 +28,11 @@ $line-height-s : 1.3 !default;
|
|||
$line-height-base : 1.5 !default;
|
||||
$line-height-l : 1.7 !default;
|
||||
|
||||
// default margin-bottom
|
||||
$margin-bottom-base : 1rem !default;
|
||||
$headings-margin-bottom : $margin-bottom-base /2 !default;
|
||||
$paragraph-margin-bottom: $margin-bottom-base !default;
|
||||
|
||||
// font weights
|
||||
$weight-light : 200 !default;
|
||||
$weight-book : 300 !default;
|
||||
|
|
|
@ -80,62 +80,41 @@ h6, .h6-like {
|
|||
font-weight: $weight-medium;
|
||||
}
|
||||
|
||||
/* Vertical rythm for blocks */
|
||||
p,
|
||||
.p-like,
|
||||
ul,
|
||||
ol,
|
||||
dl,
|
||||
blockquote,
|
||||
pre,
|
||||
td,
|
||||
th,
|
||||
label,
|
||||
textarea,
|
||||
caption,
|
||||
details,
|
||||
figure {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0;
|
||||
line-height: $line-height-base;
|
||||
/* Vertical rythm */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
dd {
|
||||
margin-top: 0;
|
||||
margin-bottom: $headings-margin-bottom;
|
||||
}
|
||||
|
||||
/* Avoid top margins on first content element */
|
||||
p,
|
||||
.p-like,
|
||||
ul,
|
||||
address,
|
||||
ol,
|
||||
ul,
|
||||
dl,
|
||||
li,
|
||||
blockquote,
|
||||
label,
|
||||
pre,
|
||||
h1,
|
||||
.h1-like,
|
||||
h2,
|
||||
.h2-like,
|
||||
h3,
|
||||
.h3-like,
|
||||
h4,
|
||||
.h4-like,
|
||||
h5,
|
||||
.h5-like,
|
||||
h6,
|
||||
.h6-like {
|
||||
&:first-child {
|
||||
pre {
|
||||
margin-top: 0;
|
||||
}
|
||||
margin-bottom: $paragraph-margin-bottom;
|
||||
}
|
||||
|
||||
/* Avoid margins on nested elements */
|
||||
li p,
|
||||
li .p-like,
|
||||
li ul,
|
||||
li ol {
|
||||
li ol,
|
||||
ol ol,
|
||||
ul ul {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
/* Alternate font-sizing */
|
||||
.smaller {
|
||||
font-size: 0.6em;
|
||||
|
|
Loading…
Reference in a new issue