aitzol/Plume
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Better header line height (#418)

Browse Source 
This change also remote all units for line-height to have more consistent styles and better cascading support. This solve the too small line height for multi line header in article and also add styling for h1 to h6 (previously h3 to h6 was not styled at all)
This commit is contained in:
Dominique Feyer 2019-01-09 17:46:03 +01:00 committed by Baptiste Gelez
parent c4a4ea5b6c
commit 671c340aa8
3 changed files with 25 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
static/css/_article.scss
View File

@ -16,7 +16,7 @@ main article {
margin: 2.5em auto;
font-family: $lora;
font-size: 1.2em;
line-height: 1.7em;
line-height: 1.7;
a:hover {
text-decoration: underline;
@ -260,7 +260,7 @@ main .article-meta {
padding: 1.25em 0;
font-family: $lora;
font-size: 1.1em;
line-height: 1.4em;
line-height: 1.4;
text-align: left;
}
}

2
static/css/_forms.scss
View File

@ -34,7 +34,7 @@ textarea {
font-family: $lora;
font-size: 1.1em;
line-height: 1.5em;
line-height: 1.5;
}
input[type="checkbox"] {

28
static/css/_global.scss
View File

@ -55,13 +55,20 @@ body > main > .h-entry, .h-feed {
}
main {
h1, h2, h3, h4, h5, h6 {
font-family: $route159;
line-height: 1.15;
font-weight: 300;
&.article {
max-width: 40rem;
}
}
h1 {
font-family: $route159;
font-size: 2.5em;
font-weight: 300;
margin-top: 1em;
&.article {
max-width: 40rem;
margin: 1em auto 0.5em;
font-family: $playfair;
font-size: 2.5em;
@ -70,18 +77,27 @@ main {
}
h2 {
font-family: $route159;
font-size: 1.75em;
font-weight: 300;
&.article {
max-width: 40rem;
margin: auto;
font-size: 1.25em;
margin-bottom: 0.5em;
}
}
h3, h4, h5, h6 {
font-size: 1.5em;
font-weight: 300;
&.article {
margin: auto;
font-size: 1.1em;
margin-bottom: 0.5em;
}
}
.cover {
padding: 0px;
margin: 0px;
@ -175,7 +191,7 @@ p.error {
font-family: $lora;
font-size: 1em;
line-height: 1.25em;
line-height: 1.25;
text-align: left;
overflow: hidden;
}