remoting/webapp/toolbar.css

   1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
   2  * Use of this source code is governed by a BSD-style license that can be
   3  * found in the LICENSE file.
   4  */
   5
   6 .toolbar-container {
   7   position: fixed;
   8   top: -48px;
   9   width: 640px;
  10   -webkit-transition: top 0.15s ease;
  11   font-size: 13px;
  12   pointer-events: none;
  13   z-index: 1;
  14 }
  15
  16 .toolbar-container button {
  17   padding: 3px 9px;
  18 }
  19
  20 .toolbar-visible {
  21   top: -8px;
  22 }
  23
  24 .toolbar-container div {
  25   margin-left: auto;
  26   margin-right: auto;
  27 }
  28
  29 .toolbar-stub {
  30   position: absolute;
  31   width: 134px;
  32   height: 7px;
  33   left: 253px;
  34   border-bottom-left-radius: 7px;
  35   border-bottom-right-radius: 7px;
  36   background-color: #4695ff;
  37   -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  38   pointer-events: all;
  39   clip: rect(0, 999px, 999px, -999px);
  40   -webkit-transition: height 0.15s ease;
  41 }
  42
  43 .toolbar-stub-extended,
  44 .toolbar-visible .toolbar-stub {
  45   height: 14px;
  46 }
  47
  48 .toolbar-border {
  49   border-radius: 7px;
  50   border: 3px solid #4695ff;
  51   width: 620px;
  52   padding: 10px 7px 5px 7px;
  53   background-color: #e9e9e9;
  54   -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  55   pointer-events: all;
  56 }
  57
  58 /* Ensure that the 'connected to' string doesn't make the tool-bar overflow */
  59 #connected-to {
  60   display: inline-block;
  61   max-width: 280px;
  62   overflow: hidden;
  63   margin-__MSG_@@bidi_end_edge__: 8px;
  64   white-space: nowrap;
  65 }
  66
  67 .end-align {
  68   float: __MSG_@@bidi_end_edge__;
  69 }
  70
  71 .arrow-down {
  72   position: absolute;
  73   width: 0;
  74   height: 0;
  75   border-left: 5px solid transparent;
  76   border-right: 5px solid transparent;
  77   border-top: 5px solid white;
  78   left: 62px;
  79   bottom: 2px;
  80   opacity: 0.5;
  81   -webkit-transition: bottom 0.15s ease, opacity 0.1s linear;
  82 }
  83
  84 .toolbar-stub-extended .arrow-down,
  85 .toolbar-visible .arrow-down {
  86   bottom: 6px;
  87 }
  88
  89
  90 .toolbar-stub:hover .arrow-down {
  91   opacity: 1.0;
  92 }
  93
  94 .toolbar-visible .arrow-down {
  95   -webkit-transform: rotate(180deg);
  96 }