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