LCARStrek/browser/devtools/webaudioeditor.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 /* Reload and waiting notices */
   6 .notice-container {
   7   margin-top: -50vh;
   8 }
   9
  10 .notice-container {
  11   background-color: #000000; /* Toolbars */
  12   color: #A09090; /* Light foreground text */
  13 }
  14
  15 #reload-notice {
  16   font-size: 120%;
  17 }
  18
  19 #waiting-notice {
  20   font-size: 110%;
  21 }
  22
  23 #waiting-notice::before {
  24   display: inline-block;
  25   content: "";
  26   background: url("chrome://global/skin/icons/loading.gif") center no-repeat;
  27   width: 16px;
  28   height: 16px;
  29   -moz-margin-end: 6px;
  30 }
  31
  32 /* Context Graph */
  33 svg {
  34   overflow: hidden;
  35   -moz-box-flex: 1;
  36 }
  37
  38 /* Edges in graph */
  39 .edgePath path {
  40   stroke-width: 1px;
  41   fill: none;
  42
  43   stroke: #9C9CFF; /* Grey foreground text */
  44 }
  45
  46 /* Audio Nodes */
  47 .nodes rect {
  48   stroke-width: 1px;
  49   cursor: pointer;
  50 }
  51
  52 .nodes rect {
  53   stroke: #9C9CFF; /* Tab toolbar */
  54   fill: #000000; /* Toolbars */
  55 }
  56
  57 .nodes g.selected rect {
  58   fill: #008484; /* Select Highlight Blue */
  59 }
  60
  61 /* Text in nodes */
  62 text {
  63   cursor: pointer;
  64   font-weight: 300;
  65   font-family: "Helvetica Neue", Helvetica, Arial, sans-serf;
  66   font-size: 14px;
  67 }
  68
  69 text {
  70   fill: #A09090; /* Grey foreground text */
  71 }
  72 g.selected text {
  73 /*  fill: #f0f1f2; / Toolbars */
  74 }
  75
  76 /**
  77  * Inspector Styles
  78  */
  79
  80 .web-audio-inspector .error {
  81   background-image: url("alerticon-warning.png");
  82   background-size: 13px 12px;
  83   -moz-appearance: none;
  84   opacity: 0;
  85   transition: opacity .5s ease-out 0s;
  86 }
  87
  88 @media (min-resolution: 2dppx) {
  89   .web-audio-inspector .error {
  90     background-image: url(alerticon-warning@2x.png);
  91   }
  92 }
  93
  94 #inspector-pane-toggle {
  95   background: none;
  96   box-shadow: none;
  97   border: none;
  98   list-style-image: url("debugger-collapse.png");
  99   -moz-image-region: rect(0px,16px,16px,0px);
 100 }
 101
 102 #inspector-pane-toggle > .toolbarbutton-icon {
 103   width: 16px;
 104   height: 16px;
 105 }
 106
 107 #inspector-pane-toggle[pane-collapsed] {
 108   list-style-image: url("debugger-expand.png");
 109 }
 110
 111 #inspector-pane-toggle:active {
 112   -moz-image-region: rect(0px,32px,16px,16px);
 113 }
 114
 115 @media (min-resolution: 2dppx) {
 116   #inspector-pane-toggle {
 117     list-style-image: url("debugger-collapse@2x.png");
 118     -moz-image-region: rect(0px,32px,32px,0px);
 119   }
 120
 121   #inspector-pane-toggle[pane-collapsed] {
 122     list-style-image: url("debugger-expand@2x.png");
 123   }
 124
 125   #inspector-pane-toggle:active {
 126     -moz-image-region: rect(0px,64px,32px,32px);
 127   }
 128
 129   .web-audio-inspector .error {
 130     background-image: url("alerticon-warning@2x.png");
 131   }
 132 }
 133
 134 /**
 135  * Responsive Styles
 136  * `.devtools-responsive-container` takes care of most of
 137  * the changing of host types.
 138  */
 139 @media (max-width: 700px) {
 140   /**
 141    * Override the inspector toggle so it's always open
 142    * in the portrait view, with the toggle button hidden.
 143    */
 144   #inspector-pane-toggle {
 145     display: none;
 146   }
 147
 148   #web-audio-inspector {
 149     margin-left: 0px !important;
 150     margin-right: 0px !important;
 151   }
 152 }
 153
 154 #inspector-pane-toggle {
 155   background: none;
 156   box-shadow: none;
 157   border: none;
 158   list-style-image: url("debugger-collapse.png");
 159   -moz-image-region: rect(0px,16px,16px,0px);
 160 }
 161
 162 #inspector-pane-toggle[pane-collapsed] {
 163   list-style-image: url("debugger-expand.png");
 164 }
 165
 166 #inspector-pane-toggle:active {
 167   -moz-image-region: rect(0px,32px,16px,16px);
 168 }