browser/themes/shared/devtools/shadereditor.inc.css

changeset 0
6474c204b198
     1.1 --- /dev/null	Thu Jan 01 00:00:00 1970 +0000
     1.2 +++ b/browser/themes/shared/devtools/shadereditor.inc.css	Wed Dec 31 06:09:35 2014 +0100
     1.3 @@ -0,0 +1,139 @@
     1.4 +/* This Source Code Form is subject to the terms of the Mozilla Public
     1.5 + * License, v. 2.0. If a copy of the MPL was not distributed with this file,
     1.6 + * You can obtain one at http://mozilla.org/MPL/2.0/. */
     1.7 +
     1.8 +/* Reload and waiting notices */
     1.9 +
    1.10 +.notice-container {
    1.11 +  margin-top: -50vh;
    1.12 +}
    1.13 +
    1.14 +.theme-dark .notice-container {
    1.15 +  background: url(background-noise-toolbar.png), #343c45; /* Toolbars */
    1.16 +  color: #f5f7fa; /* Light foreground text */
    1.17 +}
    1.18 +
    1.19 +.theme-light .notice-container {
    1.20 +  background: url(background-noise-toolbar.png), #f0f1f2; /* Toolbars */
    1.21 +  color: #585959; /* Grey foreground text */
    1.22 +}
    1.23 +
    1.24 +#reload-notice {
    1.25 +  font-size: 120%;
    1.26 +}
    1.27 +
    1.28 +#waiting-notice {
    1.29 +  font-size: 110%;
    1.30 +}
    1.31 +
    1.32 +#waiting-notice::before {
    1.33 +  display: inline-block;
    1.34 +  content: "";
    1.35 +  background: url("chrome://global/skin/icons/loading_16.png") center no-repeat;
    1.36 +  width: 16px;
    1.37 +  height: 16px;
    1.38 +  -moz-margin-end: 6px;
    1.39 +}
    1.40 +
    1.41 +#requests-menu-reload-notice-button {
    1.42 +  min-height: 2em;
    1.43 +}
    1.44 +
    1.45 +/* Shaders pane */
    1.46 +
    1.47 +#shaders-pane {
    1.48 +  min-width: 150px;
    1.49 +}
    1.50 +
    1.51 +#shaders-pane + .devtools-side-splitter {
    1.52 +  border-color: transparent;
    1.53 +}
    1.54 +
    1.55 +.program-item {
    1.56 +  padding: 2px 0px;
    1.57 +}
    1.58 +
    1.59 +.side-menu-widget-item-checkbox {
    1.60 +  -moz-appearance: none;
    1.61 +  opacity: 0;
    1.62 +  transition: opacity .15s ease-out 0s;
    1.63 +}
    1.64 +
    1.65 +/* Only show the checkbox when the source is hovered over, is selected, or if it
    1.66 + * is not checked. */
    1.67 +.side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
    1.68 +.side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
    1.69 +.side-menu-widget-item-checkbox:not([checked]) {
    1.70 +  opacity: 1;
    1.71 +  transition: opacity .15s ease-out 0s;
    1.72 +}
    1.73 +
    1.74 +.side-menu-widget-item-checkbox .checkbox-check {
    1.75 +  -moz-appearance: none;
    1.76 +  background: url(itemToggle.png);
    1.77 +  background-repeat: no-repeat;
    1.78 +  background-clip: content-box;
    1.79 +  background-size: 32px 16px;
    1.80 +  background-position: -16px 0;
    1.81 +  width: 16px;
    1.82 +  height: 16px;
    1.83 +  border: 0;
    1.84 +}
    1.85 +
    1.86 +.side-menu-widget-item-checkbox[checked] .checkbox-check {
    1.87 +  background-position: 0 0;
    1.88 +}
    1.89 +
    1.90 +/* Shader source editors */
    1.91 +
    1.92 +.editor-label {
    1.93 +  padding: 1px 12px;
    1.94 +  border-top: 1px solid;
    1.95 +}
    1.96 +
    1.97 +.theme-dark .editor-label {
    1.98 +  background: #343c45; /* Dark toolbars */
    1.99 +  border-color: #000; /* Match the splitter color. */
   1.100 +  color: #f5f7fa; /* Light foreground text */
   1.101 +}
   1.102 +
   1.103 +.theme-light .editor-label {
   1.104 +  background: #f0f1f2; /* Light toolbars */
   1.105 +  border-color: #aaa; /* Match the splitter color. */
   1.106 +  color: #585959; /* Grey foreground text */
   1.107 +}
   1.108 +
   1.109 +.theme-dark .editor-label[selected] {
   1.110 +  background-color: #1d4f73; /* Select Highlight Blue */
   1.111 +  color: #f5f7fa; /* Light foreground text */
   1.112 +}
   1.113 +
   1.114 +.theme-light .editor-label[selected] {
   1.115 +  background-color: #4c9ed9; /* Select Highlight Blue */
   1.116 +  color: #f5f7fa; /* Light foreground text */
   1.117 +}
   1.118 +
   1.119 +/* Responsive sidebar */
   1.120 +
   1.121 +@media (max-width: 700px) {
   1.122 +  #shaders-pane {
   1.123 +    max-height: 60vh;
   1.124 +  }
   1.125 +
   1.126 +  #editors-splitter {
   1.127 +    border-color: transparent;
   1.128 +  }
   1.129 +
   1.130 +  .side-menu-widget-container {
   1.131 +    box-shadow: none !important;
   1.132 +  }
   1.133 +
   1.134 +  .side-menu-widget-item-arrow {
   1.135 +    background-image: none !important;
   1.136 +  }
   1.137 +
   1.138 +  .editor-label {
   1.139 +    -moz-box-ordinal-group: 0;
   1.140 +    border-bottom: 1px solid;
   1.141 +  }
   1.142 +}

mercurial