X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=EarlyBlue%2Fglobal%2Fpopup.css;h=bc00318bf6dcf2d829a89f9d39f7efaec02c543e;hp=866d93753ea2c9eeccafcdb5a2f9fc45714dc484;hb=eb209bcc1ebfe09d3b13e471701d727b4494091e;hpb=9099c61da39b1346a25b1c01463829a44d72d6e1 diff --git a/EarlyBlue/global/popup.css b/EarlyBlue/global/popup.css index 866d9375..bc00318b 100644 --- a/EarlyBlue/global/popup.css +++ b/EarlyBlue/global/popup.css @@ -17,61 +17,93 @@ panel { panel[type="arrow"] { background: transparent; border: none; - -moz-transition: opacity 300ms; + transition: opacity 300ms; +} + +.panel-arrowcontainer[panelopen] { + transition-duration: 200ms, 150ms; + transition-property: opacity, transform; + transition-timing-function: ease-out; +} + +.panel-arrowcontainer:not([panelopen]) { + /* Does not work correctly in Linux right now. - 2012-09-30 + opacity: 0; */ + opacity: 0.01; +} + +.panel-arrowcontainer:not([panelopen])[side="top"] { + transform: translateY(-20px); +} + +.panel-arrowcontainer:not([panelopen])[side="bottom"] { + transform: translateY(20px); +} + +.panel-arrowcontainer:not([panelopen])[side="left"] { + transform: translateX(-20px); +} + +.panel-arrowcontainer:not([panelopen])[side="right"] { + transform: translateX(20px); } panel[type="arrow"][side="top"], panel[type="arrow"][side="bottom"] { - margin-left: -25px; - margin-right: -25px; + margin-left: -20px; + margin-right: -20px; } panel[type="arrow"][side="left"], panel[type="arrow"][side="right"] { - margin-top: -25px; - margin-bottom: -25px; + margin-top: -20px; + margin-bottom: -20px; } .panel-arrowcontent { - border: 1px outset #CCD0DD; - background-color: #CCD0DD; padding: 6px; + background-color: #CCD0DD; + background-clip: padding-box; + border: 1px outset #CCD0DD; margin: 3px; } +.panel-arrow[side="top"], +.panel-arrow[side="bottom"] { + list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg"); + position: relative; + margin-left: 10px; + margin-right: 10px; +} + .panel-arrow[side="top"] { - list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png"); - margin-left: 5px; - margin-right: 5px; - margin-bottom: -8px; - margin-top: -6px; + margin-bottom: -5px; } .panel-arrow[side="bottom"] { - list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png"); - margin-left: 5px; - margin-right: 5px; - margin-top: -8px; - margin-bottom: -6px; + transform: scaleY(-1); + margin-top: -5px; +} + +.panel-arrow[side="left"], +.panel-arrow[side="right"] { + list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg"); + position: relative; + margin-top: 10px; + margin-bottom: 10px; } .panel-arrow[side="left"] { - list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png"); - margin-top: 5px; - margin-bottom: 5px; - margin-right: -8px; - margin-left: -6px; + margin-right: -5px; } .panel-arrow[side="right"] { - list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png"); - -moz-transform: scaleX(-1); - margin-top: 5px; - margin-bottom: 5px; - margin-left: -8px; - margin-right: -6px; + transform: scaleX(-1); + margin-left: -5px; } +/* ::::: tooltip ::::: */ + tooltip { background-color : #FFFFCC; border : 1px outset #FFFFCC;