ViMaSter/hackertours-theme
Watch
0
0
Fork
You've already forked hackertours-theme
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Set unitless lineheight. Not bigger font for mobile.

Browse source
This commit is contained in:
Fredrik Jonsson 2022-01-14 14:54:16 +01:00
commit ef80ad8ef8
1 changed files with 29 additions and 109 deletions
Download patch file Download diff file Expand all files Collapse all files

67
assets/sass/reset/sections/_sections.scss
View file

@ -21,92 +21,51 @@ body {
// `article` contexts in Chrome, Firefox, and Safari.
h1,
%h1 {
// Set the font-size and line-height while keeping a proper vertical rhythm.
@include type-layout(xxl, 1.5);
// Set the font-size while keeping a proper vertical rhythm.
@include font-size(xxl);
// Set 1 unit of vertical rhythm on the top and bottom margins.
@include margin-top(1, xxl);
@include margin-bottom(1, xxl);
line-height: 1.3;
}
h2,
%h2 {
@include type-layout(xl, 1.5);
@include font-size(xl);
@include margin-top(1, xl);
@include margin-bottom(1, xl);
line-height: 1.3;
}
h3,
%h3 {
@include type-layout(l, 1.5);
@include font-size(l);
@include margin-top(1, l);
@include margin-bottom(1, l);
line-height: 1.3;
}
h4,
%h4 {
@include type-layout(m, 1);
@include font-size(m);
@include margin-top(1, m);
@include margin-bottom(1, m);
line-height: 1.3;
}
h5,
%h5 {
@include type-layout(s, 1);
@include font-size(s);
@include margin-top(1, s);
@include margin-bottom(1, s);
line-height: 1.3;
}
h6,
%h6 {
@include type-layout(xs, 1);
@include font-size(xs);
@include margin-top(1, xs);
@include margin-bottom(1, xs);
}
@include respond-to(s) {
h1,
%h1 {
// Set the font-size and line-height while keeping a proper vertical rhythm.
@include type-layout(xxl-2, 2);
// Set 1 unit of vertical rhythm on the top and bottom margins.
@include margin-top(1, xxl-2);
@include margin-bottom(1, xxl-2);
}
h2,
%h2 {
@include type-layout(xl-2, 1.5);
@include margin-top(1, xl-2);
@include margin-bottom(1, xl-2);
}
h3,
%h3 {
@include type-layout(l-2, 1.5);
@include margin-top(1, l-2);
@include margin-bottom(1, l-2);
}
h4,
%h4 {
@include type-layout(m-2, 1);
@include margin-top(1, m-2);
@include margin-bottom(1, m-2);
}
h5,
%h5 {
@include type-layout(s-2, 1);
@include margin-top(1, s-2);
@include margin-bottom(1, s-2);
}
h6,
%h6 {
@include type-layout(xs-2, 1);
@include margin-top(1, xs-2);
@include margin-bottom(1, xs-2);
}
line-height: 1.3;
}