From: Robert Kaiser <kairo@kairo.at>
Date: Mon, 25 Jan 2016 03:05:55 +0000 (+0100)
Subject: sync both themes with toolkit windows theme changes in Mozilla 42-44 cycles
X-Git-Tag: LCARStrek-2.41~25
X-Git-Url: https://git-public.kairo.at//?a=commitdiff_plain;h=d471380e99d65fcd126e0f04b94c1d3a8004cf3d;p=themes.git
sync both themes with toolkit windows theme changes in Mozilla 42-44 cycles
---
diff --git a/EarlyBlue/global/alerts/alert-common.css b/EarlyBlue/global/alerts/alert-common.css
new file mode 100644
index 00000000..546534a4
--- /dev/null
+++ b/EarlyBlue/global/alerts/alert-common.css
@@ -0,0 +1,138 @@
+/* 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[animate] {
+ animation-timing-function: cubic-bezier(.12,1.23,.48,1.09);
+}
+
+#alertBox[animate][clicked] {
+ animation-duration: .6s;
+ animation-name: alert-zoom-animation;
+}
+
+/* This is used if the close button is clicked
+ before the animation has finished. */
+#alertBox[animate][closing] {
+ animation-duration: .6s;
+ animation-name: alert-fadeout-animation;
+}
+
+@keyframes alert-animation {
+ from {
+ opacity: 0;
+ }
+ 5% {
+ opacity: 1;
+ }
+ 95% {
+ opacity: 1;
+ }
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes alert-zoom-animation {
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes alert-fadeout-animation {
+ to {
+ opacity: 0;
+ }
+}
+
+#alertImage {
+ width: 80px;
+ height: 80px;
+ max-width: 80px;
+ max-height: 80px;
+ object-fit: scale-down;
+ margin: 0 7px 7px;
+}
+
+.alertTextBox {
+ padding-top: 4px;
+ /* The text box width is increased to make up for the lack of image when one
+ is not provided. 349px is the text box width when a picture is present,
+ 255px, plus the width of the image, 80px, and the margins, 7px each. */
+ width: 349px;
+}
+
+#alertBox[hasImage] > box > #alertTextBox {
+ width: 255px;
+}
+
+#alertBox:not([hasImage]) > box > #alertTextBox {
+ padding-inline-start: 8px;
+}
+
+#alertTextLabel {
+ padding-inline-end: 8px;
+}
+
+.alertTitle {
+ -moz-box-flex: 1;
+ font-weight: bold;
+ padding: 6px 8px 0;
+ width: 255px;
+}
+
+#alertFooter {
+ -moz-box-align: start;
+}
+
+#alertBox:not([hasOrigin]) > box > #alertTextBox,
+#alertFooter {
+ padding-bottom: 5px;
+}
+
+#alertSourceLabel {
+ -moz-box-flex: 1;
+ font-size: 83.334%;
+ color: #808080;
+}
+
+#alertSettings {
+ border-radius: 0px;
+ min-width: 0;
+ list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities-grayscale");
+ 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 {
+}
+
+#alertSettings[open],
+#alertSettings:hover:active {
+}
+
+#alertSettings[focusedViaMouse]:-moz-focusring > .button-box {
+ border-color: transparent;
+}
+
+#alertSettings > .button-box > .button-menu-dropmarker,
+#alertSettings > .button-box > .box-inherit > .button-text {
+ display: none;
+}
diff --git a/EarlyBlue/global/alerts/alert.css b/EarlyBlue/global/alerts/alert.css
index e6d562c5..db14f791 100644
--- a/EarlyBlue/global/alerts/alert.css
+++ b/EarlyBlue/global/alerts/alert.css
@@ -6,76 +6,15 @@
== Styles specific to the alerts dialog.
======================================================================= */
-@import url("chrome://global/skin/");
+@import url("chrome://global/skin/alerts/alert-common.css");
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-.alertBox {
+#alertBox {
border: 1px solid #666699;
+ border-radius: 1px;
background-color: #CCD0DD;
-}
-
-.alertImageBox {
- padding: 8px 0;
- width: 64px;
- -moz-border-end: 1px solid #9999CC;
-}
-
-.alertTextBox {
- padding: 8px;
- -moz-padding-start: 16px;
- width: 255px;
-}
-
-.alertTextBox,
-.alertCloseBox {
-}
-
-.alertBox[orient="horizontal"] > .alertImageBox {
- -moz-margin-end: 8px;
-}
-
-.alertBox[orient="vertical"] > .alertImageBox {
- margin-bottom: 8px;
-}
-
-#alertNotification[clickable="true"]:hover .alertTextBox,
-#alertNotification[clickable="true"]:hover .alertCloseBox {
-/* background-image: linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0.3)); */
-}
-
-.alertTitle {
- font-weight: bold;
- font-size: 110%;
-}
-
-#alertImage {
- max-width: 48px;
- max-height: 48px;
- list-style-image: url("chrome://global/skin/alerts/notification-48.png");
-}
-
-#alertNotification[clickable="true"] {
- cursor: pointer;
-}
-
-label {
- cursor: inherit;
-}
-
-@keyframes alert-animation {
- from {
- opacity: 0;
- }
- 6.25% {
- opacity: 1;
- }
- 93.75% {
- opacity: 1;
- }
- to {
- opacity: 0;
- }
+ color: #000000;
}
.alertCloseButton {
diff --git a/EarlyBlue/global/autocomplete.css b/EarlyBlue/global/autocomplete.css
index 6bd01046..4ca30ee0 100644
--- a/EarlyBlue/global/autocomplete.css
+++ b/EarlyBlue/global/autocomplete.css
@@ -58,7 +58,8 @@ panel[type="autocomplete"],
panel[type="autocomplete-richlistbox"],
.autocomplete-history-popup {
border: 1px solid #9999CC;
- background-color: white;
+ background-color: #FFFFFF;
+ color: #000000;
padding: 0;
}
diff --git a/EarlyBlue/global/findBar.css b/EarlyBlue/global/findBar.css
index 6eee4230..5b5d48f0 100644
--- a/EarlyBlue/global/findBar.css
+++ b/EarlyBlue/global/findBar.css
@@ -22,6 +22,11 @@ findbar[hidden] {
transition-delay: 0s, 0s, 150ms;
}
+findbar[noanim] {
+ transition-duration: 0s !important;
+ transition-delay: 0s !important;
+}
+
findbar[position="top"][hidden] {
margin-bottom: auto;
margin-top: -1em;
diff --git a/EarlyBlue/global/in-content/common.css b/EarlyBlue/global/in-content/common.css
index 4c3a2e27..5bdb0b77 100644
--- a/EarlyBlue/global/in-content/common.css
+++ b/EarlyBlue/global/in-content/common.css
@@ -45,7 +45,7 @@
--in-content-disabled-text: #999999;
}
-html|body,
+html|html,
xul|page,
xul|window {
font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
@@ -145,6 +145,8 @@ xul|tab {
color: var(--in-content-tab-color);
background-color: var(--in-content-page-background);
border-width: 0;
+ / !important overrides tabbox.css RTL and visuallyselected rules /
+ border-radius: 0 !important;
transition: background-color 50ms ease 0s;
}
@@ -180,7 +182,7 @@ html|button {
xul|colorpicker[type="button"],
xul|menulist {
-moz-appearance: none;
- height: 30px;
+ min-height: 30px;
color: var(--in-content-text-color);
border: 1px solid var(--in-content-box-border-color);
-moz-border-top-colors: none !important;
@@ -294,6 +296,7 @@ xul|*.help-button > xul|*.button-box > xul|*.button-text {
}
xul|*.spinbuttons-button {
+ min-height: initial;
-moz-margin-start: 10px !important;
-moz-margin-end: 2px !important;
}
@@ -404,13 +407,11 @@ xul|button[type="menu"] > xul|menupopup xul|menuseparator {
*/
/* textboxes */
/*
-*|textbox {
+html|input[type="text"],
+html|textarea,
+xul|textbox {
-moz-appearance: none;
- height: 30px;
color: var(--in-content-text-color);
- line-height: 20px;
- padding-right: 10px;
- padding-left: 10px;
border: 1px solid var(--in-content-box-border-color);
-moz-border-top-colors: none !important;
-moz-border-right-colors: none !important;
@@ -420,12 +421,27 @@ xul|button[type="menu"] > xul|menupopup xul|menuseparator {
background-color: var(--in-content-box-background);
}
-html|textbox:focus,
+xul|textbox {
+ min-height: 30px;
+ padding-right: 10px;
+ padding-left: 10px;
+}
+
+html|input[type="text"],
+html|textarea {
+ font-family: inherit;
+ font-size: inherit;
+ padding: 5px 10px;
+}
+
+html|input[type="text"]:focus,
+html|textarea:focus,
xul|textbox[focused] {
border-color: var(--in-content-border-focus);
}
-html|textbox:disabled,
+html|input[type="text"]:disabled,
+html|textarea:disabled,
xul|textbox[disabled="true"] {
opacity: 0.5;
}
@@ -461,7 +477,7 @@ html|a:hover:active,
/*
/ Hide the actual checkbox /
html|input[type="checkbox"] {
- opacity: 0;
+ visibility: hidden;
position: absolute;
}
@@ -561,7 +577,7 @@ xul|*.radio-label-box {
*/
/* Category List */
-xul|*#categories {
+*|*#categories {
-moz-appearance: none;
background-color: var(--in-content-category-background);
padding-top: 39px;
@@ -569,7 +585,7 @@ xul|*#categories {
border-width: 0;
}
-xul|*.category {
+*|*.category {
-moz-appearance: none;
color: var(--in-content-category-text);
-moz-border-end-width: 0;
@@ -579,18 +595,18 @@ xul|*.category {
transition: background-color 150ms;
}
-xul|*.category:hover {
+*|*.category:hover {
background-color: var(--in-content-category-background-hover);
}
-xul|*.category[selected] {
+*|*.category[selected] {
background-color: var(--in-content-category-background-active);
color: var(--in-content-category-text-selected);
-moz-padding-start: 11px; /* compensate the 4px border */
-moz-border-start: solid 4px var(--in-content-border-highlight);
}
-xul|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
+*|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
border-top: var(--in-content-category-border-focus);
border-bottom: var(--in-content-category-border-focus);
}
diff --git a/EarlyBlue/global/listbox.css b/EarlyBlue/global/listbox.css
index 4b801dde..d0d1e9f8 100644
--- a/EarlyBlue/global/listbox.css
+++ b/EarlyBlue/global/listbox.css
@@ -26,24 +26,31 @@ listbox[disabled="true"] {
listitem {
border: 1px solid transparent;
+
+ --listitem-selectedColor: #FFFFFF;
+ --listitem-selectedBackground: #808080;
+ --listitem-selectedFocusColor: var(--listitem-selectedColor);
+ --listitem-selectedFocusBackground: #336699;
+ --listitem-focusCurrentBorder: #6666CC;
+ --listitem-selectedFocusCurrentBorder: #666699;
}
listbox:-moz-focusring > listitem[current="true"] {
- border: 1px dotted #9999CC;
+ border: 1px dotted var(--listitem-focusCurrentBorder);
}
listbox:-moz-focusring > listitem[current="true"][selected="true"] {
- border: 1px dotted #666699;
+ border: 1px dotted var(--listitem-selectedFocusCurrentBorder);
}
listitem[selected="true"] {
- background-color: #808080;
- color: #FFFFFF;
+ background-color: var(--listitem-selectedBackground);
+ color: var(--listitem-selectedColor);
}
listbox:focus > listitem[selected="true"] {
- background-color: #336699;
- color: #FFFFFF;
+ background-color: var(--listitem-selectedFocusBackground);
+ color: var(--listitem-selectedFocusColor);
}
/* ::::: listheader ::::: */
diff --git a/EarlyBlue/global/toolbarbutton.css b/EarlyBlue/global/toolbarbutton.css
index 84c21f42..6e61c071 100644
--- a/EarlyBlue/global/toolbarbutton.css
+++ b/EarlyBlue/global/toolbarbutton.css
@@ -151,44 +151,27 @@ toolbarbutton[disabled="true"]:hover:active > toolbarbutton.toolbarbutton-menubu
/* ::::: toolbarbutton badged ::::: */
-.toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
+.toolbarbutton-badge-stack > .toolbarbutton-icon[label]:not([label=""]) {
-moz-margin-end: 0;
}
-.toolbarbutton-badge[badge=""] {
- display: none;
-}
-
.toolbarbutton-badge {
background-color: #CCD0DD;
-}
-
-.toolbarbutton-badge::after {
- /* The |content| property is set in the content stylesheet. */
font-size: 10px;
font-weight: bold;
- padding: 1px 2px 2px;
+ padding: 0 2px 1px;
color: #000000;
- background-color: inherit;
border-radius: 2px;
box-shadow: 0 1px 0 #9999CC inset,
0 -1px 0 #9999CC inset,
0 1px 0 #9999CC;
- position: absolute;
- top: -4px;
- right: -2px;
- min-width: 10px;
+ margin: -6px 0 0 !important;
+ -moz-margin-end: -8px !important;
+ min-width: 14px;
+ max-width: 28px;
line-height: 10px;
text-align: center;
-}
-
-.toolbarbutton-badge:-moz-locale-dir(rtl)::after {
- left: -2px;
- right: auto;
-}
-
-.toolbarbutton-badge-container {
- position: relative;
+ -moz-stack-sizing: ignore;
}
/* .......... dropmarker .......... */
diff --git a/EarlyBlue/mozapps/extensions/extensions.css b/EarlyBlue/mozapps/extensions/extensions.css
index bf975b93..36c7fb71 100644
--- a/EarlyBlue/mozapps/extensions/extensions.css
+++ b/EarlyBlue/mozapps/extensions/extensions.css
@@ -980,7 +980,7 @@ button.button-link {
color: #0000FF;
cursor: pointer;
min-width: 0;
- height: 20px;
+ min-height: 20px;
margin: 0 6px;
}
diff --git a/EarlyBlue/mozapps/extensions/utilities.svg b/EarlyBlue/mozapps/extensions/utilities.svg
index 9cac8680..1c517ea4 100644
--- a/EarlyBlue/mozapps/extensions/utilities.svg
+++ b/EarlyBlue/mozapps/extensions/utilities.svg
@@ -13,6 +13,12 @@
use[id$="-native"] {
fill: GrayText;
}
+ use[id$="-grayscale"] {
+ fill: #808080;
+ }
+ use[id$="-inverted"] {
+ fill: #000000;
+ }
</style>
<defs>
<path id="utilities-shape" d="m11.5,13.9l-.6-1.5c.3-.2 .5-.4 .8-.6 .2-.2 .4-.5 .6-.7l1.5,.6c.3,.1 .6,0 .7-.3l.4-1c.1-.3 0-.6-.3-.7l-1.5-.6c.1-.6 .1-1.3 0-2l1.5-.6c.3-.1 .4-.4 .3-.7l-.4-1c-.1-.3-.4-.4-.7-.3l-1.5,.6c-.2-.3-.4-.5-.6-.8-.2-.1-.5-.3-.7-.5l.6-1.5c.1-.3 0-.6-.3-.7l-.9-.4c-.3-.1-.6,0-.7,.3l-.6,1.5c-.6-.1-1.3-.1-2,0l-.6-1.5c-.1-.3-.4-.4-.7-.3l-1,.4c-.2,.1-.3,.4-.2,.6l.6,1.5c-.3,.3-.5,.5-.8,.7-.2,.3-.4,.5-.6,.8l-1.5-.7c-.3-.1-.6,0-.7,.3l-.4,.9c-.1,.3 0,.6 .3,.7l1.5,.7c-.1,.6-.1,1.3 0,1.9l-1.5,.6c-.3,.1-.4,.4-.3,.7l.4,1c.1,.3 .4,.4 .7,.3l1.5-.6c.2,.3 .4,.5 .6,.8 .2,.2 .5,.4 .7,.6l-.6,1.5c-.1,.3 0,.6 .3,.7l1,.4c.3,.1 .6,0 .7-.3l.6-1.5c.6,.1 1.3,.1 2,0l.6,1.5c.1,.3 .4,.4 .7,.3l1-.4c.1-.1 .3-.4 .1-.7zm-5.1-4.2c-.9-.9-.9-2.4 0-3.3 .9-.9 2.4-.9 3.3,0 .9,.9 .9,2.4 0,3.3-.9,.9-2.4,.9-3.3,0z"/>
@@ -20,4 +26,6 @@
<use id="utilities" xlink:href="#utilities-shape"/>
<use id="utilities-hover" xlink:href="#utilities-shape"/>
<use id="utilities-native" xlink:href="#utilities-shape"/>
+ <use id="utilities-grayscale" xlink:href="#utilities-shape"/>
+ <use id="utilities-inverted" xlink:href="#utilities-shape"/>
</svg>
diff --git a/LCARStrek/global/alerts/alert-common.css b/LCARStrek/global/alerts/alert-common.css
new file mode 100644
index 00000000..5bcdfcb8
--- /dev/null
+++ b/LCARStrek/global/alerts/alert-common.css
@@ -0,0 +1,138 @@
+/* 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[animate] {
+ animation-timing-function: cubic-bezier(.12,1.23,.48,1.09);
+}
+
+#alertBox[animate][clicked] {
+ animation-duration: .6s;
+ animation-name: alert-zoom-animation;
+}
+
+/* This is used if the close button is clicked
+ before the animation has finished. */
+#alertBox[animate][closing] {
+ animation-duration: .6s;
+ animation-name: alert-fadeout-animation;
+}
+
+@keyframes alert-animation {
+ from {
+ opacity: 0;
+ }
+ 5% {
+ opacity: 1;
+ }
+ 95% {
+ opacity: 1;
+ }
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes alert-zoom-animation {
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes alert-fadeout-animation {
+ to {
+ opacity: 0;
+ }
+}
+
+#alertImage {
+ width: 80px;
+ height: 80px;
+ max-width: 80px;
+ max-height: 80px;
+ object-fit: scale-down;
+ margin: 0 7px 7px;
+}
+
+.alertTextBox {
+ padding-top: 4px;
+ /* The text box width is increased to make up for the lack of image when one
+ is not provided. 349px is the text box width when a picture is present,
+ 255px, plus the width of the image, 80px, and the margins, 7px each. */
+ width: 349px;
+}
+
+#alertBox[hasImage] > box > #alertTextBox {
+ width: 255px;
+}
+
+#alertBox:not([hasImage]) > box > #alertTextBox {
+ padding-inline-start: 8px;
+}
+
+#alertTextLabel {
+ padding-inline-end: 8px;
+}
+
+.alertTitle {
+ -moz-box-flex: 1;
+ font-weight: bold;
+ padding: 6px 8px 0;
+ width: 255px;
+}
+
+#alertFooter {
+ -moz-box-align: start;
+}
+
+#alertBox:not([hasOrigin]) > box > #alertTextBox,
+#alertFooter {
+ padding-bottom: 5px;
+}
+
+#alertSourceLabel {
+ -moz-box-flex: 1;
+ font-size: 83.334%;
+ color: #A09090;
+}
+
+#alertSettings {
+ border-radius: 20px;
+ min-width: 0;
+ list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities-grayscale");
+ 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 {
+}
+
+#alertSettings[open],
+#alertSettings:hover:active {
+}
+
+#alertSettings[focusedViaMouse]:-moz-focusring > .button-box {
+ border-color: transparent;
+}
+
+#alertSettings > .button-box > .button-menu-dropmarker,
+#alertSettings > .button-box > .box-inherit > .button-text {
+ display: none;
+}
diff --git a/LCARStrek/global/alerts/alert.css b/LCARStrek/global/alerts/alert.css
index 876a6b12..01af1cde 100644
--- a/LCARStrek/global/alerts/alert.css
+++ b/LCARStrek/global/alerts/alert.css
@@ -6,77 +6,15 @@
== Styles specific to the alerts dialog.
======================================================================= */
-@import url("chrome://global/skin/");
+@import url("chrome://global/skin/alerts/alert-common.css");
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-.alertBox {
+#alertBox {
border: 1px solid #9C9CFF;
border-radius: 3px;
background-color: #000000;
-}
-
-.alertImageBox {
- padding: 8px 0;
- width: 64px;
- -moz-border-end: 1px solid #9C9CFF;
-}
-
-.alertTextBox {
- padding: 8px;
- -moz-padding-start: 16px;
- width: 255px;
-}
-
-.alertTextBox,
-.alertCloseBox {
-}
-
-.alertBox[orient="horizontal"] > .alertImageBox {
- -moz-margin-end: 8px;
-}
-
-.alertBox[orient="vertical"] > .alertImageBox {
- margin-bottom: 8px;
-}
-
-#alertNotification[clickable="true"]:hover .alertTextBox,
-#alertNotification[clickable="true"]:hover .alertCloseBox {
-/* background-image: linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0.3));*/
-}
-
-.alertTitle {
- font-weight: bold;
- font-size: 110%;
-}
-
-#alertImage {
- max-width: 48px;
- max-height: 48px;
- list-style-image: url("chrome://global/skin/alerts/notification-48.png");
-}
-
-#alertNotification[clickable="true"] {
- cursor: pointer;
-}
-
-label {
- cursor: inherit;
-}
-
-@keyframes alert-animation {
- from {
- opacity: 0;
- }
- 6.25% {
- opacity: 1;
- }
- 93.75% {
- opacity: 1;
- }
- to {
- opacity: 0;
- }
+ color: #FF9F00;
}
.alertCloseButton {
diff --git a/LCARStrek/global/autocomplete.css b/LCARStrek/global/autocomplete.css
index 7096b319..a2ad582c 100644
--- a/LCARStrek/global/autocomplete.css
+++ b/LCARStrek/global/autocomplete.css
@@ -69,6 +69,7 @@ panel[type="autocomplete-richlistbox"],
.autocomplete-history-popup {
border: 1px solid #FF9F00;
background-color: #000000;
+ color: #FF9F00;
padding: 0;
}
diff --git a/LCARStrek/global/findBar.css b/LCARStrek/global/findBar.css
index d7e963df..2912cc85 100644
--- a/LCARStrek/global/findBar.css
+++ b/LCARStrek/global/findBar.css
@@ -21,6 +21,11 @@ findbar[hidden] {
transition-delay: 0s, 0s, 150ms;
}
+findbar[noanim] {
+ transition-duration: 0s !important;
+ transition-delay: 0s !important;
+}
+
findbar[position="top"][hidden] {
margin-bottom: auto;
margin-top: -1em;
diff --git a/LCARStrek/global/in-content/common.css b/LCARStrek/global/in-content/common.css
index 9a2975f6..17aecf56 100644
--- a/LCARStrek/global/in-content/common.css
+++ b/LCARStrek/global/in-content/common.css
@@ -48,7 +48,7 @@
---in-content-help-button-background-active: #eaba00;
--in-content-disabled-text: #8050B0;
}
-html|body,
+html|html,
xul|page,
xul|window {
font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
@@ -148,6 +148,8 @@ xul|tab {
color: var(--in-content-tab-color);
background-color: var(--in-content-page-background);
border-width: 0;
+ / !important overrides tabbox.css RTL and visuallyselected rules /
+ border-radius: 0 !important;
transition: background-color 50ms ease 0s;
}
@@ -183,7 +185,7 @@ html|button {
xul|colorpicker[type="button"],
xul|menulist {
-moz-appearance: none;
- height: 30px;
+ min-height: 30px;
color: var(--in-content-text-color);
border: 1px solid var(--in-content-box-border-color);
-moz-border-top-colors: none !important;
@@ -301,6 +303,7 @@ xul|*.help-button > xul|*.button-box > xul|*.button-text {
}
/*
xul|*.spinbuttons-button {
+ min-height: initial;
-moz-margin-start: 10px !important;
-moz-margin-end: 2px !important;
}
@@ -411,7 +414,9 @@ xul|button[type="menu"] > xul|menupopup xul|menuseparator {
*/
/* textboxes */
/*
-*|textbox {
+html|input[type="text"],
+html|textarea,
+xul|textbox {
-moz-appearance: none;
height: 30px;
color: var(--in-content-text-color);
@@ -427,12 +432,27 @@ xul|button[type="menu"] > xul|menupopup xul|menuseparator {
background-color: var(--in-content-box-background);
}
-html|textbox:focus,
+xul|textbox {
+ min-height: 30px;
+ padding-right: 10px;
+ padding-left: 10px;
+}
+
+html|input[type="text"],
+html|textarea {
+ font-family: inherit;
+ font-size: inherit;
+ padding: 5px 10px;
+}
+
+html|input[type="text"]:focus,
+html|textarea:focus,
xul|textbox[focused] {
border-color: var(--in-content-border-focus);
}
-html|textbox:disabled,
+html|input[type="text"]:disabled,
+html|textarea:disabled,
xul|textbox[disabled="true"] {
opacity: 0.5;
}
@@ -467,7 +487,7 @@ html|a:hover:active,
/* Checkboxes and radio buttons */
/* Hide the actual checkbox */
html|input[type="checkbox"] {
- opacity: 0;
+ visibility: hidden;
position: absolute;
}
@@ -576,7 +596,7 @@ xul|*.radio-label-box {
*/
/* Category List */
-xul|*#categories {
+*|*#categories {
background-color: var(--in-content-categorylist-background);
padding-top: 4em;
margin: 0;
@@ -584,7 +604,7 @@ xul|*#categories {
border: none;
}
-xul|*.category {
+*|*.category {
background-color: var(--in-content-category-background);
color: var(--in-content-category-text);
-moz-border-end-width: 0;
@@ -594,17 +614,17 @@ xul|*.category {
transition: background-color 150ms;
}
-xul|*.category:hover {
+*|*.category:hover {
background-color: var(--in-content-category-background-hover);
color: var(--in-content-category-text-selected);
}
-xul|*.category[selected] {
+*|*.category[selected] {
background-color: var(--in-content-category-background-active);
color: var(--in-content-category-text-selected);
}
-xul|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
+*|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
border-top: var(--in-content-category-border-focus);
border-bottom: var(--in-content-category-border-focus);
}
diff --git a/LCARStrek/global/inContentUI.css b/LCARStrek/global/inContentUI.css
deleted file mode 100644
index 0e5971d0..00000000
--- a/LCARStrek/global/inContentUI.css
+++ /dev/null
@@ -1,45 +0,0 @@
-/* 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/. */
-
-/* THIS FILE HAS BEEN DELETED IN THE ORIGINAL THEME.
- * We keep it only as long as some LCARStrek stuff still refers to it. */
-
-/*
- * The default namespace for this file is XUL. Be sure to prefix rules that
- * are applicable to both XUL and HTML with '*|'.
- */
-@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
-@namespace html url("http://www.w3.org/1999/xhtml");
-
-/* Page background */
-*|*:root {
- background-color: #000000;
- color: #FF9F00;
- margin: 20px;
-}
-
-html|html {
- font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
-}
-
-/* Use the new in-content colors for #contentAreaDownloadsView. After landing
- of bug 989469 the colors can be moved to *|*:root */
-*|*#contentAreaDownloadsView {
- background: #000000;
- color: #FF9F00;
-}
-
-/* Content */
-*|*.main-content {
- /* Needed to allow the radius to clip the inner content, see bug 595656 */
- overflow: hidden;
- border: 1px solid #9C9CFF;
- border-radius: 5px;
-}
-
-colorpicker[type="button"] {
- margin: 1px 5px 2px 5px;
- padding: 3px;
- height: 25px;
-}
diff --git a/LCARStrek/global/listbox.css b/LCARStrek/global/listbox.css
index b8fe1d93..cbdf3133 100644
--- a/LCARStrek/global/listbox.css
+++ b/LCARStrek/global/listbox.css
@@ -28,24 +28,31 @@ listbox[disabled="true"] {
listitem {
border: 1px solid transparent;
+
+ --listitem-selectedColor: #000000;
+ --listitem-selectedBackground: #008484;
+ --listitem-selectedFocusColor: #FFCF00;
+ --listitem-selectedFocusBackground: var(--listitem-selectedBackground);
+ --listitem-focusCurrentBorder: #FF9F00;
+ --listitem-selectedFocusCurrentBorder: var(--listitem-focusCurrentBorder);
}
listbox:-moz-focusring > listitem[current="true"] {
- border: 1px dotted #FF9F00;
+ border: 1px dotted var(--listitem-focusCurrentBorder);
}
listbox:-moz-focusring > listitem[current="true"][selected="true"] {
- border: 1px dotted #FF9F00;
+ border: 1px dotted var(--listitem-selectedFocusCurrentBorder);
}
listitem[selected="true"] {
- background-color: #008484;
- color: #000000;
+ background-color: var(--listitem-selectedBackground);
+ color: var(--listitem-selectedColor);
}
listbox:focus > listitem[selected="true"] {
- background-color: #008484;
- color: #FFCF00;
+ background-color: var(--listitem-selectedFocusBackground);
+ color: var(--listitem-selectedFocusColor);
}
/* ::::: listheader ::::: */
diff --git a/LCARStrek/global/toolbarbutton.css b/LCARStrek/global/toolbarbutton.css
index 4b2caa16..32d41b20 100644
--- a/LCARStrek/global/toolbarbutton.css
+++ b/LCARStrek/global/toolbarbutton.css
@@ -177,44 +177,27 @@ toolbarbutton[disabled="true"]:hover:active > toolbarbutton.toolbarbutton-menubu
/* ::::: toolbarbutton badged ::::: */
-.toolbarbutton-badge-container > .toolbarbutton-icon[label]:not([label=""]) {
+.toolbarbutton-badge-stack > .toolbarbutton-icon[label]:not([label=""]) {
-moz-margin-end: 0;
}
-.toolbarbutton-badge[badge=""] {
- display: none;
-}
-
.toolbarbutton-badge {
background-color: #000000;
-}
-
-.toolbarbutton-badge::after {
- /* The |content| property is set in the content stylesheet. */
font-size: 10px;
font-weight: bold;
- padding: 1px 2px 2px;
+ padding: 0 2px 1px;
color: #FF9F00;
- background-color: inherit;
border-radius: 2px;
box-shadow: 0 1px 0 #9C9CFF inset,
0 -1px 0 #9C9CFF inset,
0 1px 0 #9C9CFF;
- position: absolute;
- top: -4px;
- right: -2px;
- min-width: 10px;
+ margin: -6px 0 0 !important;
+ -moz-margin-end: -8px !important;
+ min-width: 14px;
+ max-width: 28px;
line-height: 10px;
text-align: center;
-}
-
-.toolbarbutton-badge:-moz-locale-dir(rtl)::after {
- left: -2px;
- right: auto;
-}
-
-.toolbarbutton-badge-container {
- position: relative;
+ -moz-stack-sizing: ignore;
}
/* .......... dropmarker .......... */
diff --git a/LCARStrek/mozapps/extensions/extensions.css b/LCARStrek/mozapps/extensions/extensions.css
index 1253434a..2be2700d 100644
--- a/LCARStrek/mozapps/extensions/extensions.css
+++ b/LCARStrek/mozapps/extensions/extensions.css
@@ -767,14 +767,13 @@
#detail-screenshot-box {
-moz-margin-end: 2em;
- padding: 10px;
-/* background-color: white;*/
}
#detail-screenshot {
max-width: 300px;
max-height: 300px;
+/* background-color: white;*/
}
#detail-screenshot[loading] {
diff --git a/LCARStrek/mozapps/extensions/utilities.svg b/LCARStrek/mozapps/extensions/utilities.svg
index cc55099a..37c97e4a 100644
--- a/LCARStrek/mozapps/extensions/utilities.svg
+++ b/LCARStrek/mozapps/extensions/utilities.svg
@@ -16,6 +16,12 @@
use[id$="-native"] {
fill: GrayText;
}
+ use[id$="-grayscale"] {
+ fill: #A09090;
+ }
+ use[id$="-inverted"] {
+ fill: #000000;
+ }
</style>
<defs>
<path id="utilities-shape" d="m11.5,13.9l-.6-1.5c.3-.2 .5-.4 .8-.6 .2-.2 .4-.5 .6-.7l1.5,.6c.3,.1 .6,0 .7-.3l.4-1c.1-.3 0-.6-.3-.7l-1.5-.6c.1-.6 .1-1.3 0-2l1.5-.6c.3-.1 .4-.4 .3-.7l-.4-1c-.1-.3-.4-.4-.7-.3l-1.5,.6c-.2-.3-.4-.5-.6-.8-.2-.1-.5-.3-.7-.5l.6-1.5c.1-.3 0-.6-.3-.7l-.9-.4c-.3-.1-.6,0-.7,.3l-.6,1.5c-.6-.1-1.3-.1-2,0l-.6-1.5c-.1-.3-.4-.4-.7-.3l-1,.4c-.2,.1-.3,.4-.2,.6l.6,1.5c-.3,.3-.5,.5-.8,.7-.2,.3-.4,.5-.6,.8l-1.5-.7c-.3-.1-.6,0-.7,.3l-.4,.9c-.1,.3 0,.6 .3,.7l1.5,.7c-.1,.6-.1,1.3 0,1.9l-1.5,.6c-.3,.1-.4,.4-.3,.7l.4,1c.1,.3 .4,.4 .7,.3l1.5-.6c.2,.3 .4,.5 .6,.8 .2,.2 .5,.4 .7,.6l-.6,1.5c-.1,.3 0,.6 .3,.7l1,.4c.3,.1 .6,0 .7-.3l.6-1.5c.6,.1 1.3,.1 2,0l.6,1.5c.1,.3 .4,.4 .7,.3l1-.4c.1-.1 .3-.4 .1-.7zm-5.1-4.2c-.9-.9-.9-2.4 0-3.3 .9-.9 2.4-.9 3.3,0 .9,.9 .9,2.4 0,3.3-.9,.9-2.4,.9-3.3,0z"/>
@@ -23,4 +29,6 @@
<use id="utilities" xlink:href="#utilities-shape"/>
<use id="utilities-hover" xlink:href="#utilities-shape"/>
<use id="utilities-native" xlink:href="#utilities-shape"/>
+ <use id="utilities-grayscale" xlink:href="#utilities-shape"/>
+ <use id="utilities-inverted" xlink:href="#utilities-shape"/>
</svg>