OLD | NEW |
1 /* Copyright (c) 2011 The Chromium Authors. All rights reserved. | 1 /* Copyright (c) 2011 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 | 5 |
6 .app { | 6 .app { |
7 position: absolute; | 7 position: absolute; |
8 text-align: center; | 8 text-align: center; |
9 -webkit-transition: -webkit-transform 0.1s; | 9 -webkit-transition: -webkit-transform 0.1s; |
10 } | 10 } |
11 | 11 |
12 .app:active, | 12 .app:active, |
13 .dragging .app, | 13 .dragging .app, |
14 .drag-representation .app { | 14 .drag-representation .app { |
15 /* Don't animate the initial scaling. */ | 15 /* Don't animate the initial scaling. */ |
16 -webkit-transition-duration: 0; | 16 -webkit-transition-duration: 0; |
17 -webkit-transform: scale(1.1); | 17 -webkit-transform: scale(1.1); |
18 } | 18 } |
19 | 19 |
20 .app-contents > span { | 20 .app-contents > span { |
21 cursor: pointer; | 21 cursor: pointer; |
22 display: block; | 22 display: block; |
23 overflow: hidden; | 23 overflow: hidden; |
24 text-decoration: none; | 24 text-decoration: none; |
25 text-overflow: ellipsis; | 25 text-overflow: ellipsis; |
26 white-space: nowrap; | 26 white-space: nowrap; |
27 } | 27 } |
28 | 28 |
29 .app-contents > img { | 29 .app-img-container { |
30 cursor: pointer; | 30 cursor: pointer; |
31 display: block; | |
32 margin-left: auto; | 31 margin-left: auto; |
33 margin-right: auto; | 32 margin-right: auto; |
34 /* -webkit-mask-image set by JavaScript to the image source */ | 33 /* -webkit-mask-image set by JavaScript to the image source */ |
35 -webkit-mask-size: 100% 100%; | 34 -webkit-mask-size: 100% 100%; |
36 } | 35 } |
37 | 36 |
| 37 .app-img-container > * { |
| 38 height: 100%; |
| 39 width: 100%; |
| 40 } |
| 41 |
38 .app-icon-div { | 42 .app-icon-div { |
39 /* TODO(gbillock): find a better style for this div. Better border color? */ | 43 /* TODO(gbillock): find a better style for this div. Better border color? */ |
40 border: 1px solid gray; | 44 border: 1px solid gray; |
41 border-radius: 4px; | 45 border-radius: 4px; |
42 cursor: pointer; | 46 cursor: pointer; |
43 display: -webkit-box; | 47 display: -webkit-box; |
44 /* 96px is the suggested "filled" icon size for Chrome apps */ | 48 /* 96px is the suggested "filled" icon size for Chrome apps */ |
45 height: 96px; | 49 height: 96px; |
46 margin-bottom: 15px; | 50 margin-bottom: 15px; |
47 margin-left: auto; | 51 margin-left: auto; |
(...skipping 13 matching lines...) Expand all Loading... |
61 z-index: 1000; | 65 z-index: 1000; |
62 } | 66 } |
63 | 67 |
64 /* Promo */ | 68 /* Promo */ |
65 /* Show the promo if the webstore has a promo and is the only app on the page. | 69 /* Show the promo if the webstore has a promo and is the only app on the page. |
66 */ | 70 */ |
67 .tile:only-of-type > .has-promo > .app-contents > span { | 71 .tile:only-of-type > .has-promo > .app-contents > span { |
68 display: none; | 72 display: none; |
69 } | 73 } |
70 | 74 |
| 75 .tile:only-of-type > .has-promo .app-img-container > .apps-promo-logo { |
| 76 display: block; |
| 77 } |
| 78 |
| 79 .apps-promo-logo { |
| 80 display: none; |
| 81 } |
| 82 |
| 83 .tile:only-of-type > .has-promo .app-img-container > img:first-child { |
| 84 display: none; |
| 85 } |
| 86 |
| 87 .app-img-container > img:first-child { |
| 88 display: block; |
| 89 } |
| 90 |
71 /* TODO(estade): animation? */ | 91 /* TODO(estade): animation? */ |
72 .tile:only-of-type > .has-promo > .apps-promo-extras { | 92 .tile:only-of-type > .has-promo > .apps-promo-extras { |
73 display: block; | 93 display: block; |
74 } | 94 } |
75 | 95 |
76 .apps-promo-extras { | 96 .apps-promo-extras { |
77 display: none; | 97 display: none; |
78 position: absolute; | 98 position: absolute; |
79 text-align: left; | 99 text-align: left; |
80 top: 0; | 100 top: 0; |
(...skipping 17 matching lines...) Expand all Loading... |
98 white-space: nowrap; | 118 white-space: nowrap; |
99 -webkit-border-image: url('../ntp/g-button-chocobo.png') 6 10 12 6; | 119 -webkit-border-image: url('../ntp/g-button-chocobo.png') 6 10 12 6; |
100 } | 120 } |
101 | 121 |
102 .apps-promo-hide { | 122 .apps-promo-hide { |
103 font-size: 90%; | 123 font-size: 90%; |
104 margin-top: 2px; | 124 margin-top: 2px; |
105 text-decoration: underline; | 125 text-decoration: underline; |
106 -webkit-margin-start: 5px; | 126 -webkit-margin-start: 5px; |
107 } | 127 } |
OLD | NEW |