-/* NEW WIDGET ANDING: <button> */\r
-\r
-/** Default Button Styles (apply to usage of <button> without \r
- * any applied class).\r
- **/\r
-\r
-/* outer frame */\r
- button \r
- {\r
- border : none;\r
- margin : 1px 5px 2px 5px;\r
- background-color : #CCD0DD;\r
- }\r
- \r
- button[disabled="true"],\r
- button[disabled="true"]:hover,\r
- button[disabled="true"]:hover:active \r
- {\r
- border : none;\r
- color : #999999;\r
- }\r
- \r
-/* internal frame */\r
- button > .button-internal-box \r
- {\r
- vertical-align : middle;\r
- text-align : center;\r
- border : 1px outset #CCD0DD;\r
- padding : 1px;\r
- }\r
- \r
- button:hover:active > .button-internal-box \r
- {\r
- border : 1px inset #CCD0DD;\r
- padding : 2px 0px 0px 2px;\r
- }\r
- \r
- button[disabled="true"] > .button-internal-box,\r
- button[disabled="true"]:hover > .button-internal-box,\r
- button[disabled="true"]:hover:active > .button-internal-box \r
- {\r
- border : 1px outset #CCD0DD;\r
- padding : 1px;\r
- }\r
-\r
-/* text wrapping frame (hack because <text> does not support alignment) */\r
- .button-text-container\r
- {\r
- text-align : center;\r
- vertical-align : middle;\r
- }\r
-\r
-/* text frame */\r
- .button-text \r
- {\r
- padding : 1px 2px 1px 2px;\r
- }\r
- \r
- button[orient="vertical"] > .button-internal-box > .button-text-container > .button-text\r
- {\r
- padding : 2px 2px 1px 2px;\r
- }\r
- \r
-/** Styles for "DEFAULT" buttons (usually 'OK' or equivalent in dialogs. \r
- * To activate, set 'default' attribute on button.\r
- **/\r
- \r
-/* outer frame */ \r
- button[default] \r
- {\r
- /* XXX this is a HACK until 'orient' is supported in CSS! XXX */\r
- /* strictly speaking not necessary because default for buttonright is \r
- * to lay image out horizontally, but leaving here as a reminder to\r
- * implement this feature */\r
- -moz-binding : url(chrome://global/content/xulBindings.xml#buttonright);\r
- font-weight : bold;\r
- list-style-image : url("chrome://global/skin/return.gif");\r
- }\r
- \r
- button[default][disabled="true"]\r
- {\r
- list-style-image : url("chrome://global/skin/return-disabled.gif");\r
- }\r
- \r
-/** Styles for 'dialog' buttons (usually any command button in a dialog)\r
- * This class gives buttons 10px of padding on each side to increase the\r
- * strike area and make buttons with small amounts of text (e.g. 'OK') \r
- * look less silly.\r
- **/\r
-\r
-/* internal frame */\r
- .button-dialog > .button-internal-box,\r
- .button-dialog:hover > .button-internal-box\r
- {\r
- padding : 2px 10px 2px 10px;\r
- }\r
- \r
- .button-dialog:hover:hover:active > .button-internal-box \r
- {\r
- padding : 3px 9px 1px 11px;\r
- }\r
-\r
-/** Styles for grey toolbar buttons. These buttons are used in places like\r
- * editor's formatting toolbar or toolbars wanting a button similar to a command\r
- * button but without an initial outset frame.\r
- **/ \r
- .button-borderless \r
- {\r
- border : 1px solid #CCD0DD;\r
- }\r
- \r
- .button-borderless:hover\r
- {\r
- border : 1px solid #000000;\r
- }\r
- \r
- .button-borderless > .button-internal-box \r
- {\r
- border : 1px solid #CCD0DD;\r
- }\r
- \r
- .button-borderless:hover > .button-internal-box \r
- {\r
- border : 1px outset #CCD0DD;\r
- }\r
- \r
- .button-borderless:hover:active > .button-internal-box \r
- {\r
- border : 1px inset #CCD0DD;\r
- }\r
-\r
-/** plain (raw) buttons, class="plain" **/\r
-\r
- button.plain, button.plain:hover, button.plain:hover:active,\r
- button.plain > .button-internal-box, \r
- button.plain:hover:active > .button-internal-box,\r
- button.plain > .button-internal-box:hover:active,\r
- button.plain > .button-internal-box > .button-text-container, \r
- button.plain > .button-internal-box > .button-text-container:hover:active,\r
- button.plain > .button-internal-box > .button-text-container > .button-text, \r
- button.plain > .button-internal-box > .button-text-container > .button.text:hover:active,\r
- button-plain > .button-internal-box > .button-icon, \r
- button.plain > .button-internal-box > .button.icon:hover:active\r
- {\r
- border : 0px;\r
- margin : 0px;\r
- padding : 0px;\r
- }\r
-\r
-\r
-/** \r
- * utility class for buttons with associated popup\r
- **/\r
-.button-popup \r
- {\r
- list-style-image : url(chrome://global/skin/taskbar-popup-arrow.gif);\r
- }\r
- \r
- \r
-
\ No newline at end of file
+/* NEW WIDGET ANDING: <button> */
+
+/** Default Button Styles (apply to usage of <button> without
+ * any applied class).
+ **/
+
+/* outer frame */
+ button
+ {
+ border : none;
+ margin : 1px 5px 2px 5px;
+ background-color : #CCD0DD;
+ }
+
+ button[disabled="true"],
+ button[disabled="true"]:hover,
+ button[disabled="true"]:hover:active
+ {
+ border : none;
+ color : #999999;
+ }
+
+/* internal frame */
+ button > .button-internal-box
+ {
+ vertical-align : middle;
+ text-align : center;
+ border : 1px outset #CCD0DD;
+ padding : 1px;
+ }
+
+ button:hover:active > .button-internal-box
+ {
+ border : 1px inset #CCD0DD;
+ padding : 2px 0px 0px 2px;
+ }
+
+ button[disabled="true"] > .button-internal-box,
+ button[disabled="true"]:hover > .button-internal-box,
+ button[disabled="true"]:hover:active > .button-internal-box
+ {
+ border : 1px outset #CCD0DD;
+ padding : 1px;
+ }
+
+/* text wrapping frame (hack because <text> does not support alignment) */
+ .button-text-container
+ {
+ text-align : center;
+ vertical-align : middle;
+ }
+
+/* text frame */
+ .button-text
+ {
+ padding : 1px 2px 1px 2px;
+ }
+
+ button[orient="vertical"] > .button-internal-box > .button-text-container > .button-text
+ {
+ padding : 2px 2px 1px 2px;
+ }
+
+/** Styles for "DEFAULT" buttons (usually 'OK' or equivalent in dialogs.
+ * To activate, set 'default' attribute on button.
+ **/
+
+/* outer frame */
+ button[default]
+ {
+ /* XXX this is a HACK until 'orient' is supported in CSS! XXX */
+ /* strictly speaking not necessary because default for buttonright is
+ * to lay image out horizontally, but leaving here as a reminder to
+ * implement this feature */
+ -moz-binding : url(chrome://global/content/xulBindings.xml#buttonright);
+ font-weight : bold;
+ list-style-image : url("chrome://global/skin/return.gif");
+ }
+
+ button[default][disabled="true"]
+ {
+ list-style-image : url("chrome://global/skin/return-disabled.gif");
+ }
+
+/** Styles for 'dialog' buttons (usually any command button in a dialog)
+ * This class gives buttons 10px of padding on each side to increase the
+ * strike area and make buttons with small amounts of text (e.g. 'OK')
+ * look less silly.
+ **/
+
+/* internal frame */
+ .button-dialog > .button-internal-box,
+ .button-dialog:hover > .button-internal-box
+ {
+ padding : 2px 10px 2px 10px;
+ }
+
+ .button-dialog:hover:hover:active > .button-internal-box
+ {
+ padding : 3px 9px 1px 11px;
+ }
+
+/** Styles for grey toolbar buttons. These buttons are used in places like
+ * editor's formatting toolbar or toolbars wanting a button similar to a command
+ * button but without an initial outset frame.
+ **/
+ .button-borderless
+ {
+ border : 1px solid #CCD0DD;
+ }
+
+ .button-borderless:hover
+ {
+ border : 1px solid #000000;
+ }
+
+ .button-borderless > .button-internal-box
+ {
+ border : 1px solid #CCD0DD;
+ }
+
+ .button-borderless:hover > .button-internal-box
+ {
+ border : 1px outset #CCD0DD;
+ }
+
+ .button-borderless:hover:active > .button-internal-box
+ {
+ border : 1px inset #CCD0DD;
+ }
+
+/** plain (raw) buttons, class="plain" **/
+
+ button.plain, button.plain:hover, button.plain:hover:active,
+ button.plain > .button-internal-box,
+ button.plain:hover:active > .button-internal-box,
+ button.plain > .button-internal-box:hover:active,
+ button.plain > .button-internal-box > .button-text-container,
+ button.plain > .button-internal-box > .button-text-container:hover:active,
+ button.plain > .button-internal-box > .button-text-container > .button-text,
+ button.plain > .button-internal-box > .button-text-container > .button.text:hover:active,
+ button.plain > .button-internal-box > .button-icon,
+ button.plain > .button-internal-box > .button.icon:hover:active
+ {
+ border : 0px;
+ margin : 0px;
+ padding : 0px;
+ }
+
+
+/**
+ * utility class for buttons with associated popup
+ **/
+.button-popup
+ {
+ list-style-image : url(chrome://global/skin/taskbar-popup-arrow.gif);
+ }
+
+
+
projects / themes.git / blobdiff