OLD | NEW |
1 /* Copyright 2013 The Chromium Authors. All rights reserved. | 1 /* Copyright 2013 The Chromium Authors. All rights reserved. |
2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
3 * found in the LICENSE file. */ | 3 * found in the LICENSE file. */ |
4 body { | 4 body { |
5 background-attachment: fixed !important | 5 background-attachment: fixed !important; |
| 6 background-color: white; |
| 7 cursor: default; |
| 8 margin: 0; |
| 9 overflow: hidden; |
| 10 } |
| 11 |
| 12 #ntp-contents { |
| 13 text-align: -webkit-center; |
| 14 } |
| 15 |
| 16 body.fakebox-animate #ntp-contents { |
| 17 -webkit-transition: opacity 100ms linear; |
| 18 opacity: 0.2; |
| 19 } |
| 20 |
| 21 body.google-page #logo, |
| 22 body.google-page #fakebox { |
| 23 display: block; |
| 24 } |
| 25 |
| 26 body.google-page #mv-top-margin { |
| 27 display: none; |
| 28 } |
| 29 |
| 30 #logo { |
| 31 /* TODO(jeremycho): Add 2x image. */ |
| 32 background: transparent url(images/google_logo.png); |
| 33 display: none; |
| 34 height: 95px; |
| 35 margin-bottom: 20px; |
| 36 margin-top: 144px; |
| 37 width: 275px; |
| 38 } |
| 39 |
| 40 body.custom-theme #logo { |
| 41 /* TODO(jeremycho): Add 2x image. */ |
| 42 background: transparent url(images/white_google_logo.png); |
| 43 } |
| 44 |
| 45 #fakebox { |
| 46 -webkit-border-radius: 1px; |
| 47 /* Use GPU compositing if available. */ |
| 48 -webkit-transform: translate3d(0, 0, 0); |
| 49 -webkit-transition: -webkit-transform 100ms linear; |
| 50 background-color: #fff; |
| 51 border: 1px solid #b9b9b9; |
| 52 border-top: 1px solid #a0a0a0; |
| 53 box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); |
| 54 cursor: text; |
| 55 display: none; |
| 56 font: 18px arial, sans-serif; |
| 57 height: 36px; |
| 58 max-width: 620px; |
| 59 width: 300px; |
| 60 } |
| 61 |
| 62 #fakebox:hover { |
| 63 border: 1px solid #a9a9a9; |
| 64 border-top: 1px solid #909090; |
| 65 } |
| 66 |
| 67 body.fakebox-focused #fakebox { |
| 68 border: 1px solid rgb(77, 144, 254); |
| 69 } |
| 70 |
| 71 body.fakebox-animate #fakebox { |
| 72 -webkit-transform: translateY(-100px); |
| 73 } |
| 74 |
| 75 #fakebox>input { |
| 76 bottom: 0; |
| 77 left: 0; |
| 78 opacity: 0; |
| 79 position: absolute; |
| 80 right: 0; |
| 81 top: 0; |
| 82 } |
| 83 |
| 84 #cursor { |
| 85 background: #333; |
| 86 bottom: 5px; |
| 87 position: absolute; |
| 88 top: 5px; |
| 89 visibility: hidden; |
| 90 width: 1px; |
| 91 } |
| 92 |
| 93 @-webkit-keyframes blink { |
| 94 0%, |
| 95 61.54% { |
| 96 opacity: 1; |
| 97 } |
| 98 61.55%, |
| 99 100% { |
| 100 opacity: 0; |
| 101 } |
| 102 } |
| 103 body.fakebox-focused #cursor { |
| 104 -webkit-animation: blink 1.3s linear infinite; |
| 105 visibility: inherit; |
6 } | 106 } |
7 | 107 |
8 #most-visited { | 108 #most-visited { |
9 -webkit-user-select: none; | 109 -webkit-user-select: none; |
10 margin-top: 60px; | 110 margin-top: 60px; |
11 text-align: -webkit-center; | 111 text-align: -webkit-center; |
12 } | 112 } |
13 | 113 |
14 .custom-theme .mv-title, | 114 .custom-theme .mv-title, |
15 .custom-theme #mv-msg { | 115 .custom-theme #mv-msg { |
16 color: #fff; | 116 color: #fff; |
17 text-shadow: black 0 1px 3px; | 117 text-shadow: black 0 1px 3px; |
18 } | 118 } |
19 | 119 |
20 .custom-theme #mv-notice-links span { | 120 .custom-theme #mv-notice-links span { |
21 color: #fff; | 121 color: #fff; |
22 text-shadow: rgb(17, 85, 204) 0 1px 3px; | 122 text-shadow: rgb(17, 85, 204) 0 1px 3px; |
23 } | 123 } |
24 | 124 |
25 #mv-tiles { | 125 #mv-tiles { |
26 /* Use GPU compositing if available. */ | 126 /* Use GPU compositing if available. */ |
27 -webkit-transform: translate3d(0, 0, 0); | 127 -webkit-transform: translate3d(0, 0, 0); |
28 -webkit-transition: width 200ms; | |
29 height: 120px; | 128 height: 120px; |
30 overflow: hidden; | 129 overflow: hidden; |
31 white-space: nowrap; | 130 white-space: nowrap; |
32 width: 304px; | 131 width: 304px; |
33 } | 132 } |
34 | 133 |
35 @media only screen and (min-width:666px) { | 134 @media only screen and (min-width:666px) { |
| 135 #fakebox, |
36 #mv-tiles { | 136 #mv-tiles { |
37 width: 466px; | 137 width: 466px; |
38 } | 138 } |
39 } | 139 } |
40 | 140 |
41 @media only screen and (min-width:829px) { | 141 @media only screen and (min-width:829px) { |
| 142 #fakebox, |
42 #mv-tiles { | 143 #mv-tiles { |
43 width: 629px; | 144 width: 629px; |
44 } | 145 } |
45 } | 146 } |
46 | 147 |
47 .mv-tile:first-child { | 148 .mv-tile:first-child { |
48 -webkit-margin-start: 0; | 149 -webkit-margin-start: 0; |
49 } | 150 } |
50 | 151 |
51 .mv-tile { | 152 .mv-tile { |
(...skipping 148 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
200 cursor: default; | 301 cursor: default; |
201 font-size: 75%; | 302 font-size: 75%; |
202 position: absolute; | 303 position: absolute; |
203 right: 13px; | 304 right: 13px; |
204 text-align: left; | 305 text-align: left; |
205 z-index: -1; | 306 z-index: -1; |
206 } | 307 } |
207 | 308 |
208 #attribution img { | 309 #attribution img { |
209 display: block; | 310 display: block; |
210 } | 311 } |
| 312 |
| 313 #suggestions-box { |
| 314 border-bottom: 1px #d9d9d9 solid; |
| 315 padding-bottom: 6px; |
| 316 padding-top: 6px; |
| 317 } |
| 318 |
| 319 #suggestions-box-container { |
| 320 position: absolute; |
| 321 top: 0; |
| 322 width: 100%; |
| 323 } |
| 324 |
| 325 .suggestion { |
| 326 -webkit-border-radius: 2px; |
| 327 background: -webkit-image-set( |
| 328 url('images/page_icon.png') 1x, |
| 329 url('images/2x/page_icon.png') 2x) no-repeat; |
| 330 padding-bottom: 2px; |
| 331 padding-top: 3px; |
| 332 white-space: nowrap; |
| 333 } |
| 334 |
| 335 .search { |
| 336 background: -webkit-image-set( |
| 337 url('images/search_icon.png') 1x, |
| 338 url('images/2x/search_icon.png') 2x) no-repeat; |
| 339 } |
| 340 |
| 341 .suggestion:hover { |
| 342 background-color: #eee; |
| 343 } |
| 344 |
| 345 .selected, |
| 346 .selected:hover { |
| 347 background-color: rgba(181, 213, 255, 0.5); |
| 348 } |
| 349 |
| 350 .contents { |
| 351 -webkit-padding-start: 26px; |
| 352 -webkit-user-select: none; |
| 353 border: 0; |
| 354 height: 22px; |
| 355 overflow: hidden; |
| 356 width: 100%; |
| 357 } |
| 358 |
| 359 /* Styling for native suggestions, hidden by the shadow DOM. */ |
| 360 .chrome_url { |
| 361 color: rgb(0, 153, 51); |
| 362 } |
| 363 |
| 364 .chrome_title { |
| 365 color: #666; |
| 366 } |
OLD | NEW |