apps_page.css revision c2e0dbddbe15c98d52c4786dac06cb8952a8ae6d 
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.app {
6  outline: none;
7  position: absolute;
8  text-align: center;
9}
10
11.app-contents {
12  -webkit-transition: -webkit-transform 100ms;
13}
14
15.app-contents:active:not(.suppress-active),
16.app:not(.click-focus):focus .app-contents:not(.suppress-active),
17.drag-representation:not(.placing) .app-contents {
18  -webkit-transform: scale(1.1);
19}
20
21/* Don't animate the initial scaling.  */
22.app-contents:active:not(.suppress-active),
23/* Active gets applied right before .suppress-active, so to avoid flicker
24 * we need to make the scale go back to normal without an animation. */
25.app-contents.suppress-active {
26  -webkit-transition-duration: 0;
27}
28
29.app-contents > span {
30  display: block;
31  overflow: hidden;
32  text-overflow: ellipsis;
33  white-space: nowrap;
34}
35
36.app-img-container {
37  /* -webkit-mask-image set by JavaScript to the image source. */
38  -webkit-mask-size: 100% 100%;
39  margin-left: auto;
40  margin-right: auto;
41}
42
43.app-img-container > * {
44  height: 100%;
45  width: 100%;
46}
47
48.app-icon-div {
49  -webkit-box-align: center;
50  -webkit-box-pack: center;
51  background-color: white;
52  border: 1px solid #d5d5d5;
53  border-radius: 5px;
54  display: -webkit-box;
55  margin-left: auto;
56  margin-right: auto;
57  position: relative;
58  vertical-align: middle;
59  z-index: 0;
60}
61
62.app-icon-div .app-img-container {
63  bottom: 10px;
64  left: 10px;
65  position: absolute;
66}
67
68.app-icon-div .color-stripe {
69  border-bottom-left-radius: 5px 5px;
70  border-bottom-right-radius: 5px 5px;
71  bottom: 0;
72  height: 3px;
73  opacity: 1.0;
74  position: absolute;
75  width: 100%;
76  z-index: 100;
77}
78
79.app-context-menu > button:first-child {
80  font-weight: bold;
81}
82
83.app-context-menu {
84  z-index: 1000;
85}
86
87.app-context-menu > [checked]::before {
88  height: 5px;
89}
90
91.launch-click-target {
92  cursor: pointer;
93}
94
95.app-img-container > img:first-child {
96  display: block;
97}
98
99.app .invisible {
100  visibility: hidden;
101}
102
103#app-launcher-promo {
104  background-color: white;
105  border: 1px solid lightgray;
106  border-bottom-width: 3px;
107  border-radius: 2px;
108  border-top-width: 2px;
109  bottom: 90px;
110  font-family: Arial, Helvetica, sans-serif;
111  height: 120px;
112  left: 50%;
113  margin-left: -300px;
114  position: fixed;
115  width: 600px;
116}
117
118#app-launcher-promo > .close-button {
119  position: absolute;
120  right: 10px;
121  top: 10px;
122  width: 14px;
123}
124
125.apps-promo-text {
126  color: #222;
127  font-size: 16px;
128  left: 30px;
129  line-height: 24px;
130  position: absolute;
131  top: 30px;
132}
133
134.apps-promo-learn-more {
135  background-color: rgb(77, 144, 254);
136  border: 1px solid rgb(47, 91, 183);
137  border-radius: 2px;
138  color: white;
139  cursor: default;
140  font-size: 11px;
141  font-weight: bold;
142  height: 27px;
143  left: 30px;
144  line-height: 27px;
145  padding: 0 8px;
146  position: absolute;
147  text-align: center;
148  text-decoration: none;
149  top: 70px;
150  width: 90px;
151}
152
153.apps-promo-learn-more:hover {
154  background-image: -webkit-linear-gradient(
155      top, rgb(77, 144, 254), rgb(53, 122, 232));
156  border: 1px solid rgb(47, 91, 183);
157}
158
159#app-launcher-promo > img {
160  bottom: 0;
161  position: absolute;
162  right: 30px;
163}
164