LCARStrek/chatzilla/chatzilla.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 @import url("chrome://communicator/skin/");
   6
   7 window {
   8   width: 640px;
   9   height: 480px;
  10 }
  11
  12 #menu-view-none {
  13   display: none;
  14 }
  15
  16 #header-url:hover {
  17   text-decoration: underline;
  18 }
  19
  20 #outer-box {
  21   margin: 5px;
  22 }
  23
  24 .toolbarbutton-menu-dropmarker {
  25   margin-left: 0.5em;
  26 }
  27
  28 #input-widget,
  29 #input-widget-multiline {
  30   border-radius: 5px;
  31   border: 1px solid #9C9CFF;
  32 }
  33
  34 #button-multiline-expand {
  35   list-style-image:url("chrome://chatzilla/skin/images/multiline-expand.png");
  36 }
  37
  38 #button-multiline-contract {
  39   list-style-image:url("chrome://chatzilla/skin/images/multiline-contract.png");
  40 }
  41
  42 #button-input {
  43   list-style-image:url("chrome://chatzilla/skin/images/input-send.png");
  44 }
  45
  46 .highlight-menu-item:hover {
  47   color: #000000 !important;
  48   background: #008484 !important;
  49 }
  50
  51 #user-list {
  52   margin: 0;
  53 }
  54
  55 #view-tabs {
  56   overflow: hidden;
  57 }
  58
  59 #views-tbar-spacer {
  60   -moz-box-flex: 10000;
  61 }
  62
  63 #tabs-drop-indicator-bar {
  64   position: relative;
  65   margin-top: -3px;
  66   -moz-margin-start: -5px;
  67   height: 3px;
  68 }
  69
  70 #tabs-drop-indicator {
  71   position: relative;
  72   margin-bottom: -8px;
  73   width: 11px;
  74   height: 11px;
  75   background: url("chrome://chatzilla/skin/images/drop-indicator-bottom.png") 50% 50% no-repeat;
  76 }
  77
  78 .view-button {
  79   /* Box model is 5px 5px 5px 6px in aggregate. Extra pixel on the left is for the separator. */
  80   -moz-appearance: none;
  81   margin: 5px 0 0;
  82 /*  border: none;
  83   border-left: 1px solid ButtonShadow;*/
  84   padding: 0 5px;
  85 /*
  86   background: Button;
  87   color: ButtonText;
  88   font: message-box;
  89 */
  90   text-shadow: none;
  91   text-align: center;
  92   max-width: 30ex;
  93   -moz-box-flex: 1;
  94   -moz-box-orient: vertical;
  95   -moz-box-align: stretch;
  96 }
  97
  98 .view-button:first-child {
  99   border-left-color: transparent;
 100 }
 101
 102 .view-button::before {
 103   content: " ";
 104   display: -moz-box;
 105   margin: -5px -5px 0 -5px;
 106   height: 4px;
 107 }
 108
 109 .view-button[state="superfluous"]::before {
 110   background-color: #E7ADE7;
 111 }
 112
 113 .view-button[state="activity"]::before {
 114   background-color: #FFCF00;
 115 }
 116
 117 .view-button[state="attention"]::before {
 118   background-color: red;
 119 }
 120
 121 .view-button:hover,
 122 .view-button[state="current"] {
 123   margin: 0 0 0;
 124 /*  border-left: none;
 125   border-radius: 0 0 6px 6px;*/
 126   padding: 5px 5px 0;
 127 /*
 128   background: Window;
 129   color: WindowText;
 130 */
 131 }
 132
 133 .view-button[state="current"] + .view-button,
 134 .view-button:hover + .view-button:not([state="current"]) {
 135 /*  border-left-color: transparent;*/
 136 }
 137
 138 .view-button[state="current"] {
 139   position: relative; /* So it visually appears above the tabs either side. */
 140 /*  border: 2px solid ButtonShadow;*/
 141   border-top: none;
 142   padding: 5px 5px 3px 5px;
 143 }
 144
 145 treecol {
 146   border: none;
 147 }
 148
 149 /* we need to define both the : and :: versions of the treechildren selector
 150  *  so that we work on both 1.5 and pre 1.5 builds.
 151  *
 152  * The userlist can be in one of two state.  In "symbol", the user's
 153  * channel mode is shown as a @ or + image, while in "graphic" mode, the
 154  * image is one of the LED images.
 155  */
 156
 157 /* no mode */
 158 treechildren::-moz-tree-image {
 159   list-style-image: url("chrome://chatzilla/skin/images/no-symbol.png");
 160 }
 161
 162 #user-list[mode="graphic"] treechildren::-moz-tree-image {
 163   list-style-image: url("chrome://chatzilla/skin/images/no-graphic.png");
 164 }
 165
 166 /* voice */
 167 treechildren::-moz-tree-image(voice-true) {
 168   list-style-image: url("chrome://chatzilla/skin/images/voice-symbol.png");
 169 }
 170
 171 #user-list[mode="graphic"] treechildren::-moz-tree-image(voice-true) {
 172   list-style-image: url("chrome://chatzilla/skin/images/voice-graphic.png");
 173 }
 174
 175 /* half-chanop */
 176 treechildren::-moz-tree-image(halfop-true) {
 177   list-style-image: url("chrome://chatzilla/skin/images/halfop-symbol.png");
 178 }
 179
 180 #user-list[mode="graphic"] treechildren::-moz-tree-image(halfop-true) {
 181   list-style-image: url("chrome://chatzilla/skin/images/halfop-graphic.png");
 182 }
 183
 184 /* chanop */
 185 treechildren::-moz-tree-image(op-true) {
 186   list-style-image: url("chrome://chatzilla/skin/images/op-symbol.png");
 187 }
 188
 189 #user-list[mode="graphic"] treechildren::-moz-tree-image(op-true) {
 190   list-style-image: url("chrome://chatzilla/skin/images/op-graphic.png");
 191 }
 192
 193 /* admin */
 194 treechildren::-moz-tree-image(admin-true) {
 195   list-style-image: url("chrome://chatzilla/skin/images/admin-symbol.png");
 196 }
 197
 198 #user-list[mode="graphic"] treechildren::-moz-tree-image(admin-true) {
 199   list-style-image: url("chrome://chatzilla/skin/images/admin-graphic.png");
 200 }
 201
 202 /* founder */
 203 treechildren::-moz-tree-image(founder-true) {
 204   list-style-image: url("chrome://chatzilla/skin/images/founder-symbol.png");
 205 }
 206
 207 #user-list[mode="graphic"] treechildren::-moz-tree-image(founder-true) {
 208   list-style-image: url("chrome://chatzilla/skin/images/founder-graphic.png");
 209 }
 210
 211 /* away */
 212 treechildren::-moz-tree-cell-text(away-true) {
 213   color: #8050B0;
 214   font-style: italic;
 215 }
 216
 217 treechildren::-moz-tree-cell-text(away-false) {
 218 }
 219
 220 menuitem[header="true"] {
 221   text-align: center;
 222 }
 223
 224 .colorGrid
 225 {
 226   width: 24px;
 227   height: 16px;
 228   border: 1px solid #9C9CFF;
 229   -moz-box-align: center;
 230   -moz-box-pack: center;
 231 }
 232
 233 #colorTooltip
 234 {
 235   padding: 0px;
 236   -moz-box-align: center;
 237   -moz-box-pack: center;
 238 }
 239
 240 /* Feel the hacks. */
 241 progressmeter[mode="undetermined"] {
 242   -moz-appearance: none;
 243 }
 244
 245 [dir="ltr"] {
 246   direction: ltr;
 247 }
 248
 249 [dir="rtl"] {
 250   direction: rtl;
 251 }
 252
 253 #input-splitter {
 254   margin: 4px 0 0 0;
 255 }
 256
 257 #input-widgets {
 258   margin: 4px 0;
 259 }
 260
 261 #server-nick, #button-multiline-expand, #button-input, #button-multiline-contract {
 262   margin: 0;
 263 }
 264
 265 #input, #multiline-input {
 266   margin: 0 4px;
 267 }
 268
 269 /* Hack; Stop the status-bar from distorting without a security icon */
 270 #status-text {
 271   min-height: 17px;
 272 }
 273
 274 #status-text[notice="true"] {
 275   font-weight: bold;
 276 }
 277
 278 #security-button {
 279   min-width: 20px;
 280 }
 281
 282 #security-button:not([level="high"]):not([level="broken"]) {
 283   display: none;
 284 }
 285
 286 #security-button[level="high"] > image {
 287   list-style-image: url("chrome://communicator/skin/icons/lock-secure.gif");
 288 }
 289
 290 #security-button[level="broken"] > image {
 291   list-style-image: url("chrome://communicator/skin/icons/lock-broken.gif");
 292 }
 293
 294 /* prevent margins of a value-less label from shifting the image */
 295 #security-button > label:not([value]) {
 296   display: none;
 297 }
 298
 299 #alert-status[alertstate="off"] {
 300     list-style-image: url("chrome://chatzilla/skin/images/spbubble-off.png");
 301 }
 302
 303 #alert-status[alertstate="on"] {
 304     list-style-image: url("chrome://chatzilla/skin/images/spbubble-on.png");
 305 }
 306
 307 #logging-status[loggingstate="off"] {
 308     list-style-image: url("chrome://chatzilla/skin/images/logging-off.png");
 309 }
 310
 311 #logging-status[loggingstate="on"] {
 312     list-style-image: url("chrome://chatzilla/skin/images/logging-on.png");
 313 }
 314
 315 #offline-status[offlinestate="offline"] {
 316   list-style-image: url("chrome://communicator/skin/icons/offline.gif");
 317 }
 318
 319 #offline-status[offlinestate="online"] {
 320   list-style-image: url("chrome://communicator/skin/icons/online.gif");
 321 }
 322
 323 /* Focus styling for a11y reasons */
 324 #user-list-box[focusobvious="true"], #browser-box[focusobvious="true"],
 325 #multiline-hug-box[focusobvious="true"], #singleline-hug-box[focusobvious="true"] {
 326   outline: 2px solid #008484;
 327 }