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
2 changed files with 29 additions and 109 deletions
Download patch file Download diff file Expand all files Collapse all files

8
assets/sass/reset/document/_document.scss
View file

@ -6,8 +6,10 @@
html {
// Change the default font family in all browsers (opinionated).
@include typeface(body);
// Set base font size in percent.
font-size: $base-font-size / $browser-font-size * 100%;
// Correct the line height in all browsers.
@include define-type-sizing();
line-height: 1.5;
// Prevent adjustments of font size.
-webkit-text-size-adjust: none;
text-size-adjust: none;
@ -20,10 +22,6 @@ html {
scroll-behavior: smooth;
// Improve text rendering.
-webkit-font-smoothing: antialiased;
@include respond-to(xxl) {
@include define-type-sizing($base-font-size-2, $base-line-height-2);
}
}

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;
}