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

Side by Side Diff: chrome/browser/resources/new_new_tab.css

Issue 1182001: Remove vendor specific CSS prefixes. (Closed)
Patch Set: ? Created 10 years, 9 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 html { 1 html {
2 /* This is needed because of chrome://theme/css/new_tab.css */ 2 /* This is needed because of chrome://theme/css/new_tab.css */
3 height: 100%; 3 height: 100%;
4 } 4 }
5 5
6 body { 6 body {
7 margin: 0; 7 margin: 0;
8 height: 100%; 8 height: 100%;
9 overflow: auto; 9 overflow: auto;
10 } 10 }
(...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after
68 68
69 .thumbnail, 69 .thumbnail,
70 .thumbnail-container > .title { 70 .thumbnail-container > .title {
71 width: 207px; /* natural size is 196 */ 71 width: 207px; /* natural size is 196 */
72 height: 129px; /* 136 */ 72 height: 129px; /* 136 */
73 -webkit-transition: width .15s, height .15s; 73 -webkit-transition: width .15s, height .15s;
74 } 74 }
75 75
76 .thumbnail-wrapper { 76 .thumbnail-wrapper {
77 display: block; 77 display: block;
78 -webkit-background-size: 212px 132px; 78 background-size: 212px 132px;
79 background: no-repeat 4px 4px; 79 background: no-repeat 4px 4px;
80 background-color: white; 80 background-color: white;
81 -webkit-border-radius: 5px; 81 border-radius: 5px;
82 -webkit-transition: -webkit-background-size .15s; 82 -webkit-transition: background-size .15s;
83 position: relative; 83 position: relative;
84 } 84 }
85 85
86 .filler * { 86 .filler * {
87 visibility: hidden; 87 visibility: hidden;
88 } 88 }
89 89
90 .filler { 90 .filler {
91 pointer-events: none; 91 pointer-events: none;
92 } 92 }
(...skipping 18 matching lines...) Expand all
111 display: -webkit-box; 111 display: -webkit-box;
112 -webkit-box-orient: horizontal; 112 -webkit-box-orient: horizontal;
113 -webkit-box-align: stretch; 113 -webkit-box-align: stretch;
114 padding: 3px; 114 padding: 3px;
115 padding-bottom: 0; 115 padding-bottom: 0;
116 height: 17px; /* 23 - 2 * 3 */ 116 height: 17px; /* 23 - 2 * 3 */
117 cursor: move; 117 cursor: move;
118 font-size: 100%; 118 font-size: 100%;
119 line-height: 17px; 119 line-height: 17px;
120 background: hsl(213, 54%, 95%); 120 background: hsl(213, 54%, 95%);
121 -webkit-border-top-left-radius: 4px; 121 border-top-left-radius: 4px;
122 -webkit-border-top-right-radius: 4px; 122 border-top-right-radius: 4px;
123 position: relative; 123 position: relative;
124 margin-top: 21px; 124 margin-top: 21px;
125 margin-bottom: -21px; 125 margin-bottom: -21px;
126 -webkit-transition: margin .15s, background .15s; 126 -webkit-transition: margin .15s, background .15s;
127 } 127 }
128 128
129 .edit-bar > * { 129 .edit-bar > * {
130 display: block; 130 display: block;
131 position: relative; 131 position: relative;
132 } 132 }
(...skipping 90 matching lines...) Expand 10 before | Expand all | Expand 10 after
223 padding: 0 3px; 223 padding: 0 3px;
224 opacity: 1; 224 opacity: 1;
225 -webkit-transition: opacity .15s, width .15s; 225 -webkit-transition: opacity .15s, width .15s;
226 color: black; 226 color: black;
227 } 227 }
228 228
229 .thumbnail-container > .title > div { 229 .thumbnail-container > .title > div {
230 white-space: nowrap; 230 white-space: nowrap;
231 overflow: hidden; 231 overflow: hidden;
232 text-overflow: ellipsis; 232 text-overflow: ellipsis;
233
234 background: no-repeat 0 50%; 233 background: no-repeat 0 50%;
235 -webkit-background-size: 16px; 234 background-size: 16px;
236 padding-left: 20px; /* we cannot use padding start here because even if we set 235 padding-left: 20px; /* we cannot use padding start here because even if we set
237 the direction we always want the icon on the same side 236 the direction we always want the icon on the same side
238 */ 237 */
239 padding-right: 0; 238 padding-right: 0;
240 } 239 }
241 240
242 html[dir=rtl] .thumbnail-container > .title > div { 241 html[dir=rtl] .thumbnail-container > .title > div {
243 background-position-x: 100%; 242 background-position-x: 100%;
244 padding-left: 0; 243 padding-left: 0;
245 padding-right: 20px; 244 padding-right: 20px;
246 text-align: right; 245 text-align: right;
247 } 246 }
248 247
249 .thumbnail { 248 .thumbnail {
250 border: 3px solid hsl(213, 63%, 93%); 249 border: 3px solid hsl(213, 63%, 93%);
251 padding: 1px; 250 padding: 1px;
252 -webkit-border-radius: 5px; 251 border-radius: 5px;
253 display: block; 252 display: block;
254 -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0); 253 -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0);
255 -webkit-transition: width .15s, height .15s, border-color .15s, 254 -webkit-transition: width .15s, height .15s, border-color .15s,
256 -webkit-border-radius .15s, -webkit-box-shadow .15s; 255 border-radius .15s, -webkit-box-shadow .15s;
257 } 256 }
258 257
259 .edit-mode-border { 258 .edit-mode-border {
260 -webkit-border-radius: 4px; 259 border-radius: 4px;
261 260
262 /* when dragged over we move this */ 261 /* when dragged over we move this */
263 position: relative; 262 position: relative;
264 -webkit-transition: top .15s, left .15s; 263 -webkit-transition: top .15s, left .15s;
265 } 264 }
266 265
267 .thumbnail-container:focus .thumbnail, 266 .thumbnail-container:focus .thumbnail,
268 .thumbnail-container:hover .thumbnail { 267 .thumbnail-container:hover .thumbnail {
269 border-color: hsl(213, 66%, 57%); 268 border-color: hsl(213, 66%, 57%);
270 -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0); 269 -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0);
(...skipping 54 matching lines...) Expand 10 before | Expand all | Expand 10 after
325 .fade-in { 324 .fade-in {
326 -webkit-animation: 'fade-in' .15s; 325 -webkit-animation: 'fade-in' .15s;
327 } 326 }
328 327
329 /* Notification */ 328 /* Notification */
330 329
331 #notification { 330 #notification {
332 position: relative; 331 position: relative;
333 background-color: hsl(52, 100%, 80%); 332 background-color: hsl(52, 100%, 80%);
334 border: 1px solid rgb(211, 211, 211); 333 border: 1px solid rgb(211, 211, 211);
335 -webkit-border-radius: 6px; 334 border-radius: 6px;
336 padding: 7px 15px; 335 padding: 7px 15px;
337 white-space: nowrap; 336 white-space: nowrap;
338 display: table; 337 display: table;
339 margin: -8px auto 5px auto; 338 margin: -8px auto 5px auto;
340 font-weight: bold; 339 font-weight: bold;
341 opacity: 0; 340 opacity: 0;
342 pointer-events: none; 341 pointer-events: none;
343 -webkit-transition: opacity .15s; 342 -webkit-transition: opacity .15s;
344 z-index: 1; 343 z-index: 1;
345 color: black; 344 color: black;
(...skipping 63 matching lines...) Expand 10 before | Expand all | Expand 10 after
409 408
410 .list > .thumbnail-container > .title > div { 409 .list > .thumbnail-container > .title > div {
411 text-decoration: none; 410 text-decoration: none;
412 color: rgb(6, 45, 117); 411 color: rgb(6, 45, 117);
413 } 412 }
414 413
415 .item { 414 .item {
416 background: no-repeat 0% 50%; 415 background: no-repeat 0% 50%;
417 padding: 2px; 416 padding: 2px;
418 padding-left: 18px; 417 padding-left: 18px;
419 -webkit-background-size: 16px; 418 background-size: 16px;
420 background-color: hsla(213, 63%, 93%, 0); 419 background-color: hsla(213, 63%, 93%, 0);
421 display: block; 420 display: block;
422 line-height: 20px; 421 line-height: 20px;
423 -webkit-box-sizing: border-box; 422 -webkit-box-sizing: border-box;
424 white-space: nowrap; 423 white-space: nowrap;
425 overflow: hidden; 424 overflow: hidden;
426 text-overflow: ellipsis; 425 text-overflow: ellipsis;
427 text-decoration: none; 426 text-decoration: none;
428 font-size: 100%; 427 font-size: 100%;
429 } 428 }
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
468 margin: 2px 0; 467 margin: 2px 0;
469 } 468 }
470 469
471 /* Made to look like a tooltip using vista/win7 look and feel. 470 /* Made to look like a tooltip using vista/win7 look and feel.
472 TODO(arv): Replace with -webkit-appearance once issue 17371 is fixed 471 TODO(arv): Replace with -webkit-appearance once issue 17371 is fixed
473 */ 472 */
474 #window-tooltip { 473 #window-tooltip {
475 color: #555; 474 color: #555;
476 pointer-events: none; 475 pointer-events: none;
477 border: 1px solid rgb(118, 118, 118); 476 border: 1px solid rgb(118, 118, 118);
478 -webkit-border-radius: 3px; 477 border-radius: 3px;
479 padding: 0px 3px; 478 padding: 0px 3px;
480 background: -webkit-gradient(linear, left top, left bottom, 479 background: -webkit-gradient(linear, left top, left bottom,
481 from(white), 480 from(white),
482 to(rgb(228, 229, 240))); 481 to(rgb(228, 229, 240)));
483 width: auto; 482 width: auto;
484 max-width: 300px; 483 max-width: 300px;
485 } 484 }
486 485
487 .hbox { 486 .hbox {
488 display: -webkit-box; 487 display: -webkit-box;
489 -webkit-box-orient: horizontal; 488 -webkit-box-orient: horizontal;
490 } 489 }
491 490
492 #recently-closed { 491 #recently-closed {
493 background-color: hsla(213, 60%, 92%, .4); 492 background-color: hsla(213, 60%, 92%, .4);
494 border: 1px solid hsl(213, 60%, 92%); 493 border: 1px solid hsl(213, 60%, 92%);
495 -webkit-border-radius: 5px; 494 border-radius: 5px;
496 padding: 5px 0px; 495 padding: 5px 0px;
497 white-space: nowrap; 496 white-space: nowrap;
498 overflow-x: hidden; 497 overflow-x: hidden;
499 } 498 }
500 499
501 #recently-closed > * { 500 #recently-closed > * {
502 display: inline-block; 501 display: inline-block;
503 max-width: 114px; /* Selected so that we can fit 5 items in EN-US */ 502 max-width: 114px; /* Selected so that we can fit 5 items in EN-US */
504 white-space: nowrap; 503 white-space: nowrap;
505 overflow: hidden; 504 overflow: hidden;
(...skipping 12 matching lines...) Expand all
518 } 517 }
519 518
520 .nav > a:after { 519 .nav > a:after {
521 content: '\00bb'; /* raque gets flipped automatically in rtl */ 520 content: '\00bb'; /* raque gets flipped automatically in rtl */
522 font-size: 115%; 521 font-size: 115%;
523 -webkit-padding-start: 2px; 522 -webkit-padding-start: 2px;
524 } 523 }
525 524
526 #sync-status { 525 #sync-status {
527 display: none; 526 display: none;
528 -webkit-border-radius: 6px; 527 border-radius: 6px;
529 padding: 5px 0; 528 padding: 5px 0;
530 margin: 10px 0; 529 margin: 10px 0;
531 white-space: nowrap; 530 white-space: nowrap;
532 overflow-x: hidden; 531 overflow-x: hidden;
533 } 532 }
534 533
535 #sync-status > * { 534 #sync-status > * {
536 display: inline-block; 535 display: inline-block;
537 max-width: none; 536 max-width: none;
538 white-space: nowrap; 537 white-space: nowrap;
(...skipping 206 matching lines...) Expand 10 before | Expand all | Expand 10 after
745 .hide-promo-line { 744 .hide-promo-line {
746 opacity: 0; 745 opacity: 0;
747 pointer-events: none; 746 pointer-events: none;
748 } 747 }
749 748
750 #promo-line { 749 #promo-line {
751 display: inline-block; 750 display: inline-block;
752 margin-bottom: 20px; 751 margin-bottom: 20px;
753 background-color: hsl(52, 100%, 80%); 752 background-color: hsl(52, 100%, 80%);
754 border: 1px solid rgb(211, 211, 211); 753 border: 1px solid rgb(211, 211, 211);
755 -webkit-border-radius: 6px; 754 border-radius: 6px;
756 padding: 7px 10px; 755 padding: 7px 10px;
757 white-space: nowrap; 756 white-space: nowrap;
758 text-align: center; 757 text-align: center;
759 vertical-align: middle; 758 vertical-align: middle;
760 color: black; 759 color: black;
761 -webkit-transition: opacity .15s; 760 -webkit-transition: opacity .15s;
762 } 761 }
763 762
764 #promo-line * { 763 #promo-line * {
765 font-weight: bold; 764 font-weight: bold;
(...skipping 52 matching lines...) Expand 10 before | Expand all | Expand 10 after
818 .thumbnail-container > .title { 817 .thumbnail-container > .title {
819 width: 150px; 818 width: 150px;
820 height: 93px; 819 height: 93px;
821 } 820 }
822 821
823 .thumbnail-container > .title { 822 .thumbnail-container > .title {
824 height: auto; 823 height: auto;
825 } 824 }
826 825
827 .thumbnail-wrapper { 826 .thumbnail-wrapper {
828 -webkit-background-size: 150px 93px; 827 background-size: 150px 93px;
829 } 828 }
830 829
831 .list > .thumbnail-container { 830 .list > .thumbnail-container {
832 max-width: 692px; 831 max-width: 692px;
833 } 832 }
834 833
835 #notification > * { 834 #notification > * {
836 max-width: 300px; 835 max-width: 300px;
837 } 836 }
838 837
839 #notification > span > .blacklist-title { 838 #notification > span > .blacklist-title {
840 max-width: 15ex; 839 max-width: 15ex;
841 } 840 }
842 } 841 }
OLDNEW
« no previous file with comments | « chrome/browser/resources/incognito_tab.html ('k') | chrome/browser/resources/safe_browsing_malware_block.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698