mirrors/gecko-dev
1
0
Fork 1
mirror of https://github.com/mozilla/gecko-dev.git synced 2025-10-31 00:08:07 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Bug 1890824 - Simplify number input styles in the print dialog. r=Itiel,desktop-theme-reviewers,dao

Browse source 
Use the non-native theme number input rather than rebuilding one.

D205379 actually broke the hover effect because nesting with a
pseudo-element doesn't work as you expect, see
https://github.com/w3c/csswg-drafts/issues/9492

Differential Revision: https://phabricator.services.mozilla.com/D207178
This commit is contained in:
Emilio Cobos Álvarez 2024-04-10 20:52:44 +00:00
parent 943cfaeee3
commit 03de1a202c
2 changed files with 6 additions and 43 deletions
repo.diff.show_diff_stats Download patch file Download diff file Expand all files Collapse all files

38
toolkit/components/printing/content/print.css
View file

@ -125,7 +125,7 @@ input:is([type="number"], [type="text"]) {
padding-inline-start: var(--space-small);
}
input[type="number"].photon-number {
input[type="number"] {
box-sizing: content-box;
min-height: unset;
padding: 0;
@ -133,42 +133,6 @@ input[type="number"].photon-number {
margin: 0;
height: 1.5em;
width: 4em;
&::-moz-number-spin-box {
height: 100%;
max-height: 100%;
border-inline-start: 1px solid var(--in-content-box-border-color);
width: 1em;
border-start-end-radius: var(--border-radius-small);
border-end-end-radius: var(--border-radius-small);
}
&:hover::-moz-number-spin-box {
border-color: var(--in-content-border-hover);
}
&::-moz-number-spin-up,
&::-moz-number-spin-down {
appearance: none;
border: 0;
border-radius: 0;
background-color: var(--in-content-button-background);
background-image: url("chrome://global/skin/icons/arrow-down.svg");
background-repeat: no-repeat;
background-size: 8px;
background-position: center;
-moz-context-properties: fill;
fill: currentColor;
&:hover {
background-color: var(--in-content-button-background-hover);
color: var(--in-content-button-text-color-hover);
}
}
&::-moz-number-spin-up {
background-image: url("chrome://global/skin/icons/arrow-up.svg");
}
}
input:is([type="checkbox"], [type="radio"]):disabled + label,

11
toolkit/components/printing/content/print.html
View file

@ -136,7 +136,6 @@
will filter this down to visible items only. -->
<input
id="percent-scale"
class="photon-number"
is="setting-number"
min="10"
max="200"
@ -166,7 +165,7 @@
data-setting-name="numCopies"
min="1"
max="10000"
class="copy-count-input photon-number"
class="copy-count-input"
aria-errormessage="error-invalid-copies"
required
/>
@ -205,7 +204,7 @@
<input
is="setting-number"
id="custom-margin-top"
class="margin-input photon-number"
class="margin-input"
aria-describedby="margins-custom-margin-top-desc"
min="0"
step="0.01"
@ -226,7 +225,7 @@
<input
is="setting-number"
id="custom-margin-bottom"
class="margin-input photon-number"
class="margin-input"
aria-describedby="margins-custom-margin-bottom-desc"
min="0"
step="0.01"
@ -249,7 +248,7 @@
<input
is="setting-number"
id="custom-margin-left"
class="margin-input photon-number"
class="margin-input"
aria-describedby="margins-custom-margin-left-desc"
min="0"
step="0.01"
@ -270,7 +269,7 @@
<input
is="setting-number"
id="custom-margin-right"
class="margin-input photon-number"
class="margin-input"
aria-describedby="margins-custom-margin-right-desc"
min="0"
step="0.01"