blob: 626baa08f0f73126aa53739025c915e1ddf87486 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
|
/* Copyright (c) 2011 The Chromium Authors. All rights reserved.
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file.
*/
.tile-page {
height: 100%;
position: relative;
width: 100%;
}
.tile-page-scrollbar {
margin: 0 4px;
pointer-events: none;
position: absolute;
right: 0;
width: 5px;
z-index: 5;
-webkit-box-sizing: border-box;
}
.tile-page-content {
height: 100%;
overflow-y: scroll;
padding-top: 100px;
position: relative;
text-align: center;
width: 100%;
-webkit-mask-image: -webkit-linear-gradient(bottom, transparent, black 30px);
/* The following four properties are necessary so that the mask won't clip
* the scrollbar. */
box-sizing: border-box;
/* Scrollbar + balance right padding. */
padding-left: 26px;
/* Same width as the scrollbar. */
padding-right: 13px;
/* Don't apply clip mask to padding. */
-webkit-mask-clip: content-box;
}
.tile-page-title {
/* TODO(estade): title is hidden for now. We may remove it later. */
display: none;
font-size: 25px;
height: 50px;
}
.tile-grid {
overflow: hidden;
position: relative;
width: 100%;
}
.tile {
display: inline-block;
position: absolute;
/* Don't offer the context menu on long-press. */
-webkit-touch-callout: none;
-webkit-user-drag: element;
}
/* I don't know why this is necessary. -webkit-user-drag: element on .tile
* should be enough. If we don't do this, we get 2 drag representations for
* the image. */
.tile img {
-webkit-user-drag: none;
}
.doppleganger {
left: 0 !important;
top: 0 !important;
}
.tile.dragging {
opacity: 0;
}
.tile.drag-representation {
pointer-events: none;
position: fixed;
z-index: 3;
}
.tile.drag-representation.placing > * {
-webkit-transition: -webkit-transform 200ms;
}
.animating-tile-page .tile,
.tile.drag-representation.placing {
-webkit-transition: left 200ms, top 200ms;
}
.animating-tile-page .top-margin {
-webkit-transition: margin-bottom 200ms;
}
/** Scrollbars ****************************************************************/
.tile-page-content::-webkit-scrollbar {
width: 13px;
}
.tile-page-content::-webkit-scrollbar-button {
display: none;
}
|
