fix(docs-infra): ensure the main font is applied to inputs (#40881)
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:
parent
7bcef26852
commit
44e1f956d0
|
@ -100,6 +100,7 @@ input,
|
|||
a {
|
||||
@include font-size(16);
|
||||
@include line-height(32);
|
||||
font-family: inherit;
|
||||
font-weight: 400;
|
||||
color: $darkgray;
|
||||
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -1,5 +1,9 @@
|
|||
/* Button Styles */
|
||||
|
||||
button {
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.button,
|
||||
a.button.mat-button {
|
||||
display: inline-block;
|
||||
|
|
Loading…
Reference in New Issue