LCARStrek/browser/webRTC-indicator.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
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 window {
   6   border: 1px solid #9C9CFF;
   7 }
   8
   9 #audioVideoButton,
  10 #screenShareButton,
  11 #firefoxButton {
  12   height: 29px;
  13   margin: 0;
  14   -moz-appearance: none;
  15   border-style: none;
  16 }
  17
  18 #firefoxButton {
  19   background-image: url("chrome://branding/content/icon48.png");
  20   background-repeat: no-repeat;
  21   background-size: 22px;
  22   background-position: center center;
  23   min-width: 29px;
  24   background-color: #000000;
  25 }
  26
  27 #firefoxButton:hover {
  28   background-color: #FFCF00;
  29 }
  30
  31 #screenShareButton {
  32   background-image: url("webRTC-screen-16.png");
  33   background-position: center center;
  34   background-repeat: no-repeat;
  35   background-size: 16px;
  36   min-width: 27px;
  37   display: none;
  38 }
  39
  40 window[sharingscreen] > #screenShareButton {
  41   display: -moz-box;
  42 }
  43
  44 #audioVideoButton {
  45   display: none;
  46   background-repeat: no-repeat;
  47 }
  48
  49 /* When screen sharing, need to pull in the separator: */
  50 window[sharingscreen] > #audioVideoButton {
  51   margin-right: -1px;
  52 }
  53
  54 /* Single icon button: */
  55 window[sharingvideo] > #audioVideoButton,
  56 window[sharingaudio] > #audioVideoButton {
  57   display: -moz-box;
  58   background-position: center center;
  59   background-size: 16px;
  60   min-width: 26px;
  61 }
  62
  63 window[sharingvideo] > #audioVideoButton {
  64   background-image: url("webRTC-camera-16.png");
  65 }
  66
  67 window[sharingaudio] > #audioVideoButton {
  68   background-image: url("webRTC-microphone-16.png");
  69 }
  70
  71 /* Multi-icon button: */
  72 window[sharingaudio][sharingvideo] > #audioVideoButton {
  73   background-image: url("webRTC-camera-16.png"),
  74                     url("webRTC-microphone-16.png");
  75   background-position: 6px center, 26px center;
  76   background-size: 16px, 16px;
  77   min-width: 46px;
  78 }
  79
  80 /* Hover styles */
  81 #audioVideoButton,
  82 #screenShareButton {
  83 /*  background-color: #C09070;*/
  84 }
  85
  86 #audioVideoButton:hover,
  87 #screenShareButton:hover {
  88 /*  background-color: #FFCF00;*/
  89 }
  90
  91 /* Don't show the dropmarker for the type="menu" case */
  92 #audioVideoButton > .box-inherit > .button-menu-dropmarker,
  93 #screenShareButton > .box-inherit > .button-menu-dropmarker {
  94   display: none;
  95 }
  96
  97 /* Separator in case of screen sharing + video/audio sharing */
  98 #shareSeparator {
  99   width: 1px;
 100   margin: 4px -1px 4px 0;
 101   background-color: #A09090;
 102   /* Separator needs to show above either button when they're hovered: */
 103   position: relative;
 104   z-index: 1;
 105   display: none;
 106 }
 107
 108 window[sharingscreen][sharingvideo] > #shareSeparator,
 109 window[sharingscreen][sharingaudio] > #shareSeparator {
 110   display: -moz-box;
 111 }
 112
 113 :-moz-any(#audioVideoButton, #screenShareButton,
 114           #firefoxButton):-moz-focusring > .button-box {
 115   border: none;
 116 }