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
  44 .edgePath path {
  45   stroke: #9C9CFF; /* Grey foreground text */
  46 }
  47
  48 /* Audio Nodes */
  49 .nodes rect {
  50   stroke-width: 1px;
  51   cursor: pointer;
  52 }
  53
  54 .nodes rect {
  55   stroke: #9C9CFF; /* Tab toolbar */
  56   fill: #000000; /* Toolbars */
  57 }
  58
  59 .nodes g.selected rect {
  60   fill: #008484; /* Select Highlight Blue */
  61 }
  62
  63 /* Text in nodes */
  64 text {
  65   cursor: pointer;
  66   font-weight: 300;
  67   font-family: "Helvetica Neue", Helvetica, Arial, sans-serf;
  68   font-size: 14px;
  69 }
  70
  71 text {
  72   fill: #A09090; /* Grey foreground text */
  73 }
  74 g.selected text {
  75 /*  fill: #f0f1f2; / Toolbars */
  76 }
  77
  78 /**
  79  * Inspector Styles
  80  */
  81
  82 .web-audio-inspector .error {
  83   background-image: url("alerticon-warning.png");
  84   background-size: 13px 12px;
  85   -moz-appearance: none;
  86   opacity: 0;
  87   transition: opacity .5s ease-out 0s;
  88 }
  89
  90 @media (min-resolution: 2dppx) {
  91   .web-audio-inspector .error {
  92     background-image: url(alerticon-warning@2x.png);
  93   }
  94 }
  95
  96 #inspector-pane-toggle {
  97   background: none;
  98   box-shadow: none;
  99   border: none;
 100   list-style-image: url("debugger-collapse.png");
 101   -moz-image-region: rect(0px,16px,16px,0px);
 102 }
 103
 104 #inspector-pane-toggle > .toolbarbutton-icon {
 105   width: 16px;
 106   height: 16px;
 107 }
 108
 109 #inspector-pane-toggle[pane-collapsed] {
 110   list-style-image: url("debugger-expand.png");
 111 }
 112
 113 #inspector-pane-toggle:active {
 114   -moz-image-region: rect(0px,32px,16px,16px);
 115 }
 116
 117 @media (min-resolution: 2dppx) {
 118   #inspector-pane-toggle {
 119     list-style-image: url("debugger-collapse@2x.png");
 120     -moz-image-region: rect(0px,32px,32px,0px);
 121   }
 122
 123   #inspector-pane-toggle[pane-collapsed] {
 124     list-style-image: url("debugger-expand@2x.png");
 125   }
 126
 127   #inspector-pane-toggle:active {
 128     -moz-image-region: rect(0px,64px,32px,32px);
 129   }
 130
 131   .web-audio-inspector .error {
 132     background-image: url("alerticon-warning@2x.png");
 133   }
 134 }
 135
 136 /**
 137  * Responsive Styles
 138  * `.devtools-responsive-container` takes care of most of
 139  * the changing of host types.
 140  */
 141 @media (max-width: 700px) {
 142   /**
 143    * Override the inspector toggle so it's always open
 144    * in the portrait view, with the toggle button hidden.
 145    */
 146   #inspector-pane-toggle {
 147     display: none;
 148   }
 149
 150   #web-audio-inspector {
 151     margin-left: 0px !important;
 152     margin-right: 0px !important;
 153   }
 154 }
 155
 156 #inspector-pane-toggle {
 157   background: none;
 158   box-shadow: none;
 159   border: none;
 160   list-style-image: url("debugger-collapse.png");
 161   -moz-image-region: rect(0px,16px,16px,0px);
 162 }
 163
 164 #inspector-pane-toggle[pane-collapsed] {
 165   list-style-image: url("debugger-expand.png");
 166 }
 167
 168 #inspector-pane-toggle:active {
 169   -moz-image-region: rect(0px,32px,16px,16px);
 170 }