diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /browser/extensions/formautofill/skin/shared/editDialog-shared.css | |
parent | Initial commit. (diff) | |
download | firefox-esr-upstream.tar.xz firefox-esr-upstream.zip |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r-- | browser/extensions/formautofill/skin/shared/editDialog-shared.css | 110 |
1 files changed, 110 insertions, 0 deletions
diff --git a/browser/extensions/formautofill/skin/shared/editDialog-shared.css b/browser/extensions/formautofill/skin/shared/editDialog-shared.css new file mode 100644 index 0000000000..c2ddf71a60 --- /dev/null +++ b/browser/extensions/formautofill/skin/shared/editDialog-shared.css @@ -0,0 +1,110 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +:root { + --in-field-label-size: .8em; + --grid-column-row-gap: 8px; + /* Use the animation-easing-function that is defined in xul.css. */ + --animation-easing-function: cubic-bezier(.07,.95,0,1); +} + +dialog[subdialog] form { + /* Add extra space to ensure invalid input box is displayed properly */ + padding: 2px; +} + +/* The overly specific input attributes are required to override + padding from common.css */ +form input[type="email"], +form input[type="tel"], +form input[type="text"], +form textarea, +form select { + flex-grow: 1; + padding-top: calc(var(--in-field-label-size) + .4em); +} + +form input[type="tel"] { + text-align: match-parent; +} + +select { + margin: 0; + padding-bottom: 5px; +} + +form label[class="container"] select { + min-width: 0; +} + +form label, +form div { + /* Positioned so that the .label-text and .error-text children will be + positioned relative to this. */ + position: relative; + display: block; + line-height: 1em; +} + +/* Reset margins for inputs and textareas, overriding in-content styles */ +#form textarea, +#form input { + margin: 0; +} + +form :is(label, div) .label-text { + position: absolute; + opacity: .5; + pointer-events: none; + inset-inline-start: 10px; + top: .2em; + transition: top .2s var(--animation-easing-function), + font-size .2s var(--animation-easing-function); +} + +form :is(label, div):focus-within .label-text, +form :is(label, div) .label-text[field-populated] { + top: 0; + font-size: var(--in-field-label-size); +} + +form :is(input, select, textarea):focus ~ .label-text { + color: var(--in-content-item-selected); + opacity: 1; +} + +/* Focused error fields should get a darker text but not the blue one since it + * doesn't look good with the red error outline. */ +form :is(input, select, textarea):focus:-moz-ui-invalid ~ .label-text { + color: var(--in-content-text-color); +} + +form div[required] > label .label-text::after, +form :is(label, div)[required] .label-text::after { + content: attr(fieldRequiredSymbol); +} + +.persist-checkbox label { + display: flex; + flex-direction: row; + align-items: center; + margin-block: var(--grid-column-row-gap); +} + +dialog[subdialog] form { + /* Match the margin-inline-start of the #controls-container buttons + and provide enough padding at the top of the form so button outlines + don't get clipped. */ + padding: 4px 4px 0; +} + +#controls-container { + display: flex; + justify-content: end; + margin: 1em 0 0; +} + +#billingAddressGUID-container { + display: none; +} |