Skip to content

Commit

Permalink
fix(core): Ungroup placeholder css rules to prevent browsers from r…
Browse files Browse the repository at this point in the history
…emoving all rules

When rules are grouped using the comma operator and one selector is invalid / unknown then the whole group is invalidated[1].
In this case `::-ms-input-placeholder` is unknown to Firefox and Chrome, so the `::placeholder` rule is never applied.
[1]: https://www.w3.org/TR/selectors-3/#grouping

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
  • Loading branch information
susnux committed May 26, 2023
1 parent 8f0da6b commit f71f86d
Show file tree
Hide file tree
Showing 5 changed files with 21 additions and 8 deletions.
2 changes: 1 addition & 1 deletion core/css/inputs.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion core/css/inputs.css.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

21 changes: 17 additions & 4 deletions core/css/inputs.scss
Original file line number Diff line number Diff line change
Expand Up @@ -826,9 +826,22 @@ label.infield {
overflow: hidden;
}

::placeholder,
::-ms-input-placeholder,
::-webkit-input-placeholder {
// when rules are grouped using the comma operator and one selector is invalid / unknown then the whole group is invalidated.
// https://www.w3.org/TR/selectors-3/#grouping
// In this case `::-ms-input-placeholder` is unknown to Firefox and Chrome
@mixin placeholder-style {
color: var(--color-text-maxcontrast);
font-size: var(--default-font-size);
font-size: var(--default-font-size);
}

::placeholder {
@include placeholder-style;
}

::-ms-input-placeholder {
@include placeholder-style;
}

::-webkit-input-placeholder {
@include placeholder-style;
}
2 changes: 1 addition & 1 deletion core/css/server.css

Large diffs are not rendered by default.

Loading

0 comments on commit f71f86d

Please sign in to comment.