From 7f3c87b90b35de6caf61470435a41efc3a4b852a Mon Sep 17 00:00:00 2001 From: Robert Kaiser Date: Sun, 19 Jun 2011 02:05:51 +0200 Subject: [PATCH] make popup notifications and arrow panels work and look better --- EarlyBlue/global/button.css | 15 +++++++++++-- EarlyBlue/global/notification.css | 4 ++-- EarlyBlue/global/popup.css | 37 +++++++++++++++++-------------- LCARStrek/global/button.css | 33 +++++++++++++++++++++++---- LCARStrek/global/notification.css | 4 ++-- LCARStrek/global/popup.css | 36 +++++++++++++++++------------- 6 files changed, 86 insertions(+), 43 deletions(-) diff --git a/EarlyBlue/global/button.css b/EarlyBlue/global/button.css index c8972b6c..1178039e 100644 --- a/EarlyBlue/global/button.css +++ b/EarlyBlue/global/button.css @@ -125,11 +125,23 @@ button[disabled="true"] > .button-box { /* ::::: menu/menu-button buttons ::::: */ -button[type="menu-button"] { +.button-menubutton-button, +.button-menubutton-button:hover:active, +.button-menubutton-button[open="true"], +.button-menubutton-button[disabled="true"] { margin: 0px; + background-color: transparent; border: none; } +button[type="menu-button"]:hover:active > .button-menubutton-button > .button-box, +button[type="menu-button"][open="true"] > .button-menubutton-button > .button-box { + padding-top: 1px; + padding-bottom: 0px; + -moz-padding-start: 3px; + -moz-padding-end: 2px; +} + .button-menu-dropmarker, .button-menubutton-dropmarker { margin: 1px; @@ -146,7 +158,6 @@ button[type="menu-button"] { -moz-margin-end: 0; } - /* ::::: plain buttons ::::: */ button.plain { diff --git a/EarlyBlue/global/notification.css b/EarlyBlue/global/notification.css index 42f38eb9..351a6bb9 100644 --- a/EarlyBlue/global/notification.css +++ b/EarlyBlue/global/notification.css @@ -59,8 +59,8 @@ notification[type="critical"] .messageImage { } .popup-notification-closebutton { - -moz-margin-end: -14px; - margin-top: -10px; + -moz-margin-end: -5px; + margin-top: -5px; } .popup-notification-closeitem { diff --git a/EarlyBlue/global/popup.css b/EarlyBlue/global/popup.css index b3129357..d0c7bdc5 100644 --- a/EarlyBlue/global/popup.css +++ b/EarlyBlue/global/popup.css @@ -48,6 +48,8 @@ panel { } panel[type="arrow"] { + background: transparent; + border: none; -moz-transition: opacity 300ms; } @@ -64,42 +66,43 @@ panel[type="arrow"][side="right"] { } .panel-arrowcontent { - border-radius: 6px; + border: 1px outset #CCD0DD; + background-color: #CCD0DD; padding: 6px; margin: 3px; } .panel-arrow[side="top"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png"); - margin-left: 6px; - margin-right: 6px; - margin-bottom: -13px; - margin-top: -4px; + margin-left: 5px; + margin-right: 5px; + margin-bottom: -8px; + margin-top: -6px; } .panel-arrow[side="bottom"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png"); - margin-left: 6px; - margin-right: 6px; - margin-top: -12px; - margin-bottom: -4px; + margin-left: 5px; + margin-right: 5px; + margin-top: -8px; + margin-bottom: -6px; } .panel-arrow[side="left"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png"); - margin-top: 6px; - margin-bottom: 6px; - margin-right: -12px; - margin-left: -4px; + margin-top: 5px; + margin-bottom: 5px; + margin-right: -8px; + margin-left: -6px; } .panel-arrow[side="right"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png"); -moz-transform: scaleX(-1); - margin-top: 6px; - margin-bottom: 6px; - margin-left: -12px; - margin-right: -4px; + margin-top: 5px; + margin-bottom: 5px; + margin-left: -8px; + margin-right: -6px; } tooltip { diff --git a/LCARStrek/global/button.css b/LCARStrek/global/button.css index 34fc8ae7..f8cd97f1 100644 --- a/LCARStrek/global/button.css +++ b/LCARStrek/global/button.css @@ -147,17 +147,42 @@ button[disabled="true"] > .button-box { /* ::::: menu/menu-button buttons ::::: */ -button[type="menu-button"] { +.button-menubutton-button, +.button-menubutton-button:hover, +.button-menubutton-button:hover:active, +.button-menubutton-button[open="true"], +.button-menubutton-button[disabled="true"] { margin: 0px; - border: none; + background-color: transparent; +} + +button[type="menu-button"]:hover:active > .button-menubutton-button > .button-box, +button[type="menu-button"][open="true"] > .button-menubutton-button > .button-box { + padding-top: 2px; + padding-bottom: 1px; + -moz-padding-start: 4px; + -moz-padding-end: 3px; +} + +button[type="menu-button"]:hover > .button-menubutton-button, +button[type="menu-button"]:hover:active > .button-menubutton-button, +button[type="menu-button"][open="true"] > .button-menubutton-button { + color: #000000; } .button-menu-dropmarker, .button-menubutton-dropmarker { - border-radius: 3px; - margin: 1px; + margin: 2px; width: 11px; height: 11px; + background-color: transparent; + border: none; +} + +button[type="menu-button"]:hover > .button-menubutton-dropmarker, +button[type="menu-button"]:hover:active > .button-menubutton-dropmarker, +button[type="menu-button"][open="true"] > .button-menubutton-dropmarker { + list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif"); } /* ::::: plain buttons ::::: */ diff --git a/LCARStrek/global/notification.css b/LCARStrek/global/notification.css index 601b23d2..74d8fef9 100644 --- a/LCARStrek/global/notification.css +++ b/LCARStrek/global/notification.css @@ -66,8 +66,8 @@ notification[type="critical"] .messageImage { } .popup-notification-closebutton { - -moz-margin-end: -14px; - margin-top: -10px; + -moz-margin-end: -5px; + margin-top: -5px; } .popup-notification-closeitem { diff --git a/LCARStrek/global/popup.css b/LCARStrek/global/popup.css index d4b60d1d..83ca10db 100644 --- a/LCARStrek/global/popup.css +++ b/LCARStrek/global/popup.css @@ -52,6 +52,8 @@ panel { } panel[type="arrow"] { + background: transparent; + border: none; -moz-transition: opacity 300ms; } @@ -68,6 +70,8 @@ panel[type="arrow"][side="right"] { } .panel-arrowcontent { + border: 1px solid #FF9F00; + background-color: #000000; border-radius: 6px; padding: 6px; margin: 3px; @@ -75,35 +79,35 @@ panel[type="arrow"][side="right"] { .panel-arrow[side="top"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png"); - margin-left: 6px; - margin-right: 6px; - margin-bottom: -13px; - margin-top: -4px; + margin-left: 5px; + margin-right: 5px; + margin-bottom: -8px; + margin-top: -6px; } .panel-arrow[side="bottom"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png"); - margin-left: 6px; - margin-right: 6px; - margin-top: -12px; - margin-bottom: -4px; + margin-left: 5px; + margin-right: 5px; + margin-top: -8px; + margin-bottom: -6px; } .panel-arrow[side="left"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png"); - margin-top: 6px; - margin-bottom: 6px; - margin-right: -12px; - margin-left: -4px; + margin-top: 5px; + margin-bottom: 5px; + margin-right: -8px; + margin-left: -6px; } .panel-arrow[side="right"] { list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png"); -moz-transform: scaleX(-1); - margin-top: 6px; - margin-bottom: 6px; - margin-left: -12px; - margin-right: -4px; + margin-top: 5px; + margin-bottom: 5px; + margin-left: -8px; + margin-right: -6px; } tooltip { -- 2.35.3