| 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 .tile-page { | 6 .tile-page { |
| 7 display: -webkit-box; | 7 display: -webkit-box; |
| 8 height: 100%; | 8 height: 100%; |
| 9 position: relative; | 9 position: relative; |
| 10 width: 100%; | 10 width: 100%; |
| (...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 71 } | 71 } |
| 72 | 72 |
| 73 .tile.dragging { | 73 .tile.dragging { |
| 74 opacity: 0; | 74 opacity: 0; |
| 75 } | 75 } |
| 76 | 76 |
| 77 .tile.drag-representation { | 77 .tile.drag-representation { |
| 78 pointer-events: none; | 78 pointer-events: none; |
| 79 position: fixed; | 79 position: fixed; |
| 80 z-index: 3; | 80 z-index: 3; |
| 81 -webkit-transition: opacity 0.2s; | 81 -webkit-transition: opacity 200ms; |
| 82 } | 82 } |
| 83 | 83 |
| 84 .tile.drag-representation.placing > * { | 84 .tile.drag-representation.placing > * { |
| 85 -webkit-transition: -webkit-transform 200ms; | 85 -webkit-transition: -webkit-transform 200ms; |
| 86 } | 86 } |
| 87 | 87 |
| 88 /* When a drag finishes while we're not showing the page where the tile | 88 /* When a drag finishes while we're not showing the page where the tile |
| 89 * belongs, the tile shrinks to a dot. */ | 89 * belongs, the tile shrinks to a dot. */ |
| 90 .tile.drag-representation.dropped-on-other-page > * { | 90 .tile.drag-representation.dropped-on-other-page > * { |
| 91 -webkit-transform: scale(0) rotate(0); | 91 -webkit-transform: scale(0) rotate(0); |
| (...skipping 25 matching lines...) Expand all Loading... |
| 117 60% { | 117 60% { |
| 118 -webkit-transform: scale(1.2, 1.2); | 118 -webkit-transform: scale(1.2, 1.2); |
| 119 } | 119 } |
| 120 | 120 |
| 121 100% { | 121 100% { |
| 122 -webkit-transform: scale(1, 1); | 122 -webkit-transform: scale(1, 1); |
| 123 } | 123 } |
| 124 } | 124 } |
| 125 | 125 |
| 126 .tile > .new-tile-contents { | 126 .tile > .new-tile-contents { |
| 127 -webkit-animation: bounce 0.5s ease-in-out; | 127 -webkit-animation: bounce 500ms ease-in-out; |
| 128 } | 128 } |
| 129 | 129 |
| 130 @-webkit-keyframes blipout { | 130 @-webkit-keyframes blipout { |
| 131 0% { | 131 0% { |
| 132 -webkit-transform: scale(1, 1); | 132 -webkit-transform: scale(1, 1); |
| 133 } | 133 } |
| 134 | 134 |
| 135 60% { | 135 60% { |
| 136 opacity: 1; | 136 opacity: 1; |
| 137 -webkit-animation-timing-function: ease-in; | 137 -webkit-animation-timing-function: ease-in; |
| 138 -webkit-transform: scale(1.3, 0.02); | 138 -webkit-transform: scale(1.3, 0.02); |
| 139 } | 139 } |
| 140 | 140 |
| 141 90% { | 141 90% { |
| 142 opacity: 0.7; | 142 opacity: 0.7; |
| 143 -webkit-animation-timing-function: default; | 143 -webkit-animation-timing-function: default; |
| 144 -webkit-transform: scale(0.3, 0.02); | 144 -webkit-transform: scale(0.3, 0.02); |
| 145 } | 145 } |
| 146 | 146 |
| 147 100% { | 147 100% { |
| 148 opacity: 0; | 148 opacity: 0; |
| 149 -webkit-animation-timing-function: linear; | 149 -webkit-animation-timing-function: linear; |
| 150 -webkit-transform: scale(0.3, 0.02); | 150 -webkit-transform: scale(0.3, 0.02); |
| 151 } | 151 } |
| 152 } | 152 } |
| 153 | 153 |
| 154 .tile > .removing-tile-contents { | 154 .tile > .removing-tile-contents { |
| 155 pointer-events: none; | 155 pointer-events: none; |
| 156 -webkit-animation: blipout 0.3s; | 156 -webkit-animation: blipout 300ms; |
| 157 } | 157 } |
| 158 | 158 |
| 159 .tile-page:not(.selected-card) * { | 159 .tile-page:not(.selected-card) * { |
| 160 -webkit-transition: none !important; | 160 -webkit-transition: none !important; |
| 161 } | 161 } |
| 162 | 162 |
| 163 /** Scrollbars ****************************************************************/ | 163 /** Scrollbars ****************************************************************/ |
| 164 | 164 |
| 165 .tile-page-content::-webkit-scrollbar { | 165 .tile-page-content::-webkit-scrollbar { |
| 166 width: 13px; | 166 width: 13px; |
| 167 } | 167 } |
| 168 | 168 |
| 169 .tile-page-content::-webkit-scrollbar-button { | 169 .tile-page-content::-webkit-scrollbar-button { |
| 170 display: none; | 170 display: none; |
| 171 } | 171 } |
| OLD | NEW |