EarlyBlue/global/popup.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 /* ===== popup.css ======================================================
   6   == Styles used by the XUL popup element.
   7   ======================================================================= */
   8
   9 @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  10
  11 /* ::::: menupopup ::::: */
  12
  13 menupopup,
  14 panel {
  15   border: 1px outset #CCD0DD;
  16   padding: 1px;
  17   min-width: 1px;
  18   background-color: #CCD0DD;
  19 }
  20
  21 menupopup > menu > menupopup {
  22   /* align submenus */
  23   margin-top: -1px;
  24 }
  25
  26 /* ::::: arrow panel ::::: */
  27
  28 panel[type="arrow"] {
  29   background: transparent;
  30   border: none;
  31   padding: 0;
  32   transition: opacity 300ms;
  33 }
  34
  35 .panel-arrowcontainer[panelopen] {
  36   transition-duration: 200ms, 150ms;
  37   transition-property: opacity, transform;
  38   transition-timing-function: ease-out;
  39 }
  40
  41 .panel-arrowcontainer:not([panelopen]) {
  42   /* Does not work correctly in Linux right now. - 2012-09-30
  43    * Actually, only breaks uncommon Window Managers, but arrowpanels disappear completely. 2013-07-21
  44   opacity: 0; */
  45 }
  46
  47 .panel-arrowcontainer:not([panelopen])[side="top"] {
  48   transform: translateY(-20px);
  49 }
  50
  51 .panel-arrowcontainer:not([panelopen])[side="bottom"] {
  52   transform: translateY(20px);
  53 }
  54
  55 .panel-arrowcontainer:not([panelopen])[side="left"] {
  56   transform: translateX(-20px);
  57 }
  58
  59 .panel-arrowcontainer:not([panelopen])[side="right"] {
  60   transform: translateX(20px);
  61 }
  62
  63 panel[type="arrow"][side="top"],
  64 panel[type="arrow"][side="bottom"] {
  65   margin-left: -20px;
  66   margin-right: -20px;
  67 }
  68
  69 panel[type="arrow"][side="left"],
  70 panel[type="arrow"][side="right"] {
  71   margin-top: -20px;
  72   margin-bottom: -20px;
  73 }
  74
  75 .panel-arrowcontent {
  76   padding: 6px;
  77   background-color: #CCD0DD;
  78   background-clip: padding-box;
  79   border: 1px outset #CCD0DD;
  80   margin: 0px;
  81 }
  82
  83 .panel-arrow[side="top"],
  84 .panel-arrow[side="bottom"] {
  85   list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
  86   position: relative;
  87   margin-left: 10px;
  88   margin-right: 10px;
  89 }
  90
  91 .panel-arrow[side="top"] {
  92   margin-bottom: -1px;
  93 }
  94
  95 .panel-arrow[side="bottom"] {
  96   transform: scaleY(-1);
  97   margin-top: -1px;
  98 }
  99
 100 .panel-arrow[side="left"],
 101 .panel-arrow[side="right"] {
 102   list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
 103   position: relative;
 104   margin-top: 10px;
 105   margin-bottom: 10px;
 106 }
 107
 108 .panel-arrow[side="left"] {
 109   margin-right: -1px;
 110 }
 111
 112 .panel-arrow[side="right"] {
 113   transform: scaleX(-1);
 114   margin-left: -1px;
 115 }
 116
 117 /* ::::: tooltip ::::: */
 118
 119 tooltip {
 120   background-color : #FFFFCC;
 121   border : 1px outset #FFFFCC;
 122   color: #000000;
 123   /* font-size: smaller; */
 124   padding: 2px;
 125   max-width: 40em;
 126 }
 127
 128 tooltip[titletip="true"] {
 129   /* See bug 32157 comment 128
 130    * margin: -2px 0px 0px -3px;
 131    */
 132   max-width: none;
 133 }
 134
 135 /* rules for popups associated with menulists */
 136
 137 menulist > menupopup,
 138 .menulist-menupopup {
 139   border: 1px solid #666699;
 140   min-width: 0px;
 141   padding: 0px;
 142   background-color: white;
 143 }
 144
 145 menupopup > menu > menupopup {
 146   margin-top: -2px;
 147 }