LCARStrek/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 window {
   6   padding: 0;
   7 }
   8
   9 /* Reload and waiting notices */
  10
  11 .notice-container {
  12   margin-top: -50vh;
  13   color: var(--theme-body-color);
  14 }
  15
  16 #reload-notice {
  17   font-size: 120%;
  18 }
  19
  20 #waiting-notice {
  21   font-size: 110%;
  22 }
  23
  24 /* Shaders pane */
  25
  26 #shaders-pane {
  27   min-width: 150px;
  28 }
  29
  30 .program-item {
  31   padding: 2px 0px;
  32 }
  33
  34 .side-menu-widget-item-checkbox {
  35   -moz-appearance: none;
  36   opacity: 0;
  37   transition: opacity .15s ease-out 0s;
  38 }
  39
  40 /* Only show the checkbox when the source is hovered over, is selected, or if it
  41  * is not checked. */
  42 .side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
  43 .side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
  44 .side-menu-widget-item-checkbox:not([checked]) {
  45   opacity: 1;
  46   transition: opacity .15s ease-out 0s;
  47 }
  48
  49 .side-menu-widget-item-checkbox .checkbox-check {
  50   background-image: url("images/itemToggle.png");
  51   background-color: transparent;
  52   background-repeat: no-repeat;
  53   background-clip: content-box;
  54   background-size: 32px 16px;
  55   background-position: -16px 0;
  56   width: 16px;
  57   height: 16px;
  58   border: 0;
  59 }
  60
  61 @media (min-resolution: 1.1dppx) {
  62   .side-menu-widget-item-checkbox .checkbox-check {
  63     background-image: url("images/itemToggle@2x.png");
  64   }
  65 }
  66
  67 .side-menu-widget-item-checkbox[checked] .checkbox-check {
  68   background-position: 0 0;
  69 }
  70
  71 /* Shader source editors */
  72
  73 #editors-splitter {
  74   border-color: var(--theme-contrastsidebar-bordercolor);
  75 }
  76
  77 .editor-label {
  78   padding: 1px 12px;
  79   border-top: 1px solid;
  80 }
  81
  82 .editor-label {
  83   background: var(--theme-contrastsidebar-background);
  84   color: var(--theme-contrastsidebar-color);
  85 }
  86
  87 .editor-label[selected] {
  88   background-color: var(--theme-selection-background);
  89   color: var(--theme-selection-color);
  90 }
  91
  92 /* Responsive sidebar */
  93
  94 @media (max-width: 700px) {
  95   #shaders-pane {
  96     max-height: 60vh;
  97   }
  98
  99   .side-menu-widget-container {
 100     box-shadow: none !important;
 101   }
 102
 103   .side-menu-widget-item-arrow {
 104     background-image: none !important;
 105   }
 106
 107   .editor-label {
 108     -moz-box-ordinal-group: 0;
 109   }
 110 }