Bug 471921 - use proper CSS instead of first-tab, last-tab and afterselected attributes. r=gavin
authorDão Gottwald <dao@mozilla.com>
Fri, 09 Jan 2009 10:57:57 +0100
changeset 23504 7e5854c047bd7b1161cce2a3d9de8f82d22a85bc
parent 23503 fe759e3fd8950cc6c3525b435ef1a389fffc9047
child 23505 37699a458f2849049757da006911fcc8c65813f9
push id1
push userroot
push dateTue, 26 Apr 2011 22:38:44 +0000
treeherdermozilla-beta@bfdb6e623a36 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgavin
bugs471921
milestone1.9.2a1pre
Bug 471921 - use proper CSS instead of first-tab, last-tab and afterselected attributes. r=gavin
toolkit/content/widgets/tabbox.xml
toolkit/themes/pinstripe/global/tabbox.css
toolkit/themes/winstripe/global/tabbox.css
widget/src/xpwidgets/nsWidgetAtomList.h
--- a/toolkit/content/widgets/tabbox.xml
+++ b/toolkit/content/widgets/tabbox.xml
@@ -634,30 +634,34 @@
       </property>
 
       <property name="selected" readonly="true"
                 onget="return this.getAttribute('selected') == 'true';"/>
 
       <property name="_selected">
         <setter>
           <![CDATA[
-          this.setAttribute("selected", val);
+          if (val)
+            this.setAttribute("selected", "true");
+          else
+            this.removeAttribute("selected");
+
           if (this.previousSibling && this.previousSibling.localName == "tab") {
             if (val)
-              this.previousSibling.setAttribute("beforeselected", val);
+              this.previousSibling.setAttribute("beforeselected", "true");
             else
               this.previousSibling.removeAttribute("beforeselected");
             this.removeAttribute("first-tab");
           }
           else
             this.setAttribute("first-tab", "true");
 
           if (this.nextSibling && this.nextSibling.localName == "tab") {
             if (val)
-              this.nextSibling.setAttribute("afterselected", val);
+              this.nextSibling.setAttribute("afterselected", "true");
             else
               this.nextSibling.removeAttribute("afterselected");
             this.removeAttribute("last-tab");
           }
           else
             this.setAttribute("last-tab", "true");
           return val;
         ]]>
--- a/toolkit/themes/pinstripe/global/tabbox.css
+++ b/toolkit/themes/pinstripe/global/tabbox.css
@@ -30,21 +30,21 @@ tabbox > tabs {
   margin-bottom: -12px;
   position: relative;
 }
 
 tab {
   -moz-appearance: tab;
 }
 
