Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: Use rem for font sizes in post headings (#13720) 

Size of headings increased proportionally with their nesting because
their size was relative to the parent element (used em). This commit
makes headings from posts use rem instead which are relative to the
root HTML element.

<h1><div><h1>test</h1></div></h1> looks the same as <h1>test</h1> now.
This commit is contained in:
Bianca Nenciu 2021-07-14 04:15:58 +03:00 committed by GitHub
parent 15320d432b
commit d11fe6fde5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/assets/stylesheets/common/base/topic-post.scss
View File

@ -124,27 +124,27 @@ $quote-share-maxwidth: 150px;
}
h1 {
font-size: $font-up-3;
font-size: var(--font-up-3-rem);
}
h2 {
font-size: $font-up-2;
font-size: var(--font-up-2-rem);
}
h3 {
font-size: $font-up-1;
font-size: var(--font-up-1-rem);
}
h4 {
font-size: $font-0;
font-size: var(--font-0-rem);
}
h5 {
font-size: $font-down-1;
font-size: var(--font-down-1-rem);
}
h6 {
font-size: $font-down-2;
font-size: var(--font-down-2-rem);
}
a {

8
app/assets/stylesheets/common/font-variables.scss
View File

@ -20,6 +20,14 @@
--font-down-5: 0.5em;
--font-down-6: 0.4355em;
// Font-size definitions in rem used in cooked headings
--font-up-3-rem: 1.5157rem;
--font-up-2-rem: 1.3195rem;
--font-up-1-rem: 1.1487rem;
--font-0-rem: 1rem;
--font-down-1-rem: 0.8706rem;
--font-down-2-rem: 0.7579rem;
// inputs/textareas in iOS need to be at least 16px to avoid triggering zoom on focus
// with base at 15px, the below gives 16.05px
--font-size-ios-input: 1.07em;