Merge pull request #17835 from overleaf/mf-fix-mono-font

[web][website-redesign] Fix all mono text in website redesign pages.

GitOrigin-RevId: b1b2698f621b8dc4e8c56126915ddbbe538d308e
This commit is contained in:
M Fahru 2024-04-10 06:02:37 -07:00 committed by Copybot
parent ce5d190c4a
commit 71bd4ecb22
2 changed files with 8 additions and 15 deletions

View file

@ -1,12 +1,5 @@
/* We're using the "ss05" (stylistic set 5) version of the DM Mono, on the font-feature-settings rule */
/* https://developer.mozilla.org/en-US/docs/Web/CSS/font-feature-settings */
/* We use the ss05 specifically to remove the "squiggle" below the f letter. */
/* You can try removing the `font-feature-settings` rule and check what happens to the letter "f", */
/* as it's quite hard to describe it with sentences alone */
@font-face {
font-family: 'DM Mono';
font-feature-settings: 'ss05';
font-style: normal;
font-weight: 400;
font-display: fallback;
@ -15,7 +8,6 @@
@font-face {
font-family: 'DM Mono';
font-feature-settings: 'ss05';
font-style: italic;
font-weight: 400;
font-display: fallback;
@ -24,7 +16,6 @@
@font-face {
font-family: 'DM Mono';
font-feature-settings: 'ss05';
font-style: normal;
font-weight: 500;
font-display: fallback;
@ -33,7 +24,6 @@
@font-face {
font-family: 'DM Mono';
font-feature-settings: 'ss05';
font-style: italic;
font-weight: 500;
font-display: fallback;

View file

@ -9,11 +9,8 @@
h3,
h4,
a,
strong,
span {
&:not(.material-symbols) {
font-family: 'Noto Sans', sans-serif;
}
strong {
font-family: 'Noto Sans', sans-serif;
}
h1 {
@ -421,6 +418,7 @@
.label-premium {
margin-left: 0;
font-family: 'Noto Sans', sans-serif;
}
@media (max-width: @screen-sm-max) {
@ -892,6 +890,11 @@
.dm-mono {
font-family: 'DM Mono', monospace;
// We're using the "ss05" (stylistic set 5) version of the DM Mono, by setting the `font-feature-settings` rule
// https://developer.mozilla.org/en-US/docs/Web/CSS/font-feature-settings
// We use the ss05 specifically to remove the "squiggle" below the f letter.
// You can try removing the `font-feature-settings` rule and check what happens to the letter "f",
// as it's quite hard to describe it with sentences alone
font-feature-settings: 'ss05';
}