LCARStrek/browser/devtools/shadereditor.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 file,
   3  * You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 /* === file identical to shadereditor.inc.css === */
   6
   7 window {
   8   padding: 0;
   9 }
  10
  11 #body {
  12   background-color: #000000;
  13 }
  14
  15 #content {
  16   background-color: #000000;
  17 }
  18
  19 /* Reload and waiting notices */
  20
  21 .notice-container {
  22   background-color: #000000;
  23   margin-top: -50vh;
  24   color: #FF9F00;
  25 }
  26
  27 #reload-notice {
  28   font-size: 120%;
  29 }
  30
  31 #waiting-notice {
  32   font-size: 110%;
  33 }
  34
  35 #waiting-notice::before {
  36   display: inline-block;
  37   content: "";
  38   background: url("chrome://global/skin/icons/loading_16.png") center no-repeat;
  39   width: 16px;
  40   height: 16px;
  41   -moz-margin-end: 6px;
  42 }
  43
  44 #requests-menu-reload-notice-button {
  45   min-height: 2em;
  46 }
  47
  48 /* Shaders pane */
  49
  50 #shaders-pane {
  51   min-width: 150px;
  52 }
  53
  54 #shaders-pane + .devtools-side-splitter {
  55   border-color: transparent;
  56 }
  57
  58 .side-menu-widget-item-checkbox {
  59   -moz-appearance: none;
  60   opacity: 0;
  61   transition: opacity .15s ease-out 0s;
  62 }
  63
  64 /* Only show the checkbox when the source is hovered over, is selected, or if it
  65  * is not checked. */
  66 .side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
  67 .side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
  68 .side-menu-widget-item-checkbox:not([checked]) {
  69   opacity: 1;
  70   transition: opacity .15s ease-out 0s;
  71 }
  72
  73 .side-menu-widget-item-checkbox .checkbox-check {
  74   -moz-appearance: none;
  75   background: none;
  76   background-image: url("itemToggle.png");
  77   background-repeat: no-repeat;
  78   background-clip: content-box;
  79   background-size: 32px 16px;
  80   background-position: -16px 0;
  81   width: 16px;
  82   height: 16px;
  83   border: 0;
  84 }
  85
  86 .side-menu-widget-item-checkbox[checked] .checkbox-check {
  87   background-position: 0 0;
  88 }
  89
  90 .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents {
  91   color: #8050B0;
  92 }
  93
  94 /* Shader source editors */
  95
  96 #editors-splitter {
  97   border-color: #000000;
  98 }
  99
 100 .editor-label {
 101   background-color: #A09090;
 102   padding: 1px 12px;
 103   color: #000000;
 104 }
 105
 106 .editor-label[selected] {
 107   background-color: #008484;
 108   color: #FFCF00;
 109 }
 110
 111 /* Responsive sidebar */
 112
 113 @media (max-width: 700px) {
 114   #shaders-pane {
 115     max-height: 60vh;
 116   }
 117
 118   .side-menu-widget-container {
 119     box-shadow: none !important;
 120   }
 121
 122   .side-menu-widget-item-arrow {
 123     background-image: none !important;
 124   }
 125
 126   .devtools-side-splitter {
 127     border-top-color: transparent !important;
 128   }
 129
 130   .editor-label {
 131     -moz-box-ordinal-group: 0;
 132   }
 133
 134   .editor-label:not([selected]) {
 135   }
 136 }