diff --git a/dom/public/idl/xul/nsIDOMXULButtonElement.idl b/dom/public/idl/xul/nsIDOMXULButtonElement.idl
index 5b6b3a730526..08cf8676a7a5 100644
--- a/dom/public/idl/xul/nsIDOMXULButtonElement.idl
+++ b/dom/public/idl/xul/nsIDOMXULButtonElement.idl
@@ -51,5 +51,8 @@ interface nsIDOMXULButtonElement : nsIDOMXULLabeledControlElement {
attribute boolean checked;
attribute long checkState;
attribute boolean autoCheck;
+
+ // For buttons of type="radio" only.
+ attribute DOMString group;
};
diff --git a/editor/ui/composer/content/editor.js b/editor/ui/composer/content/editor.js
index 00ce81bbd353..c1c5e40eae4e 100644
--- a/editor/ui/composer/content/editor.js
+++ b/editor/ui/composer/content/editor.js
@@ -2006,7 +2006,7 @@ function onButtonUpdate(button, commmandID)
var commandNode = document.getElementById(commmandID);
var state = commandNode.getAttribute("state");
- button.setAttribute("toggled", state);
+ button.checked = state == "true";
}
//--------------------------------------------------------------------
@@ -2015,7 +2015,7 @@ function onStateButtonUpdate(button, commmandID, onState)
var commandNode = document.getElementById(commmandID);
var state = commandNode.getAttribute("state");
- button.setAttribute("toggled", (state == onState) ? "true" : "false");
+ button.checked = state == onState;
}
@@ -2032,7 +2032,7 @@ function onStyleChange(theStyle)
var theButton = document.getElementById(theStyle + "Button");
if (theButton)
{
- theButton.setAttribute("toggled", (isOn == "true") ? 1 : 0);
+ theButton.checked = isOn == "true";
}
var theMenuItem = document.getElementById(theStyle + "MenuItem");
diff --git a/editor/ui/composer/content/editorOverlay.xul b/editor/ui/composer/content/editorOverlay.xul
index 08c2d27ddfd0..8172b32858ef 100644
--- a/editor/ui/composer/content/editorOverlay.xul
+++ b/editor/ui/composer/content/editorOverlay.xul
@@ -744,25 +744,25 @@
-
-
+
-
-
-
-
@@ -773,25 +773,25 @@
tooltip="aTooltip" tooltiptext="&indentToolbarCmd.tooltip;"/>
-
-
-
-
-
.button-box {
+ border-left : 1px solid ThreeDShadow;
+ border-top : 1px solid ThreeDShadow;
+ border-right : 1px solid ThreeDHighlight;
+ border-bottom : 1px solid ThreeDHighlight;
+ background-color : ThreeDHighlight;
+}
+
+.button-toolbar[checked="true"]:hover > .button-box {
+ border-left : 1px solid ThreeDShadow;
+ border-top : 1px solid ThreeDShadow;
+ border-right : 1px solid ThreeDHighlight;
+ border-bottom : 1px solid ThreeDHighlight;
+ background-color : -moz-Dialog;
+ background-image : none;
+}
+
.button-toolbar > .button-box > .button-box-2,
.button-toolbar > .button-box > .button-box-2 > .button-box-text {
margin: none;
diff --git a/themes/classic/global/mac/toolbarbutton.css b/themes/classic/global/mac/toolbarbutton.css
index 5be3127342a0..385469875f1c 100644
--- a/themes/classic/global/mac/toolbarbutton.css
+++ b/themes/classic/global/mac/toolbarbutton.css
@@ -99,9 +99,9 @@ toolbarbutton[disabled="true"][buttondown="true"] > .toolbarbutton-box {
background-color : transparent;
}
-/* ..... toggled state ..... */
+/* ..... checked state ..... */
-toolbarbutton[toggled="true"] > .toolbarbutton-box {
+toolbarbutton[checked="true"] > .toolbarbutton-box {
border-left : 1px solid #9D9D9D;
border-top : 1px solid #9D9D9D;
border-right : 1px solid #FFFFFF;
@@ -109,7 +109,7 @@ toolbarbutton[toggled="true"] > .toolbarbutton-box {
background-color : #FFFFFF;
}
-toolbarbutton[toggled="true"]:hover > .toolbarbutton-box {
+toolbarbutton[checked="true"]:hover > .toolbarbutton-box {
border-left : 1px solid #9D9D9D;
border-top : 1px solid #9D9D9D;
border-right : 1px solid #FFFFFF;
diff --git a/themes/classic/global/win/button.css b/themes/classic/global/win/button.css
index b95913a35989..a2c9d9858aed 100644
--- a/themes/classic/global/win/button.css
+++ b/themes/classic/global/win/button.css
@@ -48,12 +48,15 @@
}
button:hover:active,
- button[open="true"]
+ button[open="true"],
+ button[checked="true"]
{
border : 1px solid ThreeDDarkShadow;
}
button:hover:active > .button-box,
+ button[checked="true"] > .button-box,
+ button[checked="true"]:focus > .button-box,
button[open="true"] > .button-box,
button[open="true"]:focus > .button-box
{
@@ -61,6 +64,8 @@
}
button:hover:active > .button-box > .button-box-2,
+ button[checked="true"] > .button-box > .button-box-2,
+ button[checked="true"]:focus> .button-box > .button-box-2,
button[open="true"] > .button-box > .button-box-2,
button[open="true"]:focus > .button-box > .button-box-2
{
diff --git a/themes/classic/global/win/toolbarbutton.css b/themes/classic/global/win/toolbarbutton.css
index 008cbf5067ee..3f9a64c9ecf7 100644
--- a/themes/classic/global/win/toolbarbutton.css
+++ b/themes/classic/global/win/toolbarbutton.css
@@ -96,9 +96,9 @@ toolbarbutton[disabled="true"][buttondown="true"] > .toolbarbutton-box {
padding : 2px;
}
-/* ..... toggled state ..... */
+/* ..... checked state ..... */
-toolbarbutton[toggled="true"] > .toolbarbutton-box {
+toolbarbutton[checked="true"] > .toolbarbutton-box {
border-left : 1px solid ThreeDShadow;
border-top : 1px solid ThreeDShadow;
border-right : 1px solid ThreeDHighlight;
@@ -106,7 +106,7 @@ toolbarbutton[toggled="true"] > .toolbarbutton-box {
background-color : ThreeDHighlight;
}
-toolbarbutton[toggled="true"]:hover > .toolbarbutton-box {
+toolbarbutton[checked="true"]:hover > .toolbarbutton-box {
border-left : 1px solid ThreeDShadow;
border-top : 1px solid ThreeDShadow;
border-right : 1px solid ThreeDHighlight;
diff --git a/themes/modern/editor/editorFormatToolbar.css b/themes/modern/editor/editorFormatToolbar.css
index cd9f11dc0ede..081dba49d55a 100644
--- a/themes/modern/editor/editorFormatToolbar.css
+++ b/themes/modern/editor/editorFormatToolbar.css
@@ -29,7 +29,7 @@
border: none !important;
}
-#FormatToolbar > toolbarbutton[toggled="true"] {
+#FormatToolbar > toolbarbutton[checked="true"] {
background-color: transparent;
}
@@ -41,8 +41,8 @@
list-style-image: url("chrome://editor/skin/btn2/dec-font-size-hov.gif");
}
-#DecreaseFontSizeButton[toggled="true"],
-#DecreaseFontSizeButton[toggled="true"]:hover,
+#DecreaseFontSizeButton[checked="true"],
+#DecreaseFontSizeButton[checked="true"]:hover,
#DecreaseFontSizeButton:hover:active {
list-style-image: url("chrome://editor/skin/btn2/dec-font-size-act.gif");
}
@@ -60,8 +60,8 @@
list-style-image: url("chrome://editor/skin/btn2/inc-font-size-hov.gif");
}
-#IncreaseFontSizeButton[toggled="true"],
-#IncreaseFontSizeButton[toggled="true"]:hover,
+#IncreaseFontSizeButton[checked="true"],
+#IncreaseFontSizeButton[checked="true"]:hover,
#IncreaseFontSizeButton:hover:active {
list-style-image: url("chrome://editor/skin/btn2/inc-font-size-act.gif");
}
@@ -83,7 +83,7 @@
list-style-image: url("chrome://editor/skin/btn2/bold-act.gif");
}
-#boldButton[toggled="true"] {
+#boldButton[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/bold-sel.gif");
}
@@ -104,7 +104,7 @@
list-style-image: url("chrome://editor/skin/btn2/italic-act.gif");
}
-#italicButton[toggled="true"] {
+#italicButton[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/italic-sel.gif");
}
@@ -125,7 +125,7 @@
list-style-image: url("chrome://editor/skin/btn2/underline-act.gif");
}
-#underlineButton[toggled="true"] {
+#underlineButton[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/underline-sel.gif");
}
@@ -146,7 +146,7 @@
list-style-image: url("chrome://editor/skin/btn2/bullets-act.gif");
}
-#ulButton[toggled="true"] {
+#ulButton[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/bullets-sel.gif");
}
@@ -167,7 +167,7 @@
list-style-image: url("chrome://editor/skin/btn2/numbers-act.gif");
}
-#olButton[toggled="true"] {
+#olButton[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/numbers-sel.gif");
}
@@ -184,8 +184,8 @@
list-style-image: url("chrome://editor/skin/btn2/outdent-hov.gif");
}
-#outdentButton[toggled="true"],
-#outdentButton[toggled="true"]:hover,
+#outdentButton[checked="true"],
+#outdentButton[checked="true"]:hover,
#outdentButton:hover:active {
list-style-image: url("chrome://editor/skin/btn2/outdent-act.gif");
}
@@ -203,8 +203,8 @@
list-style-image: url("chrome://editor/skin/btn2/indent-hov.gif");
}
-#indentButton[toggled="true"],
-#indentButton[toggled="true"]:hover,
+#indentButton[checked="true"],
+#indentButton[checked="true"]:hover,
#indentButton:hover:active {
list-style-image: url("chrome://editor/skin/btn2/indent-act.gif");
}
@@ -336,7 +336,7 @@
list-style-image: url("chrome://editor/skin/btn2/left-act.gif");
}
-#align-left-button[toggled="true"] {
+#align-left-button[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/left-sel.gif");
}
@@ -357,7 +357,7 @@
list-style-image: url("chrome://editor/skin/btn2/center-act.gif");
}
-#align-center-button[toggled="true"] {
+#align-center-button[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/center-sel.gif");
}
@@ -378,7 +378,7 @@
list-style-image: url("chrome://editor/skin/btn2/right-act.gif");
}
-#align-right-button[toggled="true"] {
+#align-right-button[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/right-sel.gif");
}
@@ -399,7 +399,7 @@
list-style-image: url("chrome://editor/skin/btn2/justify-act.gif");
}
-#align-justify-button[toggled="true"] {
+#align-justify-button[checked="true"] {
list-style-image: url("chrome://editor/skin/btn2/justify-sel.gif");
}
diff --git a/themes/modern/global/button.css b/themes/modern/global/button.css
index d1990055ff53..024ff114dd7e 100644
--- a/themes/modern/global/button.css
+++ b/themes/modern/global/button.css
@@ -115,54 +115,64 @@ button[default]:focus {
height: 8px;
}
-/* .......... active/open state .......... */
+/* .......... active/open/checked state .......... */
button:hover:active,
+button[checked="true"],
button[open="true"] {
color: #FFFFFF;
}
button:hover:active > .box-inherit > .button-box-left > .button-left-top,
+button[checked="true"] > .box-inherit > .button-box-left > .button-left-top,
button[open="true"] > .box-inherit > .button-box-left > .button-left-top {
background-image: url("chrome://global/skin/button/btn-act-lft-top.gif");
}
button:hover:active > .box-inherit > .button-box-left > .button-left-mid,
+button[checked="true"] > .box-inherit > .button-box-left > .button-left-mid,
button[open="true"] > .box-inherit > .button-box-left > .button-left-mid {
background-image: url("chrome://global/skin/button/btn-act-lft-mid.gif");
}
button:hover:active > .box-inherit > .button-box-left > .button-left-btm,
+button[checked="true"] > .box-inherit > .button-box-left > .button-left-btm,
button[open="true"] > .box-inherit > .button-box-left > .button-left-btm {
background-image: url("chrome://global/skin/button/btn-act-lft-btm.gif");
}
button:hover:active > .box-inherit > .button-stack > .button-box-mid,
+button[checked="true"] > .box-inherit > .button-stack > .button-box-mid,
button[open="true"] > .box-inherit > .button-stack > .button-box-mid {
background-color: #90A1B3;
}
button:hover:active > .box-inherit > .button-stack > .button-box-mid > .button-mid-top,
+button[checked="true"] > .box-inherit > .button-stack > .button-box-mid > .button-mid-top,
button[open="true"] > .box-inherit > .button-stack > .button-box-mid > .button-mid-top {
background-image: url("chrome://global/skin/button/btn-act-mid-top.gif");
}
button:hover:active > .box-inherit > .button-stack > .button-box-mid > .button-mid-btm,
+button[checked="true"] > .box-inherit > .button-stack > .button-box-mid > .button-mid-btm,
button[open="true"] > .box-inherit > .button-stack > .button-box-mid > .button-mid-btm {
background-image: url("chrome://global/skin/button/btn-act-mid-btm.gif");
}
button:hover:active > .box-inherit > .button-box-right > .button-right-top,
+button[checked="true"] > .box-inherit > .button-box-right > .button-right-top,
button[open="true"] > .box-inherit > .button-box-right > .button-right-top {
background-image: url("chrome://global/skin/button/btn-act-rit-top.gif");
}
button:hover:active > .box-inherit > .button-box-right > .button-right-mid,
+button[checked="true"] > .box-inherit > .button-box-right > .button-right-mid,
button[open="true"] > .box-inherit > .button-box-right > .button-right-mid {
background-image: url("chrome://global/skin/button/btn-act-rit-mid.gif");
}
button:hover:active > .box-inherit > .button-box-right > .button-right-btm,
+button[checked="true"] > .box-inherit > .button-box-right > .button-right-btm,
button[open="true"] > .box-inherit > .button-box-right > .button-right-btm {
background-image: url("chrome://global/skin/button/btn-act-rit-btm.gif");
}
diff --git a/themes/modern/global/toolbarbutton.css b/themes/modern/global/toolbarbutton.css
index cbc8cd6f508f..df464c5b3209 100644
--- a/themes/modern/global/toolbarbutton.css
+++ b/themes/modern/global/toolbarbutton.css
@@ -84,11 +84,11 @@ toolbarbutton[open="true"] > .toolbarbutton-box {
padding: 2px 1px 0px 3px;
}
-/* ..... toggled state ..... */
+/* ..... checked state ..... */
-toolbarbutton[toggled="true"],
-toolbarbutton[toggled="true"]:hover,
-toolbarbutton[toggled="true"]:hover:active {
+toolbarbutton[checked="true"],
+toolbarbutton[checked="true"]:hover,
+toolbarbutton[checked="true"]:hover:active {
border-top: 1px solid #454C55;
border-right: 1px solid #7D848D;
border-bottom: 1px solid #7D848D;
@@ -97,7 +97,7 @@ toolbarbutton[toggled="true"]:hover:active {
color: #EFF1F4;
}
-toolbarbutton[toggled="true"]:hover:active > .toolbarbutton-box {
+toolbarbutton[checked="true"]:hover:active > .toolbarbutton-box {
padding: 1px 2px 1px 2px;
}
diff --git a/xpfe/components/console/resources/content/console.js b/xpfe/components/console/resources/content/console.js
index 72a3868f331e..8f15d57e31d5 100644
--- a/xpfe/components/console/resources/content/console.js
+++ b/xpfe/components/console/resources/content/console.js
@@ -66,7 +66,6 @@ function changeMode(aMode)
}
document.persist("ConsoleBox", "mode");
- updateModeCommand(aMode);
}
function clearConsole()
@@ -97,13 +96,8 @@ function updateSortCommand(aOrder)
function updateModeCommand(aMode)
{
- var bcset = document.getElementById("ModeBroadcasters");
- for (var i = 0; i < bcset.childNodes.length; i++) {
- bcset.childNodes[i].removeAttribute("toggled");
- }
-
var bc = document.getElementById("Console:mode" + aMode);
- bc.setAttribute("toggled", "true");
+ bc.setAttribute("checked", true);
}
function toggleToolbar(aEl)
diff --git a/xpfe/components/console/resources/content/console.xul b/xpfe/components/console/resources/content/console.xul
index 9ebceae16deb..7f97244fe682 100644
--- a/xpfe/components/console/resources/content/console.xul
+++ b/xpfe/components/console/resources/content/console.xul
@@ -65,12 +65,10 @@ Contributor(s): Joe Hewitt
oncommand="changeSortOrder(-1);"/>
@@ -118,8 +116,8 @@ Contributor(s): Joe Hewitt
@@ -136,10 +134,10 @@ Contributor(s): Joe Hewitt
-
-
-
-
+
+
+
+
diff --git a/xpfe/components/search/resources/internetresults.js b/xpfe/components/search/resources/internetresults.js
index d14d0d15a9b3..986740d7abe5 100644
--- a/xpfe/components/search/resources/internetresults.js
+++ b/xpfe/components/search/resources/internetresults.js
@@ -77,12 +77,7 @@ function loadResultsTree( aSearchURL )
function doEngineClick( event, aNode )
{
- // do toggling
- var engineTabBox = document.getElementById("engineTabs");
- var toggledEls = engineTabBox.getElementsByAttribute("toggled", "true");
- for (var i = 0; i < toggledEls.length; i++)
- toggledEls[i].removeAttribute("toggled");
- event.target.setAttribute("toggled", "true");
+ event.target.checked = true;
var html = null;
diff --git a/xpfe/components/search/resources/internetresults.xul b/xpfe/components/search/resources/internetresults.xul
index 2b9f0d83a1d9..7b5299c7a0af 100644
--- a/xpfe/components/search/resources/internetresults.xul
+++ b/xpfe/components/search/resources/internetresults.xul
@@ -30,15 +30,15 @@
ref="NC:SearchResultsSitesRoot" datasources="rdf:internetsearch"
style="overflow: none; min-width: 1px;">
-
-
+ checked="true"/>
diff --git a/xpfe/global/resources/content/bindings/button.xml b/xpfe/global/resources/content/bindings/button.xml
index 764b99093094..e30e77f99def 100644
--- a/xpfe/global/resources/content/bindings/button.xml
+++ b/xpfe/global/resources/content/bindings/button.xml
@@ -29,10 +29,80 @@
]]>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+