Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(594)

Side by Side Diff: chrome/browser/resources/ntp_search/tile_page.css

Issue 10867021: NTP5: Improving the Tile Page resize logic (Closed) Base URL: http://git.chromium.org/chromium/src.git@master
Patch Set: Resync'ing and rebasing Created 8 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* Copyright (c) 2012 The Chromium Authors. All rights reserved. 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 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 ----------------------------------------------------------------------------- */ 7 ----------------------------------------------------------------------------- */
8 8
9 #page-list { 9 #page-list {
10 padding-bottom: 10px; 10 padding-bottom: 10px;
(...skipping 15 matching lines...) Expand all
26 margin: 0 auto; 26 margin: 0 auto;
27 width: 732px; 27 width: 732px;
28 } 28 }
29 29
30 .tile-grid-content { 30 .tile-grid-content {
31 -webkit-transform: translate3d(0, 0, 0); 31 -webkit-transform: translate3d(0, 0, 0);
32 -webkit-transition: -webkit-transform 200ms; 32 -webkit-transition: -webkit-transform 200ms;
33 } 33 }
34 34
35 .tile-row { 35 .tile-row {
36 -webkit-transition: opacity 200ms ease-in-out; 36 -webkit-transition: opacity 200ms;
37 height: 105px; 37 height: 105px;
38 text-align: start; 38 text-align: start;
39 white-space: nowrap; 39 white-space: nowrap;
40 } 40 }
41 41
42 /* ----------------------------------------------------------------------------- 42 /* -----------------------------------------------------------------------------
43 Tile Grid Animation 43 Tile Grid Animation
44 ----------------------------------------------------------------------------- */ 44 ----------------------------------------------------------------------------- */
45 45
46 .animate-grid-width { 46 .animate-grid-width {
(...skipping 20 matching lines...) Expand all
67 67
68 .tile-cell:first-child { 68 .tile-cell:first-child {
69 -webkit-margin-start: 0; 69 -webkit-margin-start: 0;
70 } 70 }
71 71
72 /* ----------------------------------------------------------------------------- 72 /* -----------------------------------------------------------------------------
73 Tile Cell Animation 73 Tile Cell Animation
74 ----------------------------------------------------------------------------- */ 74 ----------------------------------------------------------------------------- */
75 75
76 .animate-grid-width .tile-cell { 76 .animate-grid-width .tile-cell {
77 -webkit-transition: margin 200ms ease-out; 77 -webkit-transition: margin 200ms;
78 -webkit-transition-property: margin, opacity, width; 78 -webkit-transition-property: margin, opacity, width;
79 } 79 }
80 80
81 /* Animates entire columns of Tiles at once.*/ 81 /* Animates entire columns of Tiles at once.*/
82 .hide-col-0 .tile-cell:nth-child(1), 82 .hide-col-0 .tile-cell:nth-child(1),
83 .hide-col-1 .tile-cell:nth-child(2), 83 .hide-col-1 .tile-cell:nth-child(2),
84 .hide-col-2 .tile-cell:nth-child(3), 84 .hide-col-2 .tile-cell:nth-child(3),
85 .hide-col-3 .tile-cell:nth-child(4), 85 .hide-col-3 .tile-cell:nth-child(4),
86 .hide-col-4 .tile-cell:nth-child(5), 86 .hide-col-4 .tile-cell:nth-child(5),
87 .hide-col-5 .tile-cell:nth-child(6), 87 .hide-col-5 .tile-cell:nth-child(6),
88 .hide-col-6 .tile-cell:nth-child(7), 88 .hide-col-6 .tile-cell:nth-child(7),
89 .hide-col-7 .tile-cell:nth-child(8), 89 .hide-col-7 .tile-cell:nth-child(8),
90 .hide-col-8 .tile-cell:nth-child(9), 90 .hide-col-8 .tile-cell:nth-child(9),
91 .hide-col-9 .tile-cell:nth-child(10) { 91 .hide-col-9 .tile-cell:nth-child(10) {
92 -webkit-margin-end: -10px; 92 -webkit-margin-end: -10px;
93 opacity: 0; 93 opacity: 0;
94 width: 10px !important; 94 width: 10px !important;
95 } 95 }
96 96
97 .hide-row { 97 .hide-row {
98 opacity: 0; 98 opacity: 0;
99 } 99 }
100 100
101 .tile-grid .hide-row .tile-cell { 101 .tile-grid .hide-row .tile-cell {
102 opacity: 1; 102 opacity: 1;
103 } 103 }
OLDNEW
« no previous file with comments | « chrome/browser/resources/ntp_search/thumbnail_page.css ('k') | chrome/browser/resources/ntp_search/tile_page.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698