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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: chrome/browser/resources/md_downloads/vulcanized.html

Issue 1462153007: MD Downloads: fix up some Polymer 1.2.3 issues and re-vulcanize (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@update-polymer
Patch Set: new patchset Created 5 years, 1 month 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
« no previous file with comments | « chrome/browser/resources/md_downloads/toolbar.css ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html><html i18n-values="dir:textdirection;lang:language"><head><script src="crisper.js" defer=""></script><!-- 1 <!DOCTYPE html><html i18n-values="dir:textdirection;lang:language"><head><!--
2 @license 2 @license
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. 3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also 7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 --><!-- 9 --><!--
10 @license 10 @license
11 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 11 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
(...skipping 319 matching lines...) Expand 10 before | Expand all | Expand 10 after
331 right: 0; 331 right: 0;
332 bottom: 0; 332 bottom: 0;
333 left: 0; 333 left: 0;
334 }; 334 };
335 335
336 --layout-scroll: { 336 --layout-scroll: {
337 -webkit-overflow-scrolling: touch; 337 -webkit-overflow-scrolling: touch;
338 overflow: auto; 338 overflow: auto;
339 }; 339 };
340 340
341 --layout-fullbleed: {
342 margin: 0;
343 height: 100vh;
344 }
345
341 /* fixed position */ 346 /* fixed position */
342 347
343 --layout-fixed-top: { 348 --layout-fixed-top: {
344 position: fixed; 349 position: fixed;
345 top: 0; 350 top: 0;
346 left: 0; 351 left: 0;
347 right: 0; 352 right: 0;
348 }; 353 };
349 354
350 --layout-fixed-right: { 355 --layout-fixed-right: {
(...skipping 15 matching lines...) Expand all
366 top: 0; 371 top: 0;
367 bottom: 0; 372 bottom: 0;
368 left: 0; 373 left: 0;
369 }; 374 };
370 375
371 } 376 }
372 377
373 </style> 378 </style>
374 379
375 380
381
382
376 <style is="custom-style"> 383 <style is="custom-style">
377 384
378 :root { 385 :root {
379 386
380 --shadow-transition: { 387 --shadow-transition: {
381 transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1); 388 transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
382 }; 389 };
383 390
384 --shadow-none: { 391 --shadow-none: {
385 box-shadow: none; 392 box-shadow: none;
(...skipping 345 matching lines...) Expand 10 before | Expand all | Expand 10 after
731 --paper-blue-grey-300: #90a4ae; 738 --paper-blue-grey-300: #90a4ae;
732 --paper-blue-grey-400: #78909c; 739 --paper-blue-grey-400: #78909c;
733 --paper-blue-grey-500: #607d8b; 740 --paper-blue-grey-500: #607d8b;
734 --paper-blue-grey-600: #546e7a; 741 --paper-blue-grey-600: #546e7a;
735 --paper-blue-grey-700: #455a64; 742 --paper-blue-grey-700: #455a64;
736 --paper-blue-grey-800: #37474f; 743 --paper-blue-grey-800: #37474f;
737 --paper-blue-grey-900: #263238; 744 --paper-blue-grey-900: #263238;
738 745
739 /* opacity for dark text on a light background */ 746 /* opacity for dark text on a light background */
740 --dark-divider-opacity: 0.12; 747 --dark-divider-opacity: 0.12;
741 --dark-disabled-opacity: 0.26; /* or hint text */ 748 --dark-disabled-opacity: 0.38; /* or hint text or icon */
742 --dark-secondary-opacity: 0.54; /* or icon */ 749 --dark-secondary-opacity: 0.54;
743 --dark-primary-opacity: 0.87; 750 --dark-primary-opacity: 0.87;
744 751
745 /* opacity for light text on a dark background */ 752 /* opacity for light text on a dark background */
746 --light-divider-opacity: 0.12; 753 --light-divider-opacity: 0.12;
747 --light-disabled-opacity: 0.3; /* or hint text */ 754 --light-disabled-opacity: 0.3; /* or hint text or icon */
748 --light-secondary-opacity: 0.7; /* or icon */ 755 --light-secondary-opacity: 0.7;
749 --light-primary-opacity: 1.0; 756 --light-primary-opacity: 1.0;
750 757
751 } 758 }
752 759
753 </style> 760 </style>
754 761
755 762
756 <style>
757
758 /*******************************
759 Flex Layout
760 *******************************/
761
762 html /deep/ .layout.horizontal,
763 html /deep/ .layout.horizontal-reverse,
764 html /deep/ .layout.vertical,
765 html /deep/ .layout.vertical-reverse {
766 display: -ms-flexbox;
767 display: -webkit-flex;
768 display: flex;
769 }
770
771 html /deep/ .layout.inline {
772 display: -ms-inline-flexbox;
773 display: -webkit-inline-flex;
774 display: inline-flex;
775 }
776
777 html /deep/ .layout.horizontal {
778 -ms-flex-direction: row;
779 -webkit-flex-direction: row;
780 flex-direction: row;
781 }
782
783 html /deep/ .layout.horizontal-reverse {
784 -ms-flex-direction: row-reverse;
785 -webkit-flex-direction: row-reverse;
786 flex-direction: row-reverse;
787 }
788
789 html /deep/ .layout.vertical {
790 -ms-flex-direction: column;
791 -webkit-flex-direction: column;
792 flex-direction: column;
793 }
794
795 html /deep/ .layout.vertical-reverse {
796 -ms-flex-direction: column-reverse;
797 -webkit-flex-direction: column-reverse;
798 flex-direction: column-reverse;
799 }
800
801 html /deep/ .layout.wrap {
802 -ms-flex-wrap: wrap;
803 -webkit-flex-wrap: wrap;
804 flex-wrap: wrap;
805 }
806
807 html /deep/ .layout.wrap-reverse {
808 -ms-flex-wrap: wrap-reverse;
809 -webkit-flex-wrap: wrap-reverse;
810 flex-wrap: wrap-reverse;
811 }
812
813 html /deep/ .flex-auto {
814 -ms-flex: 1 1 auto;
815 -webkit-flex: 1 1 auto;
816 flex: 1 1 auto;
817 }
818
819 html /deep/ .flex-none {
820 -ms-flex: none;
821 -webkit-flex: none;
822 flex: none;
823 }
824
825 html /deep/ .flex,
826 html /deep/ .flex-1 {
827 -ms-flex: 1;
828 -webkit-flex: 1;
829 flex: 1;
830 }
831
832 html /deep/ .flex-2 {
833 -ms-flex: 2;
834 -webkit-flex: 2;
835 flex: 2;
836 }
837
838 html /deep/ .flex-3 {
839 -ms-flex: 3;
840 -webkit-flex: 3;
841 flex: 3;
842 }
843
844 html /deep/ .flex-4 {
845 -ms-flex: 4;
846 -webkit-flex: 4;
847 flex: 4;
848 }
849
850 html /deep/ .flex-5 {
851 -ms-flex: 5;
852 -webkit-flex: 5;
853 flex: 5;
854 }
855
856 html /deep/ .flex-6 {
857 -ms-flex: 6;
858 -webkit-flex: 6;
859 flex: 6;
860 }
861
862 html /deep/ .flex-7 {
863 -ms-flex: 7;
864 -webkit-flex: 7;
865 flex: 7;
866 }
867
868 html /deep/ .flex-8 {
869 -ms-flex: 8;
870 -webkit-flex: 8;
871 flex: 8;
872 }
873
874 html /deep/ .flex-9 {
875 -ms-flex: 9;
876 -webkit-flex: 9;
877 flex: 9;
878 }
879
880 html /deep/ .flex-10 {
881 -ms-flex: 10;
882 -webkit-flex: 10;
883 flex: 10;
884 }
885
886 html /deep/ .flex-11 {
887 -ms-flex: 11;
888 -webkit-flex: 11;
889 flex: 11;
890 }
891
892 html /deep/ .flex-12 {
893 -ms-flex: 12;
894 -webkit-flex: 12;
895 flex: 12;
896 }
897
898 /* alignment in cross axis */
899
900 html /deep/ .layout.start {
901 -ms-flex-align: start;
902 -webkit-align-items: flex-start;
903 align-items: flex-start;
904 }
905
906 html /deep/ .layout.center,
907 html /deep/ .layout.center-center {
908 -ms-flex-align: center;
909 -webkit-align-items: center;
910 align-items: center;
911 }
912
913 html /deep/ .layout.end {
914 -ms-flex-align: end;
915 -webkit-align-items: flex-end;
916 align-items: flex-end;
917 }
918
919 /* alignment in main axis */
920
921 html /deep/ .layout.start-justified {
922 -ms-flex-pack: start;
923 -webkit-justify-content: flex-start;
924 justify-content: flex-start;
925 }
926
927 html /deep/ .layout.center-justified,
928 html /deep/ .layout.center-center {
929 -ms-flex-pack: center;
930 -webkit-justify-content: center;
931 justify-content: center;
932 }
933
934 html /deep/ .layout.end-justified {
935 -ms-flex-pack: end;
936 -webkit-justify-content: flex-end;
937 justify-content: flex-end;
938 }
939
940 html /deep/ .layout.around-justified {
941 -ms-flex-pack: around;
942 -webkit-justify-content: space-around;
943 justify-content: space-around;
944 }
945
946 html /deep/ .layout.justified {
947 -ms-flex-pack: justify;
948 -webkit-justify-content: space-between;
949 justify-content: space-between;
950 }
951
952 /* self alignment */
953
954 html /deep/ .self-start {
955 -ms-align-self: flex-start;
956 -webkit-align-self: flex-start;
957 align-self: flex-start;
958 }
959
960 html /deep/ .self-center {
961 -ms-align-self: center;
962 -webkit-align-self: center;
963 align-self: center;
964 }
965
966 html /deep/ .self-end {
967 -ms-align-self: flex-end;
968 -webkit-align-self: flex-end;
969 align-self: flex-end;
970 }
971
972 html /deep/ .self-stretch {
973 -ms-align-self: stretch;
974 -webkit-align-self: stretch;
975 align-self: stretch;
976 }
977
978 /*******************************
979 Other Layout
980 *******************************/
981
982 html /deep/ .block {
983 display: block;
984 }
985
986 /* IE 10 support for HTML5 hidden attr */
987 html /deep/ [hidden] {
988 display: none !important;
989 }
990
991 html /deep/ .invisible {
992 visibility: hidden !important;
993 }
994
995 html /deep/ .relative {
996 position: relative;
997 }
998
999 html /deep/ .fit {
1000 position: absolute;
1001 top: 0;
1002 right: 0;
1003 bottom: 0;
1004 left: 0;
1005 }
1006
1007 body.fullbleed {
1008 margin: 0;
1009 height: 100vh;
1010 }
1011
1012 html /deep/ .scroll {
1013 -webkit-overflow-scrolling: touch;
1014 overflow: auto;
1015 }
1016
1017 .fixed-bottom,
1018 .fixed-left,
1019 .fixed-right,
1020 .fixed-top {
1021 position: fixed;
1022 }
1023
1024 html /deep/ .fixed-top {
1025 top: 0;
1026 left: 0;
1027 right: 0;
1028 }
1029
1030 html /deep/ .fixed-right {
1031 top: 0;
1032 right: 0;
1033 botttom: 0;
1034 }
1035
1036 html /deep/ .fixed-bottom {
1037 right: 0;
1038 bottom: 0;
1039 left: 0;
1040 }
1041
1042 html /deep/ .fixed-left {
1043 top: 0;
1044 botttom: 0;
1045 left: 0;
1046 }
1047
1048 </style>
1049 <style>
1050
1051 /*******************************
1052 Flex Layout
1053 *******************************/
1054
1055 .layout.horizontal,
1056 .layout.horizontal-reverse,
1057 .layout.vertical,
1058 .layout.vertical-reverse {
1059 display: -ms-flexbox;
1060 display: -webkit-flex;
1061 display: flex;
1062 }
1063
1064 .layout.inline {
1065 display: -ms-inline-flexbox;
1066 display: -webkit-inline-flex;
1067 display: inline-flex;
1068 }
1069
1070 .layout.horizontal {
1071 -ms-flex-direction: row;
1072 -webkit-flex-direction: row;
1073 flex-direction: row;
1074 }
1075
1076 .layout.horizontal-reverse {
1077 -ms-flex-direction: row-reverse;
1078 -webkit-flex-direction: row-reverse;
1079 flex-direction: row-reverse;
1080 }
1081
1082 .layout.vertical {
1083 -ms-flex-direction: column;
1084 -webkit-flex-direction: column;
1085 flex-direction: column;
1086 }
1087
1088 .layout.vertical-reverse {
1089 -ms-flex-direction: column-reverse;
1090 -webkit-flex-direction: column-reverse;
1091 flex-direction: column-reverse;
1092 }
1093
1094 .layout.wrap {
1095 -ms-flex-wrap: wrap;
1096 -webkit-flex-wrap: wrap;
1097 flex-wrap: wrap;
1098 }
1099
1100 .layout.wrap-reverse {
1101 -ms-flex-wrap: wrap-reverse;
1102 -webkit-flex-wrap: wrap-reverse;
1103 flex-wrap: wrap-reverse;
1104 }
1105
1106 .flex-auto {
1107 -ms-flex: 1 1 auto;
1108 -webkit-flex: 1 1 auto;
1109 flex: 1 1 auto;
1110 }
1111
1112 .flex-none {
1113 -ms-flex: none;
1114 -webkit-flex: none;
1115 flex: none;
1116 }
1117
1118 .flex,
1119 .flex-1 {
1120 -ms-flex: 1;
1121 -webkit-flex: 1;
1122 flex: 1;
1123 }
1124
1125 .flex-2 {
1126 -ms-flex: 2;
1127 -webkit-flex: 2;
1128 flex: 2;
1129 }
1130
1131 .flex-3 {
1132 -ms-flex: 3;
1133 -webkit-flex: 3;
1134 flex: 3;
1135 }
1136
1137 .flex-4 {
1138 -ms-flex: 4;
1139 -webkit-flex: 4;
1140 flex: 4;
1141 }
1142
1143 .flex-5 {
1144 -ms-flex: 5;
1145 -webkit-flex: 5;
1146 flex: 5;
1147 }
1148
1149 .flex-6 {
1150 -ms-flex: 6;
1151 -webkit-flex: 6;
1152 flex: 6;
1153 }
1154
1155 .flex-7 {
1156 -ms-flex: 7;
1157 -webkit-flex: 7;
1158 flex: 7;
1159 }
1160
1161 .flex-8 {
1162 -ms-flex: 8;
1163 -webkit-flex: 8;
1164 flex: 8;
1165 }
1166
1167 .flex-9 {
1168 -ms-flex: 9;
1169 -webkit-flex: 9;
1170 flex: 9;
1171 }
1172
1173 .flex-10 {
1174 -ms-flex: 10;
1175 -webkit-flex: 10;
1176 flex: 10;
1177 }
1178
1179 .flex-11 {
1180 -ms-flex: 11;
1181 -webkit-flex: 11;
1182 flex: 11;
1183 }
1184
1185 .flex-12 {
1186 -ms-flex: 12;
1187 -webkit-flex: 12;
1188 flex: 12;
1189 }
1190
1191 /* alignment in cross axis */
1192
1193 .layout.start {
1194 -ms-flex-align: start;
1195 -webkit-align-items: flex-start;
1196 align-items: flex-start;
1197 }
1198
1199 .layout.center,
1200 .layout.center-center {
1201 -ms-flex-align: center;
1202 -webkit-align-items: center;
1203 align-items: center;
1204 }
1205
1206 .layout.end {
1207 -ms-flex-align: end;
1208 -webkit-align-items: flex-end;
1209 align-items: flex-end;
1210 }
1211
1212 /* alignment in main axis */
1213
1214 .layout.start-justified {
1215 -ms-flex-pack: start;
1216 -webkit-justify-content: flex-start;
1217 justify-content: flex-start;
1218 }
1219
1220 .layout.center-justified,
1221 .layout.center-center {
1222 -ms-flex-pack: center;
1223 -webkit-justify-content: center;
1224 justify-content: center;
1225 }
1226
1227 .layout.end-justified {
1228 -ms-flex-pack: end;
1229 -webkit-justify-content: flex-end;
1230 justify-content: flex-end;
1231 }
1232
1233 .layout.around-justified {
1234 -ms-flex-pack: around;
1235 -webkit-justify-content: space-around;
1236 justify-content: space-around;
1237 }
1238
1239 .layout.justified {
1240 -ms-flex-pack: justify;
1241 -webkit-justify-content: space-between;
1242 justify-content: space-between;
1243 }
1244
1245 /* self alignment */
1246
1247 .self-start {
1248 -ms-align-self: flex-start;
1249 -webkit-align-self: flex-start;
1250 align-self: flex-start;
1251 }
1252
1253 .self-center {
1254 -ms-align-self: center;
1255 -webkit-align-self: center;
1256 align-self: center;
1257 }
1258
1259 .self-end {
1260 -ms-align-self: flex-end;
1261 -webkit-align-self: flex-end;
1262 align-self: flex-end;
1263 }
1264
1265 .self-stretch {
1266 -ms-align-self: stretch;
1267 -webkit-align-self: stretch;
1268 align-self: stretch;
1269 }
1270
1271 /*******************************
1272 Other Layout
1273 *******************************/
1274
1275 .block {
1276 display: block;
1277 }
1278
1279 /* IE 10 support for HTML5 hidden attr */
1280 [hidden] {
1281 display: none !important;
1282 }
1283
1284 .invisible {
1285 visibility: hidden !important;
1286 }
1287
1288 .relative {
1289 position: relative;
1290 }
1291
1292 .fit {
1293 position: absolute;
1294 top: 0;
1295 right: 0;
1296 bottom: 0;
1297 left: 0;
1298 }
1299
1300 body.fullbleed {
1301 margin: 0;
1302 height: 100vh;
1303 }
1304
1305 .scroll {
1306 -webkit-overflow-scrolling: touch;
1307 overflow: auto;
1308 }
1309
1310 /* fixed position */
1311
1312 .fixed-bottom,
1313 .fixed-left,
1314 .fixed-right,
1315 .fixed-top {
1316 position: fixed;
1317 }
1318
1319 .fixed-top {
1320 top: 0;
1321 left: 0;
1322 right: 0;
1323 }
1324
1325 .fixed-right {
1326 top: 0;
1327 right: 0;
1328 bottom: 0;
1329 }
1330
1331 .fixed-bottom {
1332 right: 0;
1333 bottom: 0;
1334 left: 0;
1335 }
1336
1337 .fixed-left {
1338 top: 0;
1339 bottom: 0;
1340 left: 0;
1341 }
1342
1343 </style>
1344 <style is="custom-style"> 763 <style is="custom-style">
1345 764
1346 :root { 765 :root {
1347 766
1348 --dark-primary-color: #303f9f; 767 --dark-primary-color: #303f9f;
1349 768
1350 --default-primary-color: #3f51b5; 769 --default-primary-color: #3f51b5;
1351 770
1352 --light-primary-color: #c5cae9; 771 --light-primary-color: #c5cae9;
1353 772
1354 --text-primary-color: #ffffff; 773 --text-primary-color: #ffffff;
1355 774
1356 --accent-color: #ff4081; 775 --accent-color: #ff4081;
1357 776
1358 --primary-background-color: #ffffff; 777 --primary-background-color: #ffffff;
1359 778
1360 --primary-text-color: #212121; 779 --primary-text-color: #212121;
1361 780
1362 --secondary-text-color: #757575; 781 --secondary-text-color: #757575;
1363 782
1364 --disabled-text-color: #bdbdbd; 783 --disabled-text-color: #bdbdbd;
1365 784
1366 --divider-color: #e0e0e0; 785 --divider-color: #e0e0e0;
1367 786
1368 } 787 }
1369 788
1370 </style> 789 </style>
790
791
792
793
794
795
796
797
1371 <style> 798 <style>
1372 /* Copyright 2015 The Chromium Authors. All rights reserved. 799 /* Copyright 2015 The Chromium Authors. All rights reserved.
1373 * Use of this source code is governed by a BSD-style license that can be 800 * Use of this source code is governed by a BSD-style license that can be
1374 * found in the LICENSE file. */ 801 * found in the LICENSE file. */
1375 802
1376 @font-face { 803 @font-face {
1377 font-family: 'Roboto'; 804 font-family: 'Roboto';
1378 font-style: normal; 805 font-style: normal;
1379 font-weight: 400; 806 font-weight: 400;
1380 src: local('Roboto'), local('Roboto-Regular'), 807 src: local('Roboto'), local('Roboto-Regular'),
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
1419 overflow: hidden; 846 overflow: hidden;
1420 text-overflow: ellipsis; 847 text-overflow: ellipsis;
1421 }; 848 };
1422 849
1423 /* Material Font Styles */ 850 /* Material Font Styles */
1424 851
1425 --paper-font-display4: { 852 --paper-font-display4: {
1426 /* @apply(--paper-font-common-base) */ 853 /* @apply(--paper-font-common-base) */
1427 font-family: 'Roboto', 'Noto', sans-serif; 854 font-family: 'Roboto', 'Noto', sans-serif;
1428 -webkit-font-smoothing: antialiased; 855 -webkit-font-smoothing: antialiased;
1429 /* @apply(--paper-font-common-expensive-kerning); */ 856
1430 text-rendering: optimizeLegibility;
1431 /* @apply(--paper-font-common-nowrap); */ 857 /* @apply(--paper-font-common-nowrap); */
1432 white-space: nowrap; 858 white-space: nowrap;
1433 overflow: hidden; 859 overflow: hidden;
1434 text-overflow: ellipsis; 860 text-overflow: ellipsis;
1435 861
1436 font-size: 112px; 862 font-size: 112px;
1437 font-weight: 300; 863 font-weight: 300;
1438 letter-spacing: -.044em; 864 letter-spacing: -.044em;
1439 line-height: 120px; 865 line-height: 120px;
1440 }; 866 };
1441 867
1442 --paper-font-display3: { 868 --paper-font-display3: {
1443 /* @apply(--paper-font-common-base) */ 869 /* @apply(--paper-font-common-base) */
1444 font-family: 'Roboto', 'Noto', sans-serif; 870 font-family: 'Roboto', 'Noto', sans-serif;
1445 -webkit-font-smoothing: antialiased; 871 -webkit-font-smoothing: antialiased;
1446 /* @apply(--paper-font-common-expensive-kerning); */ 872
1447 text-rendering: optimizeLegibility;
1448 /* @apply(--paper-font-common-nowrap); */ 873 /* @apply(--paper-font-common-nowrap); */
1449 white-space: nowrap; 874 white-space: nowrap;
1450 overflow: hidden; 875 overflow: hidden;
1451 text-overflow: ellipsis; 876 text-overflow: ellipsis;
1452 877
1453 font-size: 56px; 878 font-size: 56px;
1454 font-weight: 400; 879 font-weight: 400;
1455 letter-spacing: -.026em; 880 letter-spacing: -.026em;
1456 line-height: 60px; 881 line-height: 60px;
1457 }; 882 };
1458 883
1459 --paper-font-display2: { 884 --paper-font-display2: {
1460 /* @apply(--paper-font-common-base) */ 885 /* @apply(--paper-font-common-base) */
1461 font-family: 'Roboto', 'Noto', sans-serif; 886 font-family: 'Roboto', 'Noto', sans-serif;
1462 -webkit-font-smoothing: antialiased; 887 -webkit-font-smoothing: antialiased;
1463 /* @apply(--paper-font-common-expensive-kerning); */ 888
1464 text-rendering: optimizeLegibility;
1465 889
1466 font-size: 45px; 890 font-size: 45px;
1467 font-weight: 400; 891 font-weight: 400;
1468 letter-spacing: -.018em; 892 letter-spacing: -.018em;
1469 line-height: 48px; 893 line-height: 48px;
1470 }; 894 };
1471 895
1472 --paper-font-display1: { 896 --paper-font-display1: {
1473 /* @apply(--paper-font-common-base) */ 897 /* @apply(--paper-font-common-base) */
1474 font-family: 'Roboto', 'Noto', sans-serif; 898 font-family: 'Roboto', 'Noto', sans-serif;
1475 -webkit-font-smoothing: antialiased; 899 -webkit-font-smoothing: antialiased;
1476 /* @apply(--paper-font-common-expensive-kerning); */ 900
1477 text-rendering: optimizeLegibility;
1478 901
1479 font-size: 34px; 902 font-size: 34px;
1480 font-weight: 400; 903 font-weight: 400;
1481 letter-spacing: -.01em; 904 letter-spacing: -.01em;
1482 line-height: 40px; 905 line-height: 40px;
1483 }; 906 };
1484 907
1485 --paper-font-headline: { 908 --paper-font-headline: {
1486 /* @apply(--paper-font-common-base) */ 909 /* @apply(--paper-font-common-base) */
1487 font-family: 'Roboto', 'Noto', sans-serif; 910 font-family: 'Roboto', 'Noto', sans-serif;
1488 -webkit-font-smoothing: antialiased; 911 -webkit-font-smoothing: antialiased;
1489 /* @apply(--paper-font-common-expensive-kerning); */ 912
1490 text-rendering: optimizeLegibility;
1491 913
1492 font-size: 24px; 914 font-size: 24px;
1493 font-weight: 400; 915 font-weight: 400;
1494 letter-spacing: -.012em; 916 letter-spacing: -.012em;
1495 line-height: 32px; 917 line-height: 32px;
1496 }; 918 };
1497 919
1498 --paper-font-title: { 920 --paper-font-title: {
1499 /* @apply(--paper-font-common-base) */ 921 /* @apply(--paper-font-common-base) */
1500 font-family: 'Roboto', 'Noto', sans-serif; 922 font-family: 'Roboto', 'Noto', sans-serif;
1501 -webkit-font-smoothing: antialiased; 923 -webkit-font-smoothing: antialiased;
1502 /* @apply(--paper-font-common-expensive-kerning); */ 924
1503 text-rendering: optimizeLegibility;
1504 /* @apply(--paper-font-common-nowrap); */ 925 /* @apply(--paper-font-common-nowrap); */
1505 white-space: nowrap; 926 white-space: nowrap;
1506 overflow: hidden; 927 overflow: hidden;
1507 text-overflow: ellipsis; 928 text-overflow: ellipsis;
1508 929
1509 font-size: 20px; 930 font-size: 20px;
1510 font-weight: 500; 931 font-weight: 500;
1511 line-height: 28px; 932 line-height: 28px;
1512 }; 933 };
1513 934
1514 --paper-font-subhead: { 935 --paper-font-subhead: {
1515 /* @apply(--paper-font-common-base) */ 936 /* @apply(--paper-font-common-base) */
1516 font-family: 'Roboto', 'Noto', sans-serif; 937 font-family: 'Roboto', 'Noto', sans-serif;
1517 -webkit-font-smoothing: antialiased; 938 -webkit-font-smoothing: antialiased;
1518 /* @apply(--paper-font-common-expensive-kerning); */ 939
1519 text-rendering: optimizeLegibility;
1520 940
1521 font-size: 16px; 941 font-size: 16px;
1522 font-weight: 400; 942 font-weight: 400;
1523 line-height: 24px; 943 line-height: 24px;
1524 }; 944 };
1525 945
1526 --paper-font-body2: { 946 --paper-font-body2: {
1527 /* @apply(--paper-font-common-base) */ 947 /* @apply(--paper-font-common-base) */
1528 font-family: 'Roboto', 'Noto', sans-serif; 948 font-family: 'Roboto', 'Noto', sans-serif;
1529 -webkit-font-smoothing: antialiased; 949 -webkit-font-smoothing: antialiased;
(...skipping 25 matching lines...) Expand all
1555 font-size: 12px; 975 font-size: 12px;
1556 font-weight: 400; 976 font-weight: 400;
1557 letter-spacing: 0.011em; 977 letter-spacing: 0.011em;
1558 line-height: 20px; 978 line-height: 20px;
1559 }; 979 };
1560 980
1561 --paper-font-menu: { 981 --paper-font-menu: {
1562 /* @apply(--paper-font-common-base) */ 982 /* @apply(--paper-font-common-base) */
1563 font-family: 'Roboto', 'Noto', sans-serif; 983 font-family: 'Roboto', 'Noto', sans-serif;
1564 -webkit-font-smoothing: antialiased; 984 -webkit-font-smoothing: antialiased;
1565 /* @apply(--paper-font-common-expensive-kerning); */ 985
1566 text-rendering: optimizeLegibility;
1567 /* @apply(--paper-font-common-nowrap); */ 986 /* @apply(--paper-font-common-nowrap); */
1568 white-space: nowrap; 987 white-space: nowrap;
1569 overflow: hidden; 988 overflow: hidden;
1570 text-overflow: ellipsis; 989 text-overflow: ellipsis;
1571 990
1572 font-size: 13px; 991 font-size: 13px;
1573 font-weight: 500; 992 font-weight: 500;
1574 line-height: 24px; 993 line-height: 24px;
1575 }; 994 };
1576 995
1577 --paper-font-button: { 996 --paper-font-button: {
1578 /* @apply(--paper-font-common-base) */ 997 /* @apply(--paper-font-common-base) */
1579 font-family: 'Roboto', 'Noto', sans-serif; 998 font-family: 'Roboto', 'Noto', sans-serif;
1580 -webkit-font-smoothing: antialiased; 999 -webkit-font-smoothing: antialiased;
1581 /* @apply(--paper-font-common-expensive-kerning); */ 1000
1582 text-rendering: optimizeLegibility;
1583 /* @apply(--paper-font-common-nowrap); */ 1001 /* @apply(--paper-font-common-nowrap); */
1584 white-space: nowrap; 1002 white-space: nowrap;
1585 overflow: hidden; 1003 overflow: hidden;
1586 text-overflow: ellipsis; 1004 text-overflow: ellipsis;
1587 1005
1588 font-size: 14px; 1006 font-size: 14px;
1589 font-weight: 500; 1007 font-weight: 500;
1590 letter-spacing: 0.018em; 1008 letter-spacing: 0.018em;
1591 line-height: 24px; 1009 line-height: 24px;
1592 text-transform: uppercase; 1010 text-transform: uppercase;
(...skipping 16 matching lines...) Expand all
1609 1027
1610 font-size: 14px; 1028 font-size: 14px;
1611 font-weight: 500; 1029 font-weight: 500;
1612 line-height: 20px; 1030 line-height: 20px;
1613 }; 1031 };
1614 1032
1615 } 1033 }
1616 1034
1617 </style> 1035 </style>
1618 1036
1619
1620
1621
1622
1623
1624 </head> 1037 </head>
1625 <body><div hidden="" by-vulcanize=""><dom-module id="iron-list" assetpath="chrom e://resources/polymer/v1_0/iron-list/"> 1038 <body><div hidden="" by-vulcanize=""><dom-module id="iron-list" assetpath="chrom e://resources/polymer/v1_0/iron-list/">
1626 <template> 1039 <template>
1627 <style> 1040 <style>
1628 :host { 1041 :host {
1629 display: block; 1042 display: block;
1630 } 1043 }
1631 1044
1632 :host(.has-scroller) { 1045 :host(.has-scroller) {
1633 overflow: auto; 1046 overflow: auto;
(...skipping 20 matching lines...) Expand all
1654 <array-selector id="selector" items="{{items}}" selected="{{selectedItems}}" selected-item="{{selectedItem}}"> 1067 <array-selector id="selector" items="{{items}}" selected="{{selectedItems}}" selected-item="{{selectedItem}}">
1655 </array-selector> 1068 </array-selector>
1656 1069
1657 <div id="items"> 1070 <div id="items">
1658 <content></content> 1071 <content></content>
1659 </div> 1072 </div>
1660 1073
1661 </template> 1074 </template>
1662 </dom-module> 1075 </dom-module>
1663 1076
1664 <dom-module id="paper-header-panel" assetpath="chrome://resources/polymer/v1_0/p aper-header-panel/">
1665
1666 <style>
1667 /**
1668 @license
1669 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
1670 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE
1671 The complete set of authors may be found at http://polymer.github.io/AUTHORS
1672 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS
1673 Code distributed by Google as part of the polymer project is also
1674 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS
1675 */
1676
1677 :host {
1678 --paper-header-panel-shadow: {
1679 height: 6px;
1680 bottom: -6px;
1681 box-shadow: inset 0px 5px 6px -3px rgba(0, 0, 0, 0.4);
1682 };
1683
1684 @apply(--layout-vertical);
1685
1686 position: relative;
1687 height: 100%;
1688 }
1689
1690 #mainContainer {
1691 @apply(--layout-flex);
1692
1693 position: relative;
1694 overflow-y: auto;
1695 overflow-x: hidden;
1696 -webkit-overflow-scrolling: touch;
1697 }
1698
1699 #mainPanel {
1700 @apply(--layout-vertical);
1701 @apply(--layout-flex);
1702
1703 position: relative;
1704 }
1705
1706 /*
1707 * mode: scroll
1708 */
1709 :host([mode=scroll]) #mainContainer {
1710 @apply(--paper-header-panel-scroll-container);
1711
1712 overflow: visible;
1713 }
1714
1715 :host([mode=scroll]) {
1716 overflow-y: auto;
1717 overflow-x: hidden;
1718 -webkit-overflow-scrolling: touch;
1719 }
1720
1721 /*
1722 * mode: cover
1723 */
1724 :host([mode=cover]) #mainContainer {
1725 @apply(--paper-header-panel-cover-container);
1726
1727 position: absolute;
1728 top: 0;
1729 right: 0;
1730 bottom: 0;
1731 left: 0;
1732 }
1733
1734 :host([mode=cover]) #mainPanel {
1735 position: static;
1736 }
1737
1738 /*
1739 * mode: standard
1740 */
1741 :host([mode=standard]) #mainContainer {
1742 @apply(--paper-header-panel-standard-container);
1743 }
1744
1745 /*
1746 * mode: seamed
1747 */
1748 :host([mode=seamed]) #mainContainer {
1749 @apply(--paper-header-panel-seamed-container);
1750 }
1751
1752
1753 /*
1754 * mode: waterfall
1755 */
1756 :host([mode=waterfall]) #mainContainer {
1757 @apply(--paper-header-panel-waterfall-container);
1758 }
1759
1760 /*
1761 * mode: waterfall-tall
1762 */
1763 :host([mode=waterfall-tall]) #mainContainer {
1764 @apply(--paper-header-panel-waterfall-tall-container);
1765 }
1766
1767 #dropShadow {
1768 @apply(--paper-header-panel-shadow);
1769
1770 position: absolute;
1771 top: 0;
1772 left: 0;
1773 right: 0;
1774 height: 6px;
1775 pointer-events: none;
1776
1777 -webkit-transition: opacity 0.5s;
1778 transition: opacity 0.5s;
1779
1780 opacity: 0;
1781 }
1782
1783 #dropShadow.has-shadow {
1784 opacity: 1;
1785 }
1786
1787 </style>
1788
1789 <template>
1790 <content id="headerContent" select="paper-toolbar, .paper-header"></content>
1791
1792 <div id="mainPanel">
1793 <div id="mainContainer" class$="[[_computeMainContainerClass(mode)]]">
1794 <content id="mainContent" select="*"></content>
1795 </div>
1796 <div id="dropShadow"></div>
1797 </div>
1798 </template>
1799
1800 </dom-module>
1801
1802 <dom-module id="iron-icon" assetpath="chrome://resources/polymer/v1_0/iron-icon/ "> 1077 <dom-module id="iron-icon" assetpath="chrome://resources/polymer/v1_0/iron-icon/ ">
1803 1078
1804 <style> 1079 <style>
1805 :host { 1080 :host {
1806 @apply(--layout-inline); 1081 @apply(--layout-inline);
1807 @apply(--layout-center-center); 1082 @apply(--layout-center-center);
1808 position: relative; 1083 position: relative;
1809 1084
1810 vertical-align: middle; 1085 vertical-align: middle;
1811 1086
1812 fill: currentcolor; 1087 fill: var(--iron-icon-fill-color, currentcolor);
1088 stroke: var(--iron-icon-stroke-color, none);
1813 1089
1814 width: var(--iron-icon-width, 24px); 1090 width: var(--iron-icon-width, 24px);
1815 height: var(--iron-icon-height, 24px); 1091 height: var(--iron-icon-height, 24px);
1816 } 1092 }
1817 </style> 1093 </style>
1818 1094
1819 <template> 1095 <template>
1820 </template> 1096 </template>
1821 1097
1822 </dom-module> 1098 </dom-module>
(...skipping 293 matching lines...) Expand 10 before | Expand all | Expand 10 after
2116 ripple is not properly clipped by its parent (which may have 1392 ripple is not properly clipped by its parent (which may have
2117 rounded corners). See: http://jsbin.com/temexa/4 1393 rounded corners). See: http://jsbin.com/temexa/4
2118 1394
2119 Note: We only apply this style conditionally. Otherwise, the browser 1395 Note: We only apply this style conditionally. Otherwise, the browser
2120 will create a new compositing layer for every ripple element on the 1396 will create a new compositing layer for every ripple element on the
2121 page, and that would be bad. */ 1397 page, and that would be bad. */
2122 -webkit-transform: translate(0, 0); 1398 -webkit-transform: translate(0, 0);
2123 transform: translate3d(0, 0, 0); 1399 transform: translate3d(0, 0, 0);
2124 } 1400 }
2125 1401
2126 :host([noink]) {
2127 pointer-events: none;
2128 }
2129
2130 #background, 1402 #background,
2131 #waves, 1403 #waves,
2132 .wave-container, 1404 .wave-container,
2133 .wave { 1405 .wave {
2134 pointer-events: none; 1406 pointer-events: none;
2135 position: absolute; 1407 position: absolute;
2136 top: 0; 1408 top: 0;
2137 left: 0; 1409 left: 0;
2138 width: 100%; 1410 width: 100%;
2139 height: 100%; 1411 height: 100%;
(...skipping 22 matching lines...) Expand all
2162 :host(.circle) .wave-container { 1434 :host(.circle) .wave-container {
2163 overflow: hidden; 1435 overflow: hidden;
2164 } 1436 }
2165 </style> 1437 </style>
2166 1438
2167 <div id="background"></div> 1439 <div id="background"></div>
2168 <div id="waves"></div> 1440 <div id="waves"></div>
2169 </template> 1441 </template>
2170 </dom-module> 1442 </dom-module>
2171 <dom-module id="paper-material" assetpath="chrome://resources/polymer/v1_0/paper -material/"> 1443 <dom-module id="paper-material" assetpath="chrome://resources/polymer/v1_0/paper -material/">
2172 <style> 1444 <template>
2173 :host { 1445 <style>
2174 display: block; 1446 :host {
2175 position: relative; 1447 display: block;
2176 } 1448 position: relative;
1449 }
2177 1450
2178 :host([animated]) { 1451 :host([animated]) {
2179 @apply(--shadow-transition); 1452 @apply(--shadow-transition);
2180 } 1453 }
2181 1454
2182 :host([elevation="1"]) { 1455 :host([elevation="1"]) {
2183 @apply(--shadow-elevation-2dp); 1456 @apply(--shadow-elevation-2dp);
2184 } 1457 }
2185 1458
2186 :host([elevation="2"]) { 1459 :host([elevation="2"]) {
2187 @apply(--shadow-elevation-4dp); 1460 @apply(--shadow-elevation-4dp);
2188 } 1461 }
2189 1462
2190 :host([elevation="3"]) { 1463 :host([elevation="3"]) {
2191 @apply(--shadow-elevation-6dp); 1464 @apply(--shadow-elevation-6dp);
2192 } 1465 }
2193 1466
2194 :host([elevation="4"]) { 1467 :host([elevation="4"]) {
2195 @apply(--shadow-elevation-8dp); 1468 @apply(--shadow-elevation-8dp);
2196 } 1469 }
2197 1470
2198 :host([elevation="5"]) { 1471 :host([elevation="5"]) {
2199 @apply(--shadow-elevation-16dp); 1472 @apply(--shadow-elevation-16dp);
2200 } 1473 }
2201 </style> 1474 </style>
2202 <template> 1475
2203 <content></content> 1476 <content></content>
2204 </template> 1477 </template>
2205 </dom-module> 1478 </dom-module>
2206 <dom-module id="paper-button" assetpath="chrome://resources/polymer/v1_0/paper-b utton/"> 1479 <dom-module id="paper-button" assetpath="chrome://resources/polymer/v1_0/paper-b utton/">
2207 <template strip-whitespace=""> 1480 <template strip-whitespace="">
2208 1481
2209 <style include="paper-material"> 1482 <style include="paper-material">
2210 :host { 1483 :host {
2211 display: inline-block; 1484 display: inline-block;
2212 position: relative; 1485 position: relative;
(...skipping 326 matching lines...) Expand 10 before | Expand all | Expand 10 after
2539 </style> 1812 </style>
2540 <style> 1813 <style>
2541 /* Copyright 2015 The Chromium Authors. All rights reserved. 1814 /* Copyright 2015 The Chromium Authors. All rights reserved.
2542 * Use of this source code is governed by a BSD-style license that can be 1815 * Use of this source code is governed by a BSD-style license that can be
2543 * found in the LICENSE file. */ 1816 * found in the LICENSE file. */
2544 1817
2545 * { 1818 * {
2546 --downloads-item-width: 622px; 1819 --downloads-item-width: 622px;
2547 } 1820 }
2548 1821
1822 [hidden] {
1823 display: none !important;
1824 }
1825
2549 paper-button { 1826 paper-button {
2550 font-weight: 500; 1827 font-weight: 500;
2551 margin: 0; 1828 margin: 0;
2552 min-width: auto; 1829 min-width: auto;
2553 } 1830 }
2554 1831
2555 </style> 1832 </style>
2556 <style> 1833 <style>
2557 /* Copyright 2015 The Chromium Authors. All rights reserved. 1834 /* Copyright 2015 The Chromium Authors. All rights reserved.
2558 * Use of this source code is governed by a BSD-style license that can be 1835 * Use of this source code is governed by a BSD-style license that can be
(...skipping 227 matching lines...) Expand 10 before | Expand all | Expand 10 after
2786 position: relative; 2063 position: relative;
2787 outline: 0; 2064 outline: 0;
2788 @apply(--paper-item-focused); 2065 @apply(--paper-item-focused);
2789 } 2066 }
2790 2067
2791 :host(:focus):before { 2068 :host(:focus):before {
2792 @apply(--layout-fit); 2069 @apply(--layout-fit);
2793 content: ''; 2070 content: '';
2794 background: currentColor; 2071 background: currentColor;
2795 opacity: var(--dark-divider-opacity); 2072 opacity: var(--dark-divider-opacity);
2073 pointer-events: none;
2796 2074
2797 @apply(--paper-item-focused-before); 2075 @apply(--paper-item-focused-before);
2798 } 2076 }
2799 </style> 2077 </style>
2800 </template> 2078 </template>
2801 </dom-module> 2079 </dom-module>
2802 <dom-module id="paper-item" assetpath="chrome://resources/polymer/v1_0/paper-ite m/"> 2080 <dom-module id="paper-item" assetpath="chrome://resources/polymer/v1_0/paper-ite m/">
2803 <template> 2081 <template>
2804 <style include="paper-item-shared-styles"></style> 2082 <style include="paper-item-shared-styles"></style>
2805 <style> 2083 <style>
2806 :host { 2084 :host {
2807 @apply(--layout-horizontal); 2085 @apply(--layout-horizontal);
2808 @apply(--layout-center); 2086 @apply(--layout-center);
2809 @apply(--paper-font-subhead); 2087 @apply(--paper-font-subhead);
2810 2088
2811 @apply(--paper-item); 2089 @apply(--paper-item);
2812 } 2090 }
2813 </style> 2091 </style>
2814 2092
2815 <content></content> 2093 <content></content>
2816 </template> 2094 </template>
2817 2095
2818 </dom-module> 2096 </dom-module>
2097 <dom-module id="paper-menu-shared-styles" assetpath="chrome://resources/polymer/ v1_0/paper-menu/">
2098 <template>
2099 <style>
2100 /* need a wrapper element to make this higher specificity than the :host r ule in paper-item */
2101 .selectable-content > ::content > .iron-selected {
2102 font-weight: bold;
2103
2104 @apply(--paper-menu-selected-item);
2105 }
2106
2107 .selectable-content > ::content > [disabled] {
2108 color: var(--paper-menu-disabled-color, --disabled-text-color);
2109 }
2110
2111 .selectable-content > ::content > *:focus {
2112 position: relative;
2113 outline: 0;
2114
2115 @apply(--paper-menu-focused-item);
2116 }
2117
2118 .selectable-content > ::content > *:focus:after {
2119 @apply(--layout-fit);
2120 background: currentColor;
2121 opacity: var(--dark-divider-opacity);
2122 content: '';
2123
2124 @apply(--paper-menu-focused-item-after);
2125 }
2126
2127 .selectable-content > ::content > *[colored]:focus:after {
2128 opacity: 0.26;
2129 }
2130 </style>
2131 </template>
2132 </dom-module>
2819 <dom-module id="paper-menu" assetpath="chrome://resources/polymer/v1_0/paper-men u/"> 2133 <dom-module id="paper-menu" assetpath="chrome://resources/polymer/v1_0/paper-men u/">
2820 <style> 2134 <template>
2821 /** 2135 <style include="paper-menu-shared-styles"></style>
2822 @license 2136 <style>
2823 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 2137 :host {
2824 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 2138 display: block;
2825 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 2139 padding: 8px 0;
2826 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
2827 Code distributed by Google as part of the polymer project is also
2828 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
2829 */
2830 2140
2831 /* need a wrapper element to make this higher specificity than the :host rule in paper-item */ 2141 background: var(--paper-menu-background-color, --primary-background-colo r);
2832 .selectable-content > ::content > .iron-selected { 2142 color: var(--paper-menu-color, --primary-text-color);
2833 font-weight: bold;
2834 2143
2835 @apply(--paper-menu-selected-item); 2144 @apply(--paper-menu);
2836 } 2145 }
2837 2146 </style>
2838 .selectable-content > ::content > [disabled] {
2839 color: var(--paper-menu-disabled-color, --disabled-text-color);
2840 }
2841
2842 .selectable-content > ::content > *:focus {
2843 position: relative;
2844 outline: 0;
2845
2846 @apply(--paper-menu-focused-item);
2847 }
2848
2849 .selectable-content > ::content > *:focus:after {
2850 @apply(--layout-fit);
2851 background: currentColor;
2852 opacity: var(--dark-divider-opacity);
2853 content: '';
2854
2855 @apply(--paper-menu-focused-item-after);
2856 }
2857
2858 .selectable-content > ::content > *[colored]:focus:after {
2859 opacity: 0.26;
2860 }
2861
2862 </style>
2863
2864 <style>
2865 :host {
2866 display: block;
2867 padding: 8px 0;
2868
2869 background: var(--paper-menu-background-color, --primary-background-color) ;
2870 color: var(--paper-menu-color, --primary-text-color);
2871
2872 @apply(--paper-menu);
2873 }
2874 </style>
2875 <template>
2876 2147
2877 <div class="selectable-content"> 2148 <div class="selectable-content">
2878 <content></content> 2149 <content></content>
2879 </div> 2150 </div>
2880
2881 </template> 2151 </template>
2882 2152
2883 </dom-module> 2153 </dom-module>
2884
2885 <dom-module id="iron-overlay-backdrop" assetpath="chrome://resources/polymer/v1_ 0/iron-overlay-behavior/"> 2154 <dom-module id="iron-overlay-backdrop" assetpath="chrome://resources/polymer/v1_ 0/iron-overlay-behavior/">
2886 2155
2887 <style> 2156 <style>
2888 2157
2889 :host { 2158 :host {
2890 position: fixed; 2159 position: fixed;
2891 top: 0; 2160 top: 0;
2892 left: 0; 2161 left: 0;
2893 width: 100vw; 2162 width: 100vw;
2894 height: 100vh; 2163 height: 100vh;
(...skipping 159 matching lines...) Expand 10 before | Expand all | Expand 10 after
3054 .floated-label-placeholder { 2323 .floated-label-placeholder {
3055 @apply(--paper-font-caption); 2324 @apply(--paper-font-caption);
3056 } 2325 }
3057 2326
3058 .underline { 2327 .underline {
3059 position: relative; 2328 position: relative;
3060 } 2329 }
3061 2330
3062 .focused-line { 2331 .focused-line {
3063 height: 2px; 2332 height: 2px;
2333 @apply(--layout-fit);
3064 2334
3065 -webkit-transform-origin: center center; 2335 -webkit-transform-origin: center center;
3066 transform-origin: center center; 2336 transform-origin: center center;
3067 -webkit-transform: scale3d(0,1,1); 2337 -webkit-transform: scale3d(0,1,1);
3068 transform: scale3d(0,1,1); 2338 transform: scale3d(0,1,1);
3069 2339
3070 background: var(--paper-input-container-focus-color, --default-primary-c olor); 2340 background: var(--paper-input-container-focus-color, --default-primary-c olor);
3071 2341
3072 @apply(--paper-input-container-underline-focus); 2342 @apply(--paper-input-container-underline-focus);
3073 } 2343 }
(...skipping 13 matching lines...) Expand all
3087 -webkit-transform: none; 2357 -webkit-transform: none;
3088 transform: none; 2358 transform: none;
3089 -webkit-transition: -webkit-transform 0.25s; 2359 -webkit-transition: -webkit-transform 0.25s;
3090 transition: transform 0.25s; 2360 transition: transform 0.25s;
3091 2361
3092 @apply(--paper-transition-easing); 2362 @apply(--paper-transition-easing);
3093 } 2363 }
3094 2364
3095 .unfocused-line { 2365 .unfocused-line {
3096 height: 1px; 2366 height: 1px;
2367 @apply(--layout-fit);
3097 background: var(--paper-input-container-color, --secondary-text-color); 2368 background: var(--paper-input-container-color, --secondary-text-color);
3098 2369
3099 @apply(--paper-input-container-underline); 2370 @apply(--paper-input-container-underline);
3100 } 2371 }
3101 2372
3102 :host([disabled]) .unfocused-line { 2373 :host([disabled]) .unfocused-line {
3103 border-bottom: 1px dashed; 2374 border-bottom: 1px dashed;
3104 border-color: var(--paper-input-container-color, --secondary-text-color) ; 2375 border-color: var(--paper-input-container-color, --secondary-text-color) ;
3105 background: transparent; 2376 background: transparent;
3106 2377
(...skipping 13 matching lines...) Expand all
3120 2391
3121 .input-content ::content label, 2392 .input-content ::content label,
3122 .input-content ::content .paper-input-label { 2393 .input-content ::content .paper-input-label {
3123 position: absolute; 2394 position: absolute;
3124 top: 0; 2395 top: 0;
3125 right: 0; 2396 right: 0;
3126 left: 0; 2397 left: 0;
3127 font: inherit; 2398 font: inherit;
3128 color: var(--paper-input-container-color, --secondary-text-color); 2399 color: var(--paper-input-container-color, --secondary-text-color);
3129 2400
2401 @apply(--paper-font-common-nowrap);
3130 @apply(--paper-font-subhead); 2402 @apply(--paper-font-subhead);
3131 @apply(--paper-input-container-label); 2403 @apply(--paper-input-container-label);
3132 } 2404 }
3133 2405
3134 .input-content.label-is-floating ::content label, 2406 .input-content.label-is-floating ::content label,
3135 .input-content.label-is-floating ::content .paper-input-label { 2407 .input-content.label-is-floating ::content .paper-input-label {
3136 -webkit-transform: translateY(-75%) scale(0.75); 2408 -webkit-transform: translateY(-75%) scale(0.75);
3137 transform: translateY(-75%) scale(0.75); 2409 transform: translateY(-75%) scale(0.75);
3138 -webkit-transform-origin: left top;
3139 transform-origin: left top;
3140 -webkit-transition: -webkit-transform 0.25s; 2410 -webkit-transition: -webkit-transform 0.25s;
3141 transition: transform 0.25s; 2411 transition: transform 0.25s;
3142 2412
2413 -webkit-transform-origin: left top;
2414 transform-origin: left top;
2415
2416 /* Since we scale to 75/100 of the size, we actually have 100/75 of the
2417 original space now available */
2418 width: 133%;
2419
3143 @apply(--paper-transition-easing); 2420 @apply(--paper-transition-easing);
3144 } 2421 }
3145 2422
2423 :host-context([dir="rtl"]) .input-content.label-is-floating ::content labe l,
2424 :host-context([dir="rtl"]) .input-content.label-is-floating ::content .pap er-input-label {
2425 /* TODO(noms): Figure out why leaving the width at 133% before the anima tion
2426 * actually makes
2427 * it wider on the right side, not left side, as you would expect in RTL */
2428 width: 100%;
2429 -webkit-transform-origin: right top;
2430 transform-origin: right top;
2431 }
2432
3146 .input-content.label-is-highlighted ::content label, 2433 .input-content.label-is-highlighted ::content label,
3147 .input-content.label-is-highlighted ::content .paper-input-label { 2434 .input-content.label-is-highlighted ::content .paper-input-label {
3148 color: var(--paper-input-container-focus-color, --default-primary-color) ; 2435 color: var(--paper-input-container-focus-color, --default-primary-color) ;
3149 2436
3150 @apply(--paper-input-container-label-focus); 2437 @apply(--paper-input-container-label-focus);
3151 } 2438 }
3152 2439
3153 .input-content.is-invalid ::content label, 2440 .input-content.is-invalid ::content label,
3154 .input-content.is-invalid ::content .paper-input-label { 2441 .input-content.is-invalid ::content .paper-input-label {
3155 color: var(--paper-input-container-invalid-color, --google-red-500); 2442 color: var(--paper-input-container-invalid-color, --google-red-500);
(...skipping 10 matching lines...) Expand all
3166 .input-content ::content .paper-input-input { 2453 .input-content ::content .paper-input-input {
3167 position: relative; /* to make a stacking context */ 2454 position: relative; /* to make a stacking context */
3168 outline: none; 2455 outline: none;
3169 box-shadow: none; 2456 box-shadow: none;
3170 padding: 0; 2457 padding: 0;
3171 width: 100%; 2458 width: 100%;
3172 background: transparent; 2459 background: transparent;
3173 border: none; 2460 border: none;
3174 color: var(--paper-input-container-input-color, --primary-text-color); 2461 color: var(--paper-input-container-input-color, --primary-text-color);
3175 -webkit-appearance: none; 2462 -webkit-appearance: none;
2463 text-align: inherit;
3176 2464
3177 @apply(--paper-font-subhead); 2465 @apply(--paper-font-subhead);
3178 @apply(--paper-input-container-input); 2466 @apply(--paper-input-container-input);
3179 } 2467 }
3180 2468
3181 ::content [prefix] { 2469 ::content [prefix] {
3182 @apply(--paper-font-subhead); 2470 @apply(--paper-font-subhead);
3183 @apply(--paper-input-prefix); 2471 @apply(--paper-input-prefix);
3184 } 2472 }
3185 2473
3186 ::content [suffix] { 2474 ::content [suffix] {
3187 @apply(--paper-font-subhead); 2475 @apply(--paper-font-subhead);
3188 @apply(--paper-input-suffix); 2476 @apply(--paper-input-suffix);
3189 } 2477 }
3190 2478
3191 /* Firefox sets a min-width on the input, which can cause layout issues */ 2479 /* Firefox sets a min-width on the input, which can cause layout issues */
3192 .input-content ::content input { 2480 .input-content ::content input {
3193 min-width: 0; 2481 min-width: 0;
3194 } 2482 }
3195 2483
3196 .input-content ::content textarea { 2484 .input-content ::content textarea {
3197 resize: none; 2485 resize: none;
3198 } 2486 }
3199 2487
2488 .add-on-content {
2489 position: relative;
2490 }
2491
3200 .add-on-content.is-invalid ::content * { 2492 .add-on-content.is-invalid ::content * {
3201 color: var(--paper-input-container-invalid-color, --google-red-500); 2493 color: var(--paper-input-container-invalid-color, --google-red-500);
3202 } 2494 }
3203 2495
3204 .add-on-content.is-highlighted ::content * { 2496 .add-on-content.is-highlighted ::content * {
3205 color: var(--paper-input-container-focus-color, --default-primary-color) ; 2497 color: var(--paper-input-container-focus-color, --default-primary-color) ;
3206 } 2498 }
3207 </style> 2499 </style>
3208 2500
3209 <template is="dom-if" if="[[!noLabelFloat]]"> 2501 <template is="dom-if" if="[[!noLabelFloat]]">
3210 <div class="floated-label-placeholder">&nbsp;</div> 2502 <div class="floated-label-placeholder">&nbsp;</div>
3211 </template> 2503 </template>
3212 2504
3213 <div class$="[[_computeInputContentClass(noLabelFloat,alwaysFloatLabel,focus ed,invalid,_inputHasContent)]]"> 2505 <div class$="[[_computeInputContentClass(noLabelFloat,alwaysFloatLabel,focus ed,invalid,_inputHasContent)]]">
3214 <content select="[prefix]" id="prefix"></content> 2506 <content select="[prefix]" id="prefix"></content>
3215 <div class="label-and-input-container"> 2507
2508 <div class="label-and-input-container" id="labelAndInputContainer">
3216 <content select=":not([add-on]):not([prefix]):not([suffix])"></content> 2509 <content select=":not([add-on]):not([prefix]):not([suffix])"></content>
3217 </div> 2510 </div>
3218 <content select="[suffix]"></content> 2511 <content select="[suffix]"></content>
3219 </div> 2512 </div>
3220 2513
3221 <div class$="[[_computeUnderlineClass(focused,invalid)]]"> 2514 <div class$="[[_computeUnderlineClass(focused,invalid)]]">
3222 <div class="unfocused-line fit"></div> 2515 <div class="unfocused-line"></div>
3223 <div class="focused-line fit"></div> 2516 <div class="focused-line"></div>
3224 </div> 2517 </div>
3225 2518
3226 <div class$="[[_computeAddOnContentClass(focused,invalid)]]"> 2519 <div class$="[[_computeAddOnContentClass(focused,invalid)]]">
3227 <content id="addOnContent" select="[add-on]"></content> 2520 <content id="addOnContent" select="[add-on]"></content>
3228 </div> 2521 </div>
3229 2522
3230 </template> 2523 </template>
3231 </dom-module> 2524 </dom-module>
3232 2525
3233 <dom-module id="cr-search-field" assetpath="chrome://resources/cr_elements/cr_se arch_field/"> 2526 <dom-module id="cr-search-field" assetpath="chrome://resources/cr_elements/cr_se arch_field/">
(...skipping 103 matching lines...) Expand 10 before | Expand all | Expand 10 after
3337 </template> 2630 </template>
3338 <style> 2631 <style>
3339 /* Copyright 2015 The Chromium Authors. All rights reserved. 2632 /* Copyright 2015 The Chromium Authors. All rights reserved.
3340 * Use of this source code is governed by a BSD-style license that can be 2633 * Use of this source code is governed by a BSD-style license that can be
3341 * found in the LICENSE file. */ 2634 * found in the LICENSE file. */
3342 2635
3343 * { 2636 * {
3344 --downloads-item-width: 622px; 2637 --downloads-item-width: 622px;
3345 } 2638 }
3346 2639
2640 [hidden] {
2641 display: none !important;
2642 }
2643
3347 paper-button { 2644 paper-button {
3348 font-weight: 500; 2645 font-weight: 500;
3349 margin: 0; 2646 margin: 0;
3350 min-width: auto; 2647 min-width: auto;
3351 } 2648 }
3352 2649
3353 </style> 2650 </style>
3354 <style> 2651 <style>
3355 /* Copyright 2015 The Chromium Authors. All rights reserved. 2652 /* Copyright 2015 The Chromium Authors. All rights reserved.
3356 * Use of this source code is governed by a BSD-style license that can be 2653 * Use of this source code is governed by a BSD-style license that can be
(...skipping 16 matching lines...) Expand all
3373 margin-bottom: 0; 2670 margin-bottom: 0;
3374 margin-top: 0; 2671 margin-top: 0;
3375 } 2672 }
3376 2673
3377 #actions { 2674 #actions {
3378 display: flex; 2675 display: flex;
3379 flex: none; 2676 flex: none;
3380 width: var(--downloads-item-width); 2677 width: var(--downloads-item-width);
3381 } 2678 }
3382 2679
3383 :host-context(.loading) #actions { 2680 :host-context([loading]) #actions {
3384 visibility: hidden; 2681 visibility: hidden;
3385 } 2682 }
3386 2683
3387 :host(:not([downloads-showing])) #actions { 2684 :host(:not([downloads-showing])) #actions {
3388 justify-content: center; 2685 justify-content: center;
3389 } 2686 }
3390 2687
3391 #actions paper-button:first-of-type { 2688 #actions paper-button:first-of-type {
3392 -webkit-margin-start: -0.57em; /* Matches paper-button padding. */ 2689 -webkit-margin-start: -0.57em; /* Matches paper-button padding. */
3393 } 2690 }
(...skipping 68 matching lines...) Expand 10 before | Expand all | Expand 10 after
3462 /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */ 2759 /* Hide #actions for narrow windows; they're shown in a vertical dot menu. */
3463 #actions { 2760 #actions {
3464 display: none; 2761 display: none;
3465 } 2762 }
3466 } 2763 }
3467 2764
3468 </style> 2765 </style>
3469 </dom-module> 2766 </dom-module>
3470 <dom-module id="downloads-manager" assetpath="chrome://downloads/"> 2767 <dom-module id="downloads-manager" assetpath="chrome://downloads/">
3471 <template> 2768 <template>
3472 <paper-header-panel id="panel" class="loading"> 2769 <downloads-toolbar id="toolbar"></downloads-toolbar>
3473 <downloads-toolbar class="paper-header" id="toolbar"></downloads-toolbar> 2770 <iron-list id="downloads-list" items="{{items_}}" hidden="[[!hasDownloads_]] ">
3474 <iron-list id="downloads-list" items="{{items_}}" hidden="[[!hasDownloads_ ]]"> 2771 <template>
3475 <template> 2772 <downloads-item data="[[item]]" hide-date="[[item.hideDate]]">
3476 <downloads-item data="[[item]]" hide-date="[[item.hideDate]]"> 2773 </downloads-item>
3477 </downloads-item> 2774 </template>
3478 </template> 2775 </iron-list>
3479 </iron-list> 2776 <div id="no-downloads" hidden="[[hasDownloads_]]">
3480 <div id="no-downloads" hidden="[[hasDownloads_]]"> 2777 <div>
3481 <div> 2778 <div class="illustration"></div>
3482 <div class="illustration"></div> 2779 <span></span>
3483 <span></span>
3484 </div>
3485 </div> 2780 </div>
3486 </paper-header-panel> 2781 </div>
3487 </template> 2782 </template>
3488 <style> 2783 <style>
3489 /* Copyright 2015 The Chromium Authors. All rights reserved. 2784 /* Copyright 2015 The Chromium Authors. All rights reserved.
3490 * Use of this source code is governed by a BSD-style license that can be 2785 * Use of this source code is governed by a BSD-style license that can be
3491 * found in the LICENSE file. */ 2786 * found in the LICENSE file. */
3492 2787
3493 * { 2788 * {
3494 --downloads-item-width: 622px; 2789 --downloads-item-width: 622px;
3495 } 2790 }
3496 2791
2792 [hidden] {
2793 display: none !important;
2794 }
2795
3497 paper-button { 2796 paper-button {
3498 font-weight: 500; 2797 font-weight: 500;
3499 margin: 0; 2798 margin: 0;
3500 min-width: auto; 2799 min-width: auto;
3501 } 2800 }
3502 2801
3503 </style> 2802 </style>
3504 <style> 2803 <style>
3505 /* Copyright 2015 The Chromium Authors. All rights reserved. 2804 /* Copyright 2015 The Chromium Authors. All rights reserved.
3506 * Use of this source code is governed by a BSD-style license that can be 2805 * Use of this source code is governed by a BSD-style license that can be
3507 * found in the LICENSE file. */ 2806 * found in the LICENSE file. */
3508 2807
3509 :host { 2808 :host {
3510 display: flex; 2809 display: flex;
3511 flex: 1 0; 2810 flex: 1 0;
3512 flex-direction: column; 2811 flex-direction: column;
3513 height: 100%; 2812 height: 100%;
2813 overflow-y: overlay;
3514 } 2814 }
3515 2815
3516 @media screen and (max-width: 1024px) { 2816 @media screen and (max-width: 1024px) {
3517 :host { 2817 :host {
3518 flex-basis: 670px; /* 622 card width + 24 left margin + 24 right margin. */ 2818 flex-basis: 670px; /* 622 card width + 24 left margin + 24 right margin. */
3519 } 2819 }
3520 } 2820 }
3521 2821
3522 #panel {
3523 --paper-header-panel-shadow: {
3524 display: none;
3525 };
3526 --paper-header-panel-standard-container: {
3527 display: flex;
3528 overflow-y: overlay;
3529 };
3530 }
3531
3532 #no-downloads, 2822 #no-downloads,
3533 #downloads-list { 2823 #downloads-list {
3534 flex: 1; 2824 flex: 1;
3535 } 2825 }
3536 2826
3537 .loading #no-downloads, 2827 :host([loading]) #no-downloads,
3538 .loading #downloads-list { 2828 :host([loading]) #downloads-list {
3539 display: none; 2829 display: none;
3540 } 2830 }
3541 2831
3542 #no-downloads { 2832 #no-downloads {
3543 align-items: center; 2833 align-items: center;
3544 color: #b4b4b4; 2834 color: #b4b4b4;
3545 display: flex; 2835 display: flex;
3546 font-size: 123.1%; 2836 font-size: 123.1%;
3547 font-weight: 500; 2837 font-weight: 500;
3548 justify-content: center; 2838 justify-content: center;
(...skipping 12 matching lines...) Expand all
3561 </div> 2851 </div>
3562 <downloads-manager></downloads-manager> 2852 <downloads-manager></downloads-manager>
3563 <command id="clear-all-command" shortcut="Alt-U+0043"></command> 2853 <command id="clear-all-command" shortcut="Alt-U+0043"></command>
3564 <if expr="is_macosx"> 2854 <if expr="is_macosx">
3565 <command id="undo-command" shortcut="Meta-U+005A"></command> 2855 <command id="undo-command" shortcut="Meta-U+005A"></command>
3566 </if> 2856 </if>
3567 <if expr="not is_macosx"> 2857 <if expr="not is_macosx">
3568 <command id="undo-command" shortcut="Ctrl-U+005A"></command> 2858 <command id="undo-command" shortcut="Ctrl-U+005A"></command>
3569 </if> 2859 </if>
3570 2860
3571 </body></html> 2861 <script src="crisper.js"></script></body></html>
OLDNEW
« no previous file with comments | « chrome/browser/resources/md_downloads/toolbar.css ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698