-tab[first-tab=true] {
+tab:first-of-type {
   -moz-padding-start: 2px;
 }
 
-tab[last-tab=true] {
+tab:last-of-type {
   -moz-padding-end: 2px;
 }
 
 .tab-middle {
   padding: 2px 6px;
 }
 
 .tabs-left,
@@ -111,23 +111,23 @@ tabs.tabs-bottom > tab[selected=true] {
 }
 
 tabbox.tabs-bottom > tabs > tab[beforeselected=true],
 tabs.tabs-bottom > tab[beforeselected=true] {
   -moz-border-end-color: transparent;
   -moz-margin-end: -2px;
 }
 
-tabbox.tabs-bottom > tabs > tab:not([selected=true])[first-tab=true],
-tabs.tabs-bottom > tab:not([selected=true])[first-tab=true] {
+tabbox.tabs-bottom > tabs > tab:first-of-type:not([selected=true]),
+tabs.tabs-bottom > tab:first-of-type:not([selected=true]) {
   -moz-border-start: 4px solid transparent;
 }
 
-tabbox.tabs-bottom > tabs > tab[selected=true][first-tab=true],
-tabs.tabs-bottom > tab[selected=true][first-tab=true] {
+tabbox.tabs-bottom > tabs > tab:first-of-type[selected=true],
+tabs.tabs-bottom > tab:first-of-type[selected=true] {
   -moz-margin-start: 2px;
 }
 
 tabbox.tabs-bottom,
 tabbox.tabs-bottom > tabpanels,
 tabbox.tabs-bottom > tabs > tab[selected=true] > .tab-middle,
 tabs.tabs-bottom > tab[selected=true] > .tab-middle {
   -moz-appearance: dialog;
--- a/toolkit/themes/winstripe/global/tabbox.css
+++ b/toolkit/themes/winstripe/global/tabbox.css
@@ -101,29 +101,29 @@ tab[selected="true"] {
   padding: 1px 6px 4px 6px;
 }
 
 tab:focus > .tab-middle {
   /* Don't specify the outline-color, we should always use initial value. */
   outline: 1px dotted;
 }
 
-tab[beforeselected="true"],
-tab[afterselected="true"][chromedir="rtl"] {
+tab[beforeselected="true"]:not([chromedir="rtl"]),
+tab[selected="true"][chromedir="rtl"] + tab {
   border-right: none;
   -moz-border-radius-topright: 0;
 }
 
-tab[afterselected="true"],
+tab[selected="true"]:not([chromedir="rtl"]) + tab,
 tab[beforeselected="true"][chromedir="rtl"] {
   border-left: none;
   -moz-border-radius-topleft: 0;
 }
 
-tab[first-tab="true"][selected="true"] {
+tab:first-of-type[selected="true"] {
   padding-right: 5px;
   padding-left: 5px;
 }
 
 /* ::::: tab-bottom ::::::::::
    :: Tabs that are attached to the bottom of a panel, but not necessarily
    :: a tabpanels.
    ::::: */
@@ -143,22 +143,22 @@ tab[first-tab="true"][selected="true"] {
 }
 
 .tab-bottom[selected="true"] {
   margin-bottom: 0;
   -moz-border-top-colors: -moz-Dialog;
   padding: 4px 6px 1px 6px;
 }
 
-.tab-bottom[beforeselected="true"],
-.tab-bottom[afterselected="true"][chromedir="rtl"] {
+.tab-bottom[beforeselected="true"]:not([chromedir="rtl"]),
+.tab-bottom[selected="true"][chromedir="rtl"] + .tab-bottom {
   -moz-border-radius-bottomright: 0;
 }
 
-.tab-bottom[afterselected="true"],
+.tab-bottom[selected="true"]:not([chromedir="rtl"]) + .tab-bottom,
 .tab-bottom[beforeselected="true"][chromedir="rtl"] {
   -moz-border-radius-bottomleft: 0;
 }
 
 /* ::::: tabs-bottom ::::: */
 
 .tabs-bottom > .tabs-left,
 .tabs-bottom > .tabs-right {
--- a/widget/src/xpwidgets/nsWidgetAtomList.h
+++ b/widget/src/xpwidgets/nsWidgetAtomList.h
@@ -67,30 +67,28 @@ WIDGET_ATOM(collapsed, "collapsed")
 WIDGET_ATOM(comboboxControlFrame, "ComboboxControlFrame")
 WIDGET_ATOM(command, "command")
 WIDGET_ATOM(curpos, "curpos")
 WIDGET_ATOM(_default, "default")
 WIDGET_ATOM(descending, "descending")
 WIDGET_ATOM(dir, "dir")
 WIDGET_ATOM(disabled, "disabled")
 WIDGET_ATOM(_false, "false")
-WIDGET_ATOM(firsttab, "first-tab")
 WIDGET_ATOM(focused, "focused")
 WIDGET_ATOM(Forward, "Forward")
 WIDGET_ATOM(Home, "Home")
 WIDGET_ATOM(hidden, "hidden")
 WIDGET_ATOM(hidecolumnpicker, "hidecolumnpicker")
 WIDGET_ATOM(horizontal, "horizontal")
 WIDGET_ATOM(vertical, "vertical")
 WIDGET_ATOM(id, "id")
 WIDGET_ATOM(image, "image")
 WIDGET_ATOM(input, "input")
 WIDGET_ATOM(key, "key") // The key element / attribute
 WIDGET_ATOM(label, "label")
-WIDGET_ATOM(lasttab, "last-tab")
 WIDGET_ATOM(max, "max")
 WIDGET_ATOM(maxpos, "maxpos")
 WIDGET_ATOM(menu, "menu") // Represents an XP menu
 WIDGET_ATOM(menuitem, "menuitem") // Represents an XP menu item
 WIDGET_ATOM(menupopup, "menupopup") // The XP menu's children.
 WIDGET_ATOM(menuseparator, "menuseparator")  // Divider between menu items
 WIDGET_ATOM(menuFrame, "MenuFrame")
 WIDGET_ATOM(minpos, "minpos")