aboutsummaryrefslogtreecommitdiff
path: root/arc-firefox-theme/chrome/global/alerts/alert-common.css
diff options
context:
space:
mode:
Diffstat (limited to 'arc-firefox-theme/chrome/global/alerts/alert-common.css')
-rw-r--r--arc-firefox-theme/chrome/global/alerts/alert-common.css136
1 files changed, 136 insertions, 0 deletions
diff --git a/arc-firefox-theme/chrome/global/alerts/alert-common.css b/arc-firefox-theme/chrome/global/alerts/alert-common.css
new file mode 100644
index 0000000..af7fd0c
--- /dev/null
+++ b/arc-firefox-theme/chrome/global/alerts/alert-common.css
@@ -0,0 +1,136 @@
+/* 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/. */
+
+/* ===== alert.css =====================================================
+ == Shared styles specific to the alerts dialog.
+ ======================================================================= */
+
+@import url("chrome://global/skin/");
+
+@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
+
+#alertBox[hasBodyText] > #alertTextBox,
+#alertBox[hasOrigin] > #alertTitleBox {
+ border-bottom: 1px solid ThreeDShadow;
+}
+
+#alertBox[animate] {
+ animation-timing-function: cubic-bezier(.12,1.23,.48,1.09);
+}
+
+#alertBox[animate][clicked] {
+ animation-duration: .6s;
+ animation-name: alert-clicked-animation;
+}
+
+/* This is used if the close button is clicked
+ before the animation has finished. */
+#alertBox[animate][closing] {
+ animation-duration: .6s;
+ animation-name: alert-closing-animation;
+}
+
+@keyframes alert-animation {
+ from {
+ opacity: 0;
+ }
+ 5% {
+ opacity: 1;
+ }
+ 95% {
+ opacity: 1;
+ }
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes alert-clicked-animation {
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes alert-closing-animation {
+ to {
+ opacity: 0;
+ }
+}
+
+#alertImage {
+ width: 64px;
+}
+
+.alertTextBox {
+ padding-top: 8px;
+ padding-inline-start: 8px;
+ /* The text box width is increased to make up for the lack of image when one
+ is not provided. 319px is the text box width when a picture is present,
+ 255px, plus the width of the image, 64px. */
+ width: 319px;
+}
+
+#alertBox[hasImage] > box > #alertTextBox {
+ width: 255px;
+}
+
+#alertTextLabel {
+ padding-inline-end: 8px;
+}
+
+.alertTitle {
+ -moz-box-flex: 1;
+ font-weight: bold;
+ padding: 6px 8px;
+ width: 255px;
+}
+
+#alertFooter {
+ -moz-box-align: end;
+ padding-bottom: 2px;
+}
+
+#alertSourceLabel {
+ -moz-box-flex: 1;
+ font-size: 83.334%;
+ color: GrayText;
+}
+
+#alertSettings {
+ -moz-appearance: none;
+ background-color: transparent;
+ border-width: 0;
+ border-radius: 20px;
+ min-width: 0;
+ list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities");
+ margin-inline-end: 0;
+ margin-bottom: 0;
+}
+
+#alertSettings > .button-box {
+ padding: 0;
+}
+
+#alertSettings:hover,
+#alertSettings[open] {
+ list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities-inverted");
+}
+
+#alertSettings:hover {
+ background-color: rgb(128,128,128);
+}
+
+#alertSettings[open],
+#alertSettings:hover:active {
+ background-color: rgb(102,102,102);
+}
+
+#alertSettings[focusedViaMouse]:-moz-focusring > .button-box {
+ border-color: transparent;
+}
+
+#alertSettings > .button-box > .button-menu-dropmarker,
+#alertSettings > .button-box > .box-inherit > .button-text {
+ display: none;
+}