OLD | NEW |
---|---|
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. | 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 | 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 | 4 |
5 /* The shield that overlays the background. */ | 5 /* The shield that overlays the background. */ |
6 .overlay { | 6 .overlay { |
7 -webkit-box-align: center; | 7 -webkit-box-align: center; |
8 -webkit-box-orient: vertical; | 8 -webkit-box-orient: vertical; |
9 -webkit-box-pack: center; | 9 -webkit-box-pack: center; |
10 -webkit-transition: 200ms opacity; | 10 -webkit-transition: 200ms opacity; |
11 background-color: rgba(255, 255, 255, 0.75); | 11 background-color: rgba(255, 255, 255, 0.75); |
12 bottom: 0; | 12 bottom: 0; |
13 display: -webkit-box; | 13 display: -webkit-box; |
14 left: 0; | 14 left: 0; |
15 overflow: auto; | 15 overflow: auto; |
16 padding: 20px; | 16 padding: 20px; |
17 padding-bottom: 130px; | 17 padding-bottom: 130px; |
18 position: fixed; | 18 position: fixed; |
19 right: 0; | 19 right: 0; |
20 top: 0; | 20 top: 0; |
21 } | 21 } |
22 | 22 |
23 /* The foregrounded dialog. */ | 23 /* The foreground dialog. */ |
csilv
2012/02/07 18:57:33
lol
| |
24 .overlay .page { | 24 .overlay .page { |
25 background: white; | 25 background: white; |
26 box-shadow: 0 3px 15px rgba(0, 0, 0, 0.3), 0 3px 57px rgba(0, 0, 0, 0.3); | 26 box-shadow: 0 3px 15px rgba(0, 0, 0, 0.3), 0 3px 57px rgba(0, 0, 0, 0.3); |
27 min-width: 400px; | 27 min-width: 400px; |
28 padding: 0; | 28 padding: 0; |
29 position: relative; | 29 position: relative; |
30 } | 30 } |
31 | 31 |
32 /* keyframes used to shake the overlay */ | |
33 @-webkit-keyframes shake { | |
34 0% { | |
35 -webkit-transform: translateX(-5px) rotateZ(-0.5deg) translateY(-2px); | |
36 } | |
37 50% { | |
38 -webkit-transform: translateX(0px) rotateZ(0deg) translateY(0px); | |
39 } | |
40 100% { | |
41 -webkit-transform: translateX(5px) rotateZ(0.5deg) translateY(-2px); | |
42 } | |
43 } | |
44 | |
45 .overlay .page.shake { | |
46 -webkit-animation-direction: alternate; | |
47 -webkit-animation-duration: 60ms; | |
48 -webkit-animation-iteration-count: 7; | |
49 -webkit-animation-name: shake; | |
50 -webkit-animation-timing-function: ease-in-out; | |
51 } | |
52 | |
32 .overlay .page h1 { | 53 .overlay .page h1 { |
33 -webkit-padding-end: 24px; | 54 -webkit-padding-end: 24px; |
34 -webkit-user-select: none; | 55 -webkit-user-select: none; |
35 background: -webkit-linear-gradient(white, #F8F8F8); | 56 background: -webkit-linear-gradient(white, #F8F8F8); |
36 border-bottom: 1px solid rgba(188, 193, 208, .5); | 57 border-bottom: 1px solid rgba(188, 193, 208, .5); |
37 color: #333; | 58 color: #333; |
38 font-size: 105%; | 59 font-size: 105%; |
39 font-weight: bold; | 60 font-weight: bold; |
40 margin: 0; | 61 margin: 0; |
41 padding: 10px 15px 8px; | 62 padding: 10px 15px 8px; |
(...skipping 23 matching lines...) Expand all Loading... | |
65 | 86 |
66 .overlay .page .button-strip { | 87 .overlay .page .button-strip { |
67 -webkit-box-orient: horizontal; | 88 -webkit-box-orient: horizontal; |
68 display: -webkit-box; | 89 display: -webkit-box; |
69 } | 90 } |
70 | 91 |
71 .overlay .page .button-strip > button { | 92 .overlay .page .button-strip > button { |
72 -webkit-margin-start: 10px; | 93 -webkit-margin-start: 10px; |
73 display: block; | 94 display: block; |
74 } | 95 } |
OLD | NEW |