Bug 1686613 - Port non-native theme paddings to forms.css. r=mstange

The only change I've made intentionally is the change to the textarea /
input padding. Now that the focus outline doesn't cover the padding
area, this preserves the same visual effect, plus the 2px inline padding
values now match Chrome, which means that even affecting appearance:
none controls, this is probably compatible.

Depends on D102458

Differential Revision: https://phabricator.services.mozilla.com/D102459
This commit is contained in:
Emilio Cobos Álvarez 2021-01-21 21:38:33 +00:00
Родитель 53cc336478
Коммит e2e871521d
2 изменённых файлов: 33 добавлений и 47 удалений

Просмотреть файл

@ -125,6 +125,12 @@ textarea {
overflow-clip-box: content-box;
}
@media (-moz-non-native-content-theme) {
input, textarea {
padding-inline: 2px;
}
}
/* A few properties that we don't want to inherit by default: */
input, textarea, select, button, ::file-selector-button {
text-align: initial;
@ -550,6 +556,18 @@ input[type=color] {
block-size: 23px;
}
@media (-moz-non-native-content-theme) {
button,
::file-selector-button,
input:is([type=reset], [type=button], [type=submit]) {
padding-inline: 4px;
}
input[type=color] {
padding: 4px;
}
}
button,
::file-selector-button {
/* Buttons should lay out like "normal" html, mostly */
@ -997,6 +1015,12 @@ input[type=number] > div > div > div:hover {
background-color: lightblue;
}
@media (-moz-non-native-content-theme) {
input[type=number] {
padding-inline-end: 0;
}
}
input[type=search]::-moz-search-clear-button {
display: block;
cursor: default;
@ -1021,6 +1045,14 @@ input:is([type=date], [type=time]):is(:disabled, :read-only) {
color: GrayText;
}
@media (-moz-non-native-content-theme) {
/* TODO(emilio): This is an odd special-case... */
input:is([type=date], [type=time]) {
padding-inline: 3px;
padding-block: 2px 0;
}
}
input:autofill, input:-moz-autofill-preview {
filter: grayscale(21%) brightness(88%) contrast(161%) invert(10%) sepia(40%) saturate(206%);
}

Просмотреть файл

@ -1353,53 +1353,7 @@ bool nsNativeBasicTheme::GetWidgetPadding(nsDeviceContext* aContext,
default:
break;
}
// Respect author padding.
//
// TODO(emilio): Consider just unconditionally returning false, so that the
// default size of all elements matches other platforms and the UA stylesheet.
if (aFrame->PresContext()->HasAuthorSpecifiedRules(
aFrame, NS_AUTHOR_SPECIFIED_PADDING)) {
return false;
}
DPIRatio dpiRatio = GetDPIRatio(aFrame);
switch (aAppearance) {
case StyleAppearance::Listbox:
case StyleAppearance::Menulist:
aResult->SizeTo(0, 0, 0, 0);
return true;
case StyleAppearance::NumberInput:
*aResult = (CSSMargin(1.0f, 0, 1.0f, 4.0f) * dpiRatio).Rounded();
if (IsFrameRTL(aFrame)) {
std::swap(aResult->left, aResult->right);
}
return true;
case StyleAppearance::Textarea:
case StyleAppearance::MozMenulistArrowButton:
case StyleAppearance::Menuitemtext:
case StyleAppearance::Menuitem:
case StyleAppearance::MenulistText:
case StyleAppearance::MenulistButton:
*aResult = (CSSMargin(1.0f, 4.0f, 1.0f, 4.0f) * dpiRatio).Rounded();
return true;
case StyleAppearance::Button:
if (IsColorPickerButton(aFrame)) {
*aResult = (CSSMargin(4.0f, 4.0f, 4.0f, 4.0f) * dpiRatio).Rounded();
return true;
}
*aResult = (CSSMargin(1.0f, 4.0f, 1.0f, 4.0f) * dpiRatio).Rounded();
return true;
case StyleAppearance::Textfield:
if (IsDateTimeTextField(aFrame)) {
*aResult = (CSSMargin(2.0f, 3.0f, 0.0f, 3.0f) * dpiRatio).Rounded();
return true;
}
*aResult = (CSSMargin(1.0f, 4.0f, 1.0f, 4.0f) * dpiRatio).Rounded();
return true;
default:
return false;
}
return false;
}
bool nsNativeBasicTheme::GetWidgetOverflow(nsDeviceContext* aContext,