From 6bf0a5cb5034a7e684dcc3500e841785237ce2dd Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Sun, 7 Apr 2024 19:32:43 +0200 Subject: Adding upstream version 1:115.7.0. Signed-off-by: Daniel Baumann --- .../extensions/content/abuse-report-panel.css | 185 +++++++++++++++++++++ 1 file changed, 185 insertions(+) create mode 100644 toolkit/mozapps/extensions/content/abuse-report-panel.css (limited to 'toolkit/mozapps/extensions/content/abuse-report-panel.css') diff --git a/toolkit/mozapps/extensions/content/abuse-report-panel.css b/toolkit/mozapps/extensions/content/abuse-report-panel.css new file mode 100644 index 0000000000..977717146e --- /dev/null +++ b/toolkit/mozapps/extensions/content/abuse-report-panel.css @@ -0,0 +1,185 @@ +/* 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/. */ + +/* Abuse Reports card */ + +:root { + --close-icon-url: url("chrome://global/skin/icons/close.svg"); + --close-icon-size: 20px; + + --modal-panel-min-width: 60%; + --modal-panel-margin-top: 36px; + --modal-panel-margin-bottom: 36px; + --modal-panel-margin: 20%; + --modal-panel-padding: 40px; + + --line-height: 20px; + --textarea-height: 220px; + --button-padding: 52px; + --listitem-padding-bottom: 14px; + --list-radio-column-size: 28px; + --note-font-size: 14px; + --note-font-weight: 400; + --subtitle-font-size: 16px; + --subtitle-font-weight: 600; +} + +/* Ensure that the document (embedded in the XUL about:addons using a + XUL browser) has a transparent background */ +html { + background-color: transparent; +} + +.modal-overlay-outer { + background: var(--grey-90-a60); + width: 100%; + height: 100%; + position: fixed; + z-index: -1; +} + +.modal-panel-container { + padding-top: var(--modal-panel-margin-top); + padding-bottom: var(--modal-panel-margin-bottom); + padding-left: var(--modal-panel-margin); + padding-right: var(--modal-panel-margin); +} + +.addon-abuse-report { + min-width: var(--modal-panel-min-width); + padding: var(--modal-panel-padding); + display: flex; + flex-direction: column; + position: relative; +} + +.addon-abuse-report:hover { + /* Avoid the card box highlighting on hover. */ + box-shadow: none; +} + +.addon-abuse-report button { + padding: 0 var(--button-padding); +} + +.abuse-report-close-icon { + /* position the close button in the panel upper-right corner */ + position: absolute; + top: 12px; + inset-inline-end: 16px; +} + +button.abuse-report-close-icon { + background: var(--close-icon-url) no-repeat center center; + -moz-context-properties: fill; + color: inherit !important; + fill: currentColor; + min-width: auto; + min-height: auto; + width: var(--close-icon-size); + height: var(--close-icon-size); + margin: 0; + padding: 0; +} + +button.abuse-report-close-icon:hover { + fill-opacity: 0.1; +} + +button.abuse-report-close-icon:hover:active { + fill-opacity: 0.2; +} + +.abuse-report-header { + display: flex; + flex-direction: row; +} + +.abuse-report-contents, +.abuse-report-contents > hr { + width: 100%; +} + +.abuse-report-note { + color: var(--text-color-deemphasized); + font-size: var(--note-font-size); + font-weight: var(--note-font-weight); + line-height: var(--line-height); +} + +.abuse-report-subtitle { + font-size: var(--subtitle-font-size); + font-weight: var(--subtitle-font-weight); + line-height: var(--line-height); +} + +ul.abuse-report-reasons { + list-style-type: none; + padding-inline-start: 0; +} + +ul.abuse-report-reasons > li { + display: flex; + padding-bottom: var(--listitem-padding-bottom); +} + +ul.abuse-report-reasons > li > label { + display: grid; + grid-template-columns: var(--list-radio-column-size) auto; + grid-template-rows: 50% auto; + width: 100%; + line-height: var(--line-height); + font-size: var(--subtitle-font-size); + font-weight: var(--note-font-weight); + margin-inline-start: 4px; +} + +ul.abuse-report-reasons > li > label > [type="radio"] { + grid-column: 1; +} + +ul.abuse-report-reasons > li > label > span { + grid-column: 2; +} + +abuse-report-submit-panel textarea { + width: 100%; + height: var(--textarea-height); + resize: none; + box-sizing: border-box; +} + +/* Adapt styles for the panel opened in its own dialog window */ + +html.dialog-window { + background-color: var(--in-content-box-background); + height: 100%; + min-width: 740px; +} + +html.dialog-window body { + overflow: hidden; + min-height: 100%; + display: flex; + flex-direction: column; +} + +html.dialog-window .abuse-report-close-icon { + display: none; +} + +html.dialog-window addon-abuse-report { + flex-grow: 1; + display: flex; + /* Ensure that the dialog window starts from a reasonable initial size */ + --modal-panel-min-width: 700px; +} + +html.dialog-window addon-abuse-report form { + display: flex; +} + +html.dialog-window addon-abuse-report form .abuse-report-contents { + flex-grow: 1; +} -- cgit v1.2.3