Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(docs-infra): ensure the main font is applied to inputs (#40881)

Browse source 
It turns out that `<input>` and `<button>` elements do not inherit the
`font-family` style from `<body>` by default, but rather use a
user-agent defined style. This means that their font-family might be
different than the one used in the rest of the page.

This commit fixes it by ensuring `<input>` (and other) elements inherit
their `font-family` style from their parent element.

Before: ![inputs font before][1]
After: ![inputs font after][2]

(The difference in font is subtle, but it's there.)

[1]: https://user-images.githubusercontent.com/8604205/107853245-76bae980-6e1d-11eb-8318-e5f6e13876cc.png
[2]: https://user-images.githubusercontent.com/8604205/107853246-77538000-6e1d-11eb-86f2-e3e7e41158f5.png

PR Close #40881
This commit is contained in:
George Kalpakas 2021-02-18 18:42:48 +02:00 committed by atscott
parent f926b25e07
commit cb1400d28f
3 changed files with 5 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
aio/src/styles/0-base/_typography.scss
View file

@ -100,6 +100,7 @@ input,
a {
@include font-size(16);
@include line-height(32);
font-family: inherit;
font-weight: 400;
color: $darkgray;

1
aio/src/styles/1-layouts/_sidenav.scss
View file

@ -63,7 +63,6 @@ aio-nav-menu {
color: $darkgray;
cursor: pointer;
display: flex;
font-family: $main-font;
align-items: center;
justify-content: space-between;
overflow-wrap: break-word;

4
aio/src/styles/2-modules/_buttons.scss
View file

@ -1,5 +1,9 @@
/* Button Styles */
button {
font-family: inherit;
}
.button,
a.button.mat-button {
display: inline-block;