native_client_sdk/src/gonacl_appengine/static/bullet/fullscreen.css

   1 /* Copyright (c) 2014 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   box-sizing: border-box;
   7   -webkit-font-smoothing:antialiased;
   8 }
   9
  10 html, body {
  11   background: #FAFAFA;
  12   color: #444;
  13   font-family: 'Myriad Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  14   height: 100%;
  15   line-height: 1.35;
  16   margin: 0;
  17   padding: 0;
  18   width: 100%;
  19   overflow: hidden;
  20 }
  21
  22 #listener {
  23   bottom: 0;
  24   left: 0;
  25   position: absolute;
  26   right: 0;
  27   top: 0;
  28 }
  29
  30 #rendererContainer {
  31   height: 100%;
  32   line-height: 0;
  33   width: 100%;
  34 }
  35
  36 #title-box {
  37   background-color: rgba(255, 255, 255, 0.9);
  38   max-width: 300px;
  39   padding: 8px;
  40   position: absolute;
  41   -webkit-user-select: none;
  42   z-index: 1000;
  43 }
  44
  45 #title-box-toggle-button {
  46   color: #000;
  47   cursor: pointer;
  48   float: right;
  49   padding: 8px;
  50   text-align: center;
  51   transition: color 0.2s;
  52 }
  53
  54 #title-box-toggle-button.open {
  55   text-decoration: none;
  56 }
  57
  58 #title-box-toggle-button:hover {
  59   color: #888;
  60 }
  61
  62 #title-box-expando {
  63   clear: both;
  64   overflow: hidden;
  65   transition: max-height 0.6s ease-in-out;
  66   max-height: 0;
  67 }
  68
  69 #title-box-expando.open {
  70   max-height: 800px;
  71 }
  72
  73 h1 {
  74   border-bottom: 1px solid #bbb;
  75   color: #666;
  76   font-size: 110%;
  77   font-weight: 600;
  78   letter-spacing: -0.05em;
  79   margin: 0;
  80   padding-bottom: 0.1em;
  81   text-align: center;
  82 }
  83
  84 h2 {
  85   color: #666;
  86   font-size: 100%;
  87   font-weight: 600;
  88   letter-spacing: -0.05em;
  89   margin: 0;
  90   padding-bottom: 0.1em;
  91   text-align: center;
  92 }
  93
  94 a {
  95   color: #00A3D9;
  96 }
  97
  98 .small {
  99   font-size: 75%;
 100 }
 101
 102 button {
 103   background: #777;
 104   color: #FFF;
 105   width: calc(100% - 20px);
 106   height: 35px;
 107   border-radius: 6px;
 108   border: none;
 109   margin-left: 10px;
 110   margin-right: 10px;
 111   margin-bottom: 4px;
 112   cursor: pointer;
 113   text-align: center;
 114   transition: background-color 0.2s ease-out;
 115 }
 116
 117 button:hover {
 118   background: #333;
 119 }
 120
 121 #loading-cover{
 122   background-color: rgba(255, 255, 255, 0.8);
 123   bottom: 0;
 124   display: block;
 125   left: 0;
 126   position: fixed;
 127   right: 0;
 128   top: 0;
 129   width: 100%;
 130   z-index: 1001;
 131 }
 132
 133 #message {
 134   bottom: 0;
 135   font-size: 44px;
 136   height: calc(1em + 80px);  /* not perfect, but pretty close. */
 137   left: 0;
 138   margin: auto;
 139   position: absolute;
 140   right: 0;
 141   text-align: center;
 142   top: 0;
 143   z-index: 10;
 144 }
 145
 146 #statusField {
 147   color: #444;
 148   font-weight: 700;
 149   width: 100%;
 150   letter-spacing: -0.06em;
 151 }
 152
 153 #progress {
 154   margin: 20px auto;
 155   width: 300px;
 156   border-radius: 8px;
 157   background: #FFF;
 158   box-shadow: 0 3px 8px rgba(0,0,0,0.3);
 159 }
 160
 161 .progress-bar {
 162   border-radius: 8px;
 163   height: 40px;
 164   background: #6DD900;
 165   transition: width 0.1s ease-out;
 166 }