Home | History | Annotate | Download | only in chromeos
      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 body {
      7   -webkit-user-select: none;
      8   background: #fff;
      9   margin: 0;
     10   overflow: hidden;
     11   padding: 0;
     12 }
     13 
     14 .keyboard-overlay-keyboard {
     15   background: -webkit-linear-gradient(#484848, #252525) no-repeat;
     16   background-color: #252525;
     17   border-radius: 6px;
     18   font-family: 'Noto Sans UI', ui-sans;
     19 }
     20 
     21 .keyboard-overlay-instructions {
     22   -webkit-box-orient: vertical;
     23   background: -webkit-linear-gradient(rgb(51, 76, 126), rgb(13, 23, 43));
     24   border: 2px solid rgb(87, 108, 207);
     25   border-radius: 5px;
     26   color: #fff;
     27   display: -webkit-box;
     28   position: absolute;
     29   vertical-align: middle;
     30   z-index: 100;
     31 }
     32 
     33 .keyboard-overlay-instructions-text {
     34   -webkit-box-flex: 3;
     35   margin: 13px auto 0;
     36   max-width: 20em;
     37   text-align: center;
     38   vertical-align: middle;
     39 }
     40 
     41 .keyboard-overlay-instructions-hide-text {
     42   -webkit-box-flex: 2;
     43   font-weight: bold;
     44   text-align: center;
     45   vertical-align: middle;
     46 }
     47 
     48 .keyboard-overlay-learn-more-text {
     49   -webkit-box-flex: 1;
     50   font-size: 90%;
     51   margin: 0 auto 13px;
     52   text-align: center;
     53   text-decoration: underline;
     54   vertical-align: middle;
     55 }
     56 
     57 .keyboard-overlay-learn-more-text a {
     58   color: #fff;
     59 }
     60 
     61 .keyboard-overlay-key {
     62   -webkit-box-orient: vertical;
     63   background-color: rgba(24, 24, 24, 0.9);
     64   border: 2px solid #7f7f7f;
     65   border-radius: 4px;
     66   color: rgb(151, 151, 151);
     67   display: -webkit-box;
     68   font-size: 75%;
     69   font-weight: bold;
     70   position: absolute;
     71 }
     72 
     73 .keyboard-overlay-key.is-shortcut {
     74   background: -webkit-linear-gradient(rgba(61, 61, 61, 0.8),
     75                                       rgba(27, 27, 27, 0.8));
     76   border-color: #fafafa;
     77   color: #9e9e9e;
     78 }
     79 
     80 .keyboard-overlay-key.is-shortcut.modifier-shift {
     81   border-color: rgb(97, 186, 100);
     82 }
     83 
     84 .keyboard-overlay-key.is-shortcut.modifier-ctrl {
     85   border-color: rgb(93, 128, 199);
     86 }
     87 
     88 .keyboard-overlay-key.is-shortcut.modifier-alt {
     89   border-color: rgb(184, 84, 84);
     90 }
     91 
     92 .keyboard-overlay-key.is-shortcut.modifier-search {
     93   border-color: rgb(204, 204, 80);
     94 }
     95 
     96 .keyboard-overlay-key.is-shortcut.modifier-shift.modifier-ctrl {
     97   border-color: rgb(121, 172, 143);
     98 }
     99 
    100 .keyboard-overlay-key.is-shortcut.modifier-shift.modifier-alt {
    101   border-color: rgb(191, 189, 121);
    102 }
    103 
    104 .keyboard-overlay-key.is-shortcut.modifier-ctrl.modifier-alt {
    105   border-color: rgb(158, 84, 206);
    106 }
    107 
    108 .keyboard-overlay-key.is-shortcut.modifier-shift.modifier-ctrl.modifier-alt {
    109   border-color: #7f7f7f;
    110 }
    111 
    112 .keyboard-overlay-key.pressed {
    113   border-color: #fff;
    114   color: #fff;
    115 }
    116 
    117 .keyboard-overlay-key.pressed.is-shift {
    118   background: -webkit-linear-gradient(rgb(68, 161, 66), rgb(62, 95, 55));
    119 }
    120 
    121 .keyboard-overlay-key.pressed.is-shift.modifier-ctrl {
    122   background: -webkit-linear-gradient(rgb(66, 161, 67), rgb(46, 92, 83));
    123 }
    124 
    125 .keyboard-overlay-key.pressed.is-shift.modifier-alt {
    126   background: -webkit-linear-gradient(rgb(69, 163, 67), rgb(81, 81, 52));
    127 }
    128 
    129 .keyboard-overlay-key.pressed.is-shift.modifier-ctrl.modifier-alt {
    130   background: -webkit-linear-gradient(rgb(82, 161, 42), rgb(79, 77, 46));
    131 }
    132 
    133 .keyboard-overlay-key.pressed.is-ctrl {
    134   background: -webkit-linear-gradient(rgb(31, 55, 162), rgb(25, 38, 90));
    135 }
    136 
    137 .keyboard-overlay-key.pressed.is-ctrl.modifier-shift {
    138   background: -webkit-linear-gradient(rgb(67, 159, 165), rgb(30, 55, 96));
    139 }
    140 
    141 .keyboard-overlay-key.pressed.is-ctrl.modifier-alt {
    142   background: -webkit-linear-gradient(rgb(115, 54, 144), rgb(34, 37, 94));
    143 }
    144 
    145 .keyboard-overlay-key.pressed.is-ctrl.modifier-shift.modifier-alt {
    146   background: -webkit-linear-gradient(rgb(115, 54, 144), rgb(33, 37, 93));
    147 }
    148 
    149 .keyboard-overlay-key.pressed.is-alt {
    150   background: -webkit-linear-gradient(rgb(132, 44, 42), rgb(84, 30, 28));
    151 }
    152 
    153 .keyboard-overlay-key.pressed.is-alt.modifier-shift {
    154   background: -webkit-linear-gradient(top left, rgb(116, 94, 49),
    155                                                 rgb(85, 36, 30));
    156 }
    157 
    158 .keyboard-overlay-key.pressed.is-alt.modifier-ctrl {
    159   background: -webkit-linear-gradient(rgb(118, 54, 143), rgb(82, 33, 40));
    160 }
    161 
    162 .keyboard-overlay-key.pressed.is-alt.modifier-shift.modifier-ctrl {
    163   background: -webkit-linear-gradient(top left, rgb(115, 95, 41),
    164                                                 rgb(80, 36, 27));
    165 }
    166 
    167 .keyboard-overlay-key.pressed.is-search {
    168   background: -webkit-linear-gradient(rgb(242, 242, 126), rgb(186, 186, 52));
    169 }
    170 
    171 .keyboard-overlay-shortcut-text {
    172   -webkit-box-flex: 1;
    173   -webkit-box-ordinal-group: 1;
    174   color: #fff;
    175   padding: 1px 3px 0;
    176   text-align: center;
    177   text-shadow: #000 0 0 2px;
    178 }
    179 
    180 .keyboard-overlay-key-text {
    181   -webkit-box-ordinal-group: 2;
    182   padding: 0 3px 2px;
    183   text-align: center;
    184 }
    185 
    186 .keyboard-overlay-key.is-shortcut .keyboard-overlay-key-text {
    187   opacity: 0.25;
    188 }
    189