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 /* Google Drive welcome banners.*/ | 5 /* Google Drive welcome banners.*/ |
6 .gdrive-welcome-wrapper { | 6 .gdrive-welcome-wrapper { |
7 /* This image looks good in high DPI as is. */ | 7 /* This image looks good in high DPI as is. */ |
8 background-image: url('../images/files/ui/clouds.png'); | 8 background-image: url('../images/files/ui/clouds.png'); |
9 background-repeat: repeat-x; | 9 background-repeat: repeat-x; |
| 10 color: #333; |
10 } | 11 } |
11 | 12 |
12 .gdrive-welcome-icon { | 13 .gdrive-welcome-icon { |
13 background-image: -webkit-image-set( | 14 background-image: -webkit-image-set( |
14 url('../images/files/ui/gdrive_logo.png') 1x, | 15 url('../images/files/ui/gdrive_logo.png') 1x, |
15 url('../images/files/ui/2x/gdrive_logo.png') 2x); | 16 url('../images/files/ui/2x/gdrive_logo.png') 2x); |
16 background-repeat: no-repeat; | 17 background-repeat: no-repeat; |
17 } | 18 } |
18 | 19 |
19 .gdrive-welcome-links { | 20 .gdrive-welcome-links { |
20 -webkit-box-orient: horizontal; | 21 -webkit-box-orient: horizontal; |
21 display: -webkit-box; | 22 display: -webkit-box; |
22 } | 23 } |
23 | 24 |
| 25 .gdata-welcome-button { |
| 26 -webkit-border-radius: 2px; |
| 27 -webkit-transition: all 218ms; |
| 28 -webkit-user-select: none; |
| 29 background-image: -webkit-linear-gradient(top,#f5f5f5,#f1f1f1); |
| 30 border: 1px solid rgba(0,0,0,0.1); |
| 31 color: #444; |
| 32 cursor: default; |
| 33 display: inline-block; |
| 34 font-size: 13px; |
| 35 font-weight: bold; |
| 36 height: 27px; |
| 37 line-height: 27px; |
| 38 padding: 0 8px; |
| 39 text-align: center; |
| 40 } |
| 41 |
| 42 .gdata-welcome-button:hover { |
| 43 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1); |
| 44 -webkit-transition: all 0; |
| 45 background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1); |
| 46 border-color: #C6C6C6; |
| 47 color: #222; |
| 48 } |
| 49 |
| 50 .gdata-welcome-button:active { |
| 51 -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1); |
| 52 background-image: -webkit-linear-gradient(top,#f6f6f6,#f1f1f1); |
| 53 } |
| 54 |
| 55 |
| 56 .gdata-welcome-button.gdata-welcome-start { |
| 57 background-image: |
| 58 -webkit-linear-gradient(top, rgb(77, 144, 254), rgb(71, 135, 237)); |
| 59 border-color: rgb(48, 121, 237); |
| 60 color: white; |
| 61 } |
| 62 |
| 63 .gdata-welcome-button.gdata-welcome-start:hover { |
| 64 -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1); |
| 65 background-image: |
| 66 -webkit-linear-gradient(top, rgb(77, 144, 254), rgb(53, 122, 232)); |
| 67 border-color: rgb(47, 91, 183); |
| 68 } |
| 69 |
24 /* Header welcome banner. */ | 70 /* Header welcome banner. */ |
25 .gdrive-welcome.header { | 71 .gdrive-welcome.header { |
26 -webkit-box-flex: 0; | 72 -webkit-box-flex: 0; |
27 -webkit-transition: height 180ms ease; | 73 -webkit-transition: height 180ms ease; |
28 height: 100px; | 74 height: 100px; |
29 overflow: hidden; | 75 overflow: hidden; |
30 position: relative; | 76 position: relative; |
31 } | 77 } |
32 | 78 |
33 .dialog-container:not([gdrive-welcome='header']) .gdrive-welcome.header { | 79 .dialog-container:not([gdrive-welcome='header']) .gdrive-welcome.header { |
34 height: 0; | 80 height: 0; |
35 } | 81 } |
36 | 82 |
37 .gdrive-welcome.header .gdrive-welcome-wrapper { | 83 .gdrive-welcome.header .gdrive-welcome-wrapper { |
38 -webkit-box-orient: horizontal; | 84 -webkit-box-orient: horizontal; |
39 background-size: 308px 100px; | 85 background-size: 308px 100px; |
40 border-top: 1px solid #d4d4d4; | 86 border-top: 1px solid #d4d4d4; |
41 bottom: 0; | 87 bottom: 0; |
42 display: -webkit-box; | 88 display: -webkit-box; |
43 left: 0; | 89 left: 0; |
44 position: absolute; | 90 position: absolute; |
45 right: 0; | 91 right: 0; |
46 top: 0; | 92 top: 0; |
47 } | 93 } |
48 | 94 |
49 .gdrive-welcome.header .gdrive-welcome-icon { | 95 .gdrive-welcome.header .gdrive-welcome-icon { |
50 background-position: center 20px; | 96 background-position: center 18px; |
51 background-size: 51px 44px; | 97 background-size: 51px 44px; |
52 width: 120px; | 98 width: 120px; |
53 } | 99 } |
54 | 100 |
55 .gdrive-welcome.header .gdrive-welcome-message { | 101 .gdrive-welcome.header .gdrive-welcome-message { |
56 -webkit-box-flex: 1; | 102 -webkit-box-flex: 1; |
57 -webkit-box-orient: vertical; | 103 -webkit-box-orient: vertical; |
58 display: -webkit-box; | 104 display: -webkit-box; |
59 } | 105 } |
60 | 106 |
61 .gdrive-welcome.header .gdrive-welcome-title { | 107 .gdrive-welcome.header .gdrive-welcome-title { |
62 font-size: 140%; | 108 font-size: 140%; |
63 margin-bottom: 8px; | 109 margin-bottom: 4px; |
64 margin-top: 16px; | 110 margin-top: 14px; |
65 } | 111 } |
66 | 112 |
67 .gdrive-welcome.header .gdrive-welcome-text { | 113 .gdrive-welcome.header .gdrive-welcome-text { |
68 margin-bottom: 8px; | 114 margin-bottom: 10px; |
69 } | 115 } |
70 | 116 |
71 .gdrive-welcome.header .gdrive-welcome-dismiss { | 117 .gdrive-welcome.header .gdrive-welcome-dismiss { |
72 display: none; | 118 display: none; |
73 } | 119 } |
74 | 120 |
75 /* Full page welcome banner. */ | 121 /* Full page welcome banner. */ |
76 .gdrive-welcome.page { | 122 .gdrive-welcome.page { |
77 bottom: 0; | 123 bottom: 0; |
78 left: 0; | 124 left: 0; |
(...skipping 28 matching lines...) Expand all Loading... |
107 .gdrive-welcome.page .gdrive-welcome-icon { | 153 .gdrive-welcome.page .gdrive-welcome-icon { |
108 background-position: center center; | 154 background-position: center center; |
109 height: 240px; | 155 height: 240px; |
110 left: 0; | 156 left: 0; |
111 right: 0; | 157 right: 0; |
112 top: 0; | 158 top: 0; |
113 width: 100%; | 159 width: 100%; |
114 } | 160 } |
115 | 161 |
116 .gdrive-welcome.page .gdrive-welcome-message { | 162 .gdrive-welcome.page .gdrive-welcome-message { |
117 color: #333; | |
118 margin-left: 10px; | 163 margin-left: 10px; |
119 margin-right: 10px; | 164 margin-right: 10px; |
120 max-width: 525px; | 165 max-width: 525px; |
121 } | 166 } |
122 | 167 |
123 .gdrive-welcome.page .gdrive-welcome-title { | 168 .gdrive-welcome.page .gdrive-welcome-title { |
124 font-size: 133%; | 169 font-size: 133%; |
125 margin-bottom: 30px; | 170 margin-bottom: 30px; |
126 text-align: center; | 171 text-align: center; |
127 } | 172 } |
128 | 173 |
129 .gdrive-welcome.page .gdrive-welcome-text { | 174 .gdrive-welcome.page .gdrive-welcome-text { |
130 margin-bottom: 24px; | 175 margin-bottom: 24px; |
131 } | 176 } |
132 | 177 |
133 .gdrive-welcome.page .gdrive-welcome-dismiss { | 178 .gdrive-welcome.page .gdrive-welcome-dismiss { |
134 margin-left: 20px; | 179 margin-left: 20px; |
135 } | 180 } |
136 | 181 |
137 body:not([type='full-page']) .gdrive-welcome.page .gdrive-welcome-wrapper { | 182 body:not([type='full-page']) .gdrive-welcome.page .gdrive-welcome-wrapper { |
138 background-position: 0 0; | 183 background-position: 0 0; |
139 } | 184 } |
140 | 185 |
141 body:not([type='full-page']) .gdrive-welcome.page .gdrive-welcome-icon { | 186 body:not([type='full-page']) .gdrive-welcome.page .gdrive-welcome-icon { |
142 height: 200px; | 187 height: 200px; |
143 } | 188 } |
OLD | NEW |