EarlyBlue/skin/EarlyBlue/global/button.css

   1 /* NEW WIDGET ANDING: <button> */
   2
   3 /** Default Button Styles (apply to usage of <button> without
   4  *  any applied class).
   5  **/
   6
   7 /* outer frame */
   8   button
   9     {
  10       border              : none;
  11       margin              : 1px 5px 2px 5px;
  12       min-width           : 6.3em;
  13       background-color    : #CCD0DD;
  14       color               : #000000;
  15       -moz-user-focus     : normal;
  16     }
  17
  18   .button-text {
  19     margin: 0px !important;
  20     text-align: center;
  21   }
  22
  23   button,
  24   button[disabled="true"][default],
  25   button[disabled="true"]:hover:active
  26     {
  27       border              : none;
  28     }
  29
  30   .button-box,
  31   button[disabled="true"][default] > .button-box,
  32   button[disabled="true"]:hover:active > .button-box
  33     {
  34       border              : 1px outset #CCD0DD;
  35       -moz-user-focus     : none;
  36     }
  37
  38   .button-box-2,
  39   button[disabled="true"][default] > .button-box > .button-box-2,
  40   button[disabled="true"]:hover:active > .button-box > .button-box-2
  41     {
  42                         border              : none;
  43     }
  44
  45   button:hover:active,
  46   button[open="true"],
  47   button[checked="true"]
  48     {
  49       border              : none;
  50     }
  51
  52   button:hover:active > .button-box,
  53   button[checked="true"] > .button-box,
  54   button[checked="true"]:focus > .button-box,
  55   button[open="true"] > .button-box,
  56   button[open="true"]:focus > .button-box
  57     {
  58       border              : 1px inset #CCD0DD;
  59     }
  60
  61   button:hover:active > .button-box > .button-box-2,
  62   button[checked="true"] > .button-box > .button-box-2,
  63   button[checked="true"]:focus> .button-box > .button-box-2,
  64   button[open="true"] > .button-box > .button-box-2,
  65   button[open="true"]:focus > .button-box > .button-box-2
  66     {
  67       border              : none;
  68     }
  69
  70   button:hover:active > .button-box > .button-box-2 > .button-box-text,
  71   button[open="true"] > .button-box > .button-box-2 > .button-box-text
  72     {
  73       padding             : 1px 2px 0px 3px;
  74     }
  75
  76   button[disabled="true"],
  77   button[disabled="true"]:hover:active
  78     {
  79       color               : #999999;
  80     }
  81
  82   button[disabled="true"] > .button-box > .button-box-2 > .button-box-text,
  83   button[disabled="true"]:hover:active > .button-box > .button-box-2 > .button-box-text
  84     {
  85       padding             : 0px 3px 1px 2px;
  86     }
  87
  88 /* text wrapping frame (hack because <text> does not support alignment) */
  89   .button-box-text,
  90   button[disabled]:focus > .button-box > .button-box-2 > .button-box-text
  91     {
  92       padding             : 0px 3px 1px 2px;
  93       border              : 1px solid transparent;
  94       margin              : 1px;
  95     }
  96
  97   button:focus > .button-box > .button-box-2 > .button-box-text
  98     {
  99       border              : 1px dotted #9999CC;
 100     }
 101
 102 /** Styles for "DEFAULT" buttons (usually 'OK' or equivalent in dialogs.
 103  *  To activate, set 'default' attribute on button.
 104  **/
 105
 106 /* outer frame */
 107   button[default], button:focus
 108     {
 109       border              : none;
 110     }
 111
 112   button[default] > .button-box > .button-box-2 > .button-box-text
 113     {
 114       font-weight         : bold;
 115       list-style-image    : url("chrome://global/skin/return.gif");
 116       -moz-box-direction  : reverse;
 117     }
 118
 119   button[default][disabled="true"] > .button-box > .button-box-2 > .button-box-text
 120     {
 121       font-weight         : bold;
 122       list-style-image    : url("chrome://global/skin/return-disabled.gif");
 123     }
 124
 125 /* ::::: menu-button buttons ::::: */
 126
 127 button[type="menu-button"] {
 128   margin: 0px !important;
 129   border: none !important;
 130 }
 131
 132 .menu-button-dropmarker {
 133   list-style-image: url("chrome://global/skin/scroll-down.gif");
 134 }
 135
 136 .menu-button-dropmarker[disabled="true"] {
 137   list-style-image: url("chrome://global/skin/scroll-down-disabled.gif");
 138 }
 139
 140 /* ::::: plain buttons ::::: */
 141
 142 button.plain,
 143 button.plain:hover,
 144 button.plain:hover:active,
 145 button.plain > .button-box,
 146 button.plain:hover > .button-box,
 147 button.plain:hover:active > .button-box {
 148   border: 0px ! important;
 149   margin: 0px;
 150   padding: 0px;
 151 }
 152