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 /* ----------------------------------------------------------------------------- | |
6 Thumbnail Cell and Tile | |
7 ----------------------------------------------------------------------------- */ | |
8 | |
9 .thumbnail-page .tile-cell { | |
10 -webkit-margin-start: 12px; | |
11 height: 68px; | |
12 margin-bottom: 12px; | |
13 width: 110px; | |
14 } | |
15 | |
16 .thumbnail-page .tile { | |
17 background: #fff; | |
18 border: 1px solid rgb(192, 192, 192); | |
19 border-radius: 2px; | |
20 box-shadow: 0 1px 0 rgba(255, 255, 255, .7); | |
21 display: block; | |
22 height: 66px; | |
23 outline: none; /* Avoids outline glitch when blacklisting a thumbnail. */ | |
24 position: absolute; | |
25 width: 108px; | |
26 } | |
27 | |
28 .thumbnail-page .tile:hover, | |
29 .thumbnail-page .tile:hover .thumbnail-card { | |
30 /* TODO(pedrosimonetti): Confirm value with Marcin. */ | |
31 border-color: rgb(127, 127, 127); | |
32 } | |
33 | |
34 .thumbnail-page .tile-cell.filler .tile { | |
35 background: -webkit-linear-gradient(rgb(242, 242, 242), rgb(232, 232, 232)); | |
36 border-color: rgb(224, 224, 224); | |
37 border-radius: 3px; | |
38 box-shadow: inset 0 2px 3px rgba(0, 0, 0, .09); | |
39 } | |
40 | |
41 /* ----------------------------------------------------------------------------- | |
42 Thumbnail | |
43 ----------------------------------------------------------------------------- */ | |
44 | |
45 .thumbnail .thumbnail-image { | |
46 /* These values are equivalent to background-size: 100%. | |
47 TODO(jeremycho): Resolve the discrepancy with the cell dimensions above. */ | |
48 background-size: 110px 68px; | |
49 } | |
50 | |
51 .thumbnail .title, | |
52 .thumbnail-banner { | |
53 color: #777; | |
54 font-size: 0.9167em; | |
55 overflow: hidden; | |
56 position: absolute; | |
57 text-align: center; | |
58 text-overflow: ellipsis; | |
59 white-space: nowrap; | |
60 width: 100%; | |
61 } | |
62 | |
63 .thumbnail .title { | |
64 bottom: -26px; | |
65 } | |
66 | |
67 .thumbnail-banner { | |
68 bottom: 25px; | |
69 display: block; | |
70 font-size: 1.14em; | |
71 margin: 0 7px; | |
72 width: 88%; | |
73 } | |
74 | |
75 .thumbnail, | |
76 .thumbnail-wrapper, | |
77 .thumbnail-card { | |
78 -webkit-background-clip: padding-box; | |
79 } | |
80 | |
81 .thumbnail-wrapper { | |
82 display: block; | |
83 height: 100%; | |
84 overflow: hidden; | |
85 width: 100%; | |
86 } | |
87 | |
88 .thumbnail-favicon { | |
89 height: 16px; | |
90 margin: 0 auto; | |
91 position: relative; | |
92 top: -8px; | |
93 width: 16px; | |
94 } | |
95 | |
96 .thumbnail-card { | |
97 /* This gives a 3px offset between consecutive thumbnails on the stack and | |
98 should be kept in sync with RecentlyClosed's STACK_OFFSET. */ | |
99 -webkit-margin-start: -129px; | |
100 border: 1px solid silver; | |
101 border-radius: 2px; | |
102 display: inline-block; | |
103 height: 100%; | |
104 margin-top: -1px; | |
105 position: relative; | |
106 width: 100%; | |
107 } | |
108 | |
109 .thumbnail-card:first-child { | |
110 -webkit-margin-start: -1px; | |
111 } | |
OLD | NEW |