Bug 1022582 - Make in-content checkboxes and radiobuttons visible on HC themes. r=jaws
--- a/toolkit/themes/linux/global/in-content/common.css
+++ b/toolkit/themes/linux/global/in-content/common.css
@@ -41,22 +41,40 @@ xul|menulist:not([editable="true"]) > xu
margin-bottom: 6px;
}
xul|checkbox {
-moz-binding: url("chrome://global/content/bindings/checkbox.xml#checkbox");
-moz-box-align: center;
}
+xul|*.checkbox-check {
+ background-image: none !important;
+}
+
+xul|*.checkbox-check[checked] {
+ list-style-image: url("chrome://global/skin/in-content/check.svg#check-native");
+ background-color: -moz-dialog;
+}
+
xul|radio {
-moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
-moz-box-align: center;
-moz-margin-start: 0;
}
+xul|*.radio-check {
+ background-image: none;
+}
+
+xul|*.radio-check[selected] {
+ list-style-image: url("chrome://global/skin/in-content/radio.svg#radio-native");
+ background-color: -moz-dialog;
+}
+
xul|*.radio-label-box {
-moz-appearance: none;
}
xul|*.numberbox-input-box {
-moz-appearance: none;
border-width: 0;
}
--- a/toolkit/themes/linux/global/jar.mn
+++ b/toolkit/themes/linux/global/jar.mn
@@ -51,15 +51,15 @@ toolkit.jar:
+ skin/classic/global/icons/panelarrow-vertical.svg (icons/panelarrow-vertical.svg)
+ skin/classic/global/icons/resizer.png (icons/resizer.png)
+ skin/classic/global/icons/sslWarning.png (icons/sslWarning.png)
+ skin/classic/global/icons/wrap.png (icons/wrap.png)
+ skin/classic/global/icons/webapps-16.png (icons/webapps-16.png)
+ skin/classic/global/icons/webapps-64.png (icons/webapps-64.png)
skin/classic/global/menu/shared-menu-check.png (../../shared/menu-check.png)
* skin/classic/global/in-content/common.css (in-content/common.css)
- skin/classic/global/in-content/check.png (../../shared/in-content/check.png)
- skin/classic/global/in-content/check@2x.png (../../shared/in-content/check@2x.png)
+ skin/classic/global/in-content/check.svg (../../shared/in-content/check.svg)
skin/classic/global/in-content/dropdown.svg (../../shared/in-content/dropdown.svg)
skin/classic/global/in-content/help-glyph.svg (../../shared/in-content/help-glyph.svg)
+ skin/classic/global/in-content/radio.svg (../../shared/in-content/radio.svg)
skin/classic/global/in-content/sorter.png (../../shared/in-content/sorter.png)
skin/classic/global/in-content/sorter@2x.png (../../shared/in-content/sorter@2x.png)
+ skin/classic/global/toolbar/spring.png (toolbar/spring.png)
--- a/toolkit/themes/osx/global/jar.mn
+++ b/toolkit/themes/osx/global/jar.mn
@@ -181,20 +181,20 @@ toolkit.jar:
skin/classic/global/media/volume-empty@2x.png (media/volume-empty@2x.png)
skin/classic/global/media/volume-full.png (media/volume-full.png)
skin/classic/global/media/volume-full@2x.png (media/volume-full@2x.png)
skin/classic/global/media/clicktoplay-bgtexture.png (media/clicktoplay-bgtexture.png)
skin/classic/global/media/videoClickToPlayButton.svg (media/videoClickToPlayButton.svg)
skin/classic/global/menu/shared-menu-check.png (../../shared/menu-check.png)
skin/classic/global/menu/shared-menu-check@2x.png (../../shared/menu-check@2x.png)
* skin/classic/global/in-content/common.css (in-content/common.css)
- skin/classic/global/in-content/check.png (../../shared/in-content/check.png)
- skin/classic/global/in-content/check@2x.png (../../shared/in-content/check@2x.png)
+ skin/classic/global/in-content/check.svg (../../shared/in-content/check.svg)
skin/classic/global/in-content/dropdown.svg (../../shared/in-content/dropdown.svg)
skin/classic/global/in-content/help-glyph.svg (../../shared/in-content/help-glyph.svg)
+ skin/classic/global/in-content/radio.svg (../../shared/in-content/radio.svg)
skin/classic/global/in-content/sorter.png (../../shared/in-content/sorter.png)
skin/classic/global/in-content/sorter@2x.png (../../shared/in-content/sorter@2x.png)
skin/classic/global/scale/scale-tray-horiz.gif (scale/scale-tray-horiz.gif)
skin/classic/global/scale/scale-tray-vert.gif (scale/scale-tray-vert.gif)
skin/classic/global/splitter/dimple.png (splitter/dimple.png)
skin/classic/global/splitter/grip-bottom.gif (splitter/grip-bottom.gif)
skin/classic/global/splitter/grip-top.gif (splitter/grip-top.gif)
skin/classic/global/splitter/grip-left.gif (splitter/grip-left.gif)
deleted file mode 100644
index 98c89d66e628dcf852fbe1774363c0efff8876ff..0000000000000000000000000000000000000000
GIT binary patch
literal 0
Hc$@<O00001
new file mode 100644
--- /dev/null
+++ b/toolkit/themes/shared/in-content/check.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 21 21" enable-background="new 0 0 21 21" xml:space="preserve">
+ <style>
+ use:not(:target) {
+ display: none;
+ }
+ use {
+ fill: #2292d0;
+ }
+ use[id$="-native"] {
+ fill: -moz-dialogText;
+ }
+ </style>
+ <defs style="display: none;">
+ <path id="check-shape" d="M 9.39,16.5 16.28,6 14.77,4.5 9.37,12.7 6.28,9.2 4.7,10.7 z"/>
+ </defs>
+ <use id="check" xlink:href="#check-shape"/>
+ <use id="check-native" xlink:href="#check-shape"/>
+</svg>
deleted file mode 100644
index 3d97c886af7e2137f490f8a2588d402b725da51a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
Hc$@<O00001
--- a/toolkit/themes/shared/in-content/common.inc.css
+++ b/toolkit/themes/shared/in-content/common.inc.css
@@ -392,49 +392,40 @@ xul|checkbox {
xul|*.checkbox-check {
-moz-appearance: none;
width: 23px;
height: 23px;
border-radius: 2px;
border: 1px solid #c1c1c1;
-moz-margin-end: 10px;
background-color: #f1f1f1;
- background-image: linear-gradient(#fff, rgba(255,255,255,0.8));
+ /* !important needed to override toolkit checked !important rule */
+ background-image: linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
background-position: center center;
background-repeat: no-repeat;
box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
}
xul|checkbox:not([disabled="true"]):hover > xul|*.checkbox-check {
border-color: #0095dd;
}
xul|*.checkbox-check[checked] {
- background-image: url("chrome://global/skin/in-content/check.png"),
- /* !important needed to override toolkit !important rule */
- linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
+ list-style-image: url("chrome://global/skin/in-content/check.svg#check");
}
xul|checkbox[disabled="true"] > xul|*.checkbox-check {
opacity: 0.5;
}
xul|*.checkbox-label-box {
-moz-margin-start: -1px; /* negative margin for the transparent border */
-moz-padding-start: 0;
}
-@media (min-resolution: 2dppx) {
- xul|*.checkbox-check[checked] {
- background-size: 12px 12px, auto;
- background-image: url("chrome://global/skin/in-content/check@2x.png"),
- linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
- }
-}
-
xul|richlistitem > xul|*.checkbox-check {
margin: 3px 6px;
}
xul|*.radio-check {
-moz-appearance: none;
width: 23px;
height: 23px;
@@ -446,20 +437,17 @@ xul|*.radio-check {
box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
}
xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
border-color: #0095dd;
}
xul|*.radio-check[selected] {
- background-image: radial-gradient(circle, rgb(23,146,229),
- rgb(76,177,255) 5.5px, rgba(76,177,255,0.2) 6px,
- transparent 6px),
- linear-gradient(rgb(255,255,255), rgba(255,255,255,0.8));
+ list-style-image: url("chrome://global/skin/in-content/radio.svg#radio");
}
xul|radio[disabled="true"] > xul|*.radio-check {
opacity: 0.5;
}
xul|*.radio-label-box {
-moz-margin-start: -1px; /* negative margin for the transparent border */
new file mode 100644
--- /dev/null
+++ b/toolkit/themes/shared/in-content/radio.svg
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+ viewBox="0 0 21 21" enable-background="new 0 0 21 21" xml:space="preserve">
+ <style>
+ use:not(:target) {
+ display: none;
+ }
+ use {
+ fill: #2292d0;
+ }
+ use[id$="-native"] {
+ fill: -moz-dialogText;
+ }
+ </style>
+ <defs style="display: none;">
+ <circle id="radio-shape" cx="10.5" cy="10.5" r="6"/>
+ </defs>
+ <use id="radio" xlink:href="#radio-shape"/>
+ <use id="radio-native" xlink:href="#radio-shape"/>
+</svg>
--- a/toolkit/themes/windows/global/in-content/common.css
+++ b/toolkit/themes/windows/global/in-content/common.css
@@ -18,22 +18,44 @@ xul|menulist:not([editable="true"]) > xu
margin-top: 1px;
margin-bottom: 1px;
}
xul|checkbox {
-moz-padding-start: 0;
}
+@media not all and (-moz-windows-default-theme) {
+ xul|*.checkbox-check {
+ background-image: none !important;
+ }
+
+ xul|*.checkbox-check[checked] {
+ list-style-image: url("chrome://global/skin/in-content/check.svg#check-native");
+ background-color: -moz-dialog;
+ }
+}
+
xul|radio {
-moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
-moz-margin-start: 0;
-moz-padding-start: 0;
}
+@media not all and (-moz-windows-default-theme) {
+ xul|*.radio-check {
+ background-image: none;
+ }
+
+ xul|*.radio-check[selected] {
+ list-style-image: url("chrome://global/skin/in-content/radio.svg#radio-native");
+ background-color: -moz-dialog;
+ }
+}
+
xul|*.radio-icon,
xul|*.checkbox-icon {
-moz-margin-end: 0;
}
html|a:-moz-focusring,
xul|*.text-link:-moz-focusring,
xul|*.inline-link:-moz-focusring {
--- a/toolkit/themes/windows/global/jar.mn
+++ b/toolkit/themes/windows/global/jar.mn
@@ -166,20 +166,20 @@ toolkit.jar:
skin/classic/global/media/stalled.png (media/stalled.png)
skin/classic/global/media/volume-empty.png (media/volume-empty.png)
skin/classic/global/media/volume-full.png (media/volume-full.png)
skin/classic/global/media/error.png (media/error.png)
skin/classic/global/media/clicktoplay-bgtexture.png (media/clicktoplay-bgtexture.png)
skin/classic/global/media/videoClickToPlayButton.svg (media/videoClickToPlayButton.svg)
skin/classic/global/menu/shared-menu-check.png (../../shared/menu-check.png)
* skin/classic/global/in-content/common.css (in-content/common.css)
- skin/classic/global/in-content/check.png (../../shared/in-content/check.png)
- skin/classic/global/in-content/check@2x.png (../../shared/in-content/check@2x.png)
+ skin/classic/global/in-content/check.svg (../../shared/in-content/check.svg)
skin/classic/global/in-content/dropdown.svg (../../shared/in-content/dropdown.svg)
skin/classic/global/in-content/help-glyph.svg (../../shared/in-content/help-glyph.svg)
+ skin/classic/global/in-content/radio.svg (../../shared/in-content/radio.svg)
skin/classic/global/in-content/sorter.png (../../shared/in-content/sorter.png)
skin/classic/global/in-content/sorter@2x.png (../../shared/in-content/sorter@2x.png)
skin/classic/global/printpreview/arrow-left.png (printpreview/arrow-left.png)
skin/classic/global/printpreview/arrow-left-end.png (printpreview/arrow-left-end.png)
skin/classic/global/printpreview/arrow-right.png (printpreview/arrow-right.png)
skin/classic/global/printpreview/arrow-right-end.png (printpreview/arrow-right-end.png)
skin/classic/global/radio/radio-check.gif (radio/radio-check.gif)
skin/classic/global/radio/radio-check-dis.gif (radio/radio-check-dis.gif)
@@ -358,20 +358,20 @@ toolkit.jar:
skin/classic/aero/global/media/stalled.png (media/stalled.png)
skin/classic/aero/global/media/volume-empty.png (media/volume-empty.png)
skin/classic/aero/global/media/volume-full.png (media/volume-full.png)
skin/classic/aero/global/media/error.png (media/error.png)
skin/classic/aero/global/media/clicktoplay-bgtexture.png (media/clicktoplay-bgtexture.png)
skin/classic/aero/global/media/videoClickToPlayButton.svg (media/videoClickToPlayButton.svg)
skin/classic/aero/global/menu/shared-menu-check.png (../../shared/menu-check.png)
* skin/classic/aero/global/in-content/common.css (in-content/common.css)
- skin/classic/aero/global/in-content/check.png (../../shared/in-content/check.png)
- skin/classic/aero/global/in-content/check@2x.png (../../shared/in-content/check@2x.png)
+ skin/classic/aero/global/in-content/check.svg (../../shared/in-content/check.svg)
skin/classic/aero/global/in-content/dropdown.svg (../../shared/in-content/dropdown.svg)
skin/classic/aero/global/in-content/help-glyph.svg (../../shared/in-content/help-glyph.svg)
+ skin/classic/aero/global/in-content/radio.svg (../../shared/in-content/radio.svg)
skin/classic/aero/global/in-content/sorter.png (../../shared/in-content/sorter.png)
skin/classic/aero/global/in-content/sorter@2x.png (../../shared/in-content/sorter@2x.png)
skin/classic/aero/global/printpreview/arrow-left.png (printpreview/arrow-left-aero.png)
skin/classic/aero/global/printpreview/arrow-left-end.png (printpreview/arrow-left-end-aero.png)
skin/classic/aero/global/printpreview/arrow-right.png (printpreview/arrow-right-aero.png)
skin/classic/aero/global/printpreview/arrow-right-end.png (printpreview/arrow-right-end-aero.png)
skin/classic/aero/global/radio/radio-check.gif (radio/radio-check.gif)
skin/classic/aero/global/radio/radio-check-dis.gif (radio/radio-check-dis.gif)
