Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Side by Side Diff: skin/desktop-options.css

Issue 29596663: Issue 5973 - broken icons on Firefox v50-53 (Closed)
Patch Set: Created Nov. 3, 2017, 5:48 p.m.
Left:
Right:
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View unified diff | Download patch
« no previous file with comments | « no previous file | skin/icons/attention.svg » ('j') | skin/icons/tooltip.svg » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 /* 1 /*
2 * This file is part of Adblock Plus <https://adblockplus.org/>, 2 * This file is part of Adblock Plus <https://adblockplus.org/>,
3 * Copyright (C) 2006-present eyeo GmbH 3 * Copyright (C) 2006-present eyeo GmbH
4 * 4 *
5 * Adblock Plus is free software: you can redistribute it and/or modify 5 * Adblock Plus is free software: you can redistribute it and/or modify
6 * it under the terms of the GNU General Public License version 3 as 6 * it under the terms of the GNU General Public License version 3 as
7 * published by the Free Software Foundation. 7 * published by the Free Software Foundation.
8 * 8 *
9 * Adblock Plus is distributed in the hope that it will be useful, 9 * Adblock Plus is distributed in the hope that it will be useful,
10 * but WITHOUT ANY WARRANTY; without even the implied warranty of 10 * but WITHOUT ANY WARRANTY; without even the implied warranty of
(...skipping 192 matching lines...) Expand 10 before | Expand all | Expand 10 after
203 height: 1.3rem; 203 height: 1.3rem;
204 } 204 }
205 205
206 button[role="checkbox"][disabled].toggle 206 button[role="checkbox"][disabled].toggle
207 { 207 {
208 background-image: none; 208 background-image: none;
209 } 209 }
210 210
211 button.delete::before 211 button.delete::before
212 { 212 {
213 -webkit-mask: url(icons/trash.svg); 213 background-image: url(icons/trash.svg#default);
214 mask: url(icons/trash.svg); 214 }
215
216 button.delete:hover::before
217 {
218 background-image: url(icons/trash.svg#hover);
215 } 219 }
216 220
217 button.gear::before 221 button.gear::before
218 { 222 {
219 -webkit-mask: url(icons/gear.svg); 223 background-image: url(icons/gear.svg#default);
220 mask: url(icons/gear.svg); 224 }
225
226 button.gear:hover::before
227 {
228 background-image: url(icons/gear.svg#hover);
221 } 229 }
222 230
223 button.gear, 231 button.gear,
224 button.delete 232 button.delete
225 { 233 {
226 border: 0px; 234 border: 0px;
227 padding: 0px; 235 padding: 0px;
228 background-color: transparent; 236 background-color: transparent;
229 } 237 }
230 238
231 button.gear::before, 239 button.gear::before,
232 button.delete::before 240 button.delete::before
233 { 241 {
234 content: ""; 242 content: "";
235 display: block; 243 display: block;
236 height: 1.9rem; 244 height: 1.9rem;
237 width: 1.9rem; 245 width: 1.9rem;
238 background-color: #099DD1;
239 }
240
241 button.gear:hover::before,
242 button.delete:hover::before
243 {
244 background-color: #5CBCE1;
245 } 246 }
246 247
247 button.link, 248 button.link,
248 button.list 249 button.list
249 { 250 {
250 color: #099CD0; 251 color: #099CD0;
251 } 252 }
252 253
253 button.link 254 button.link
254 { 255 {
(...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after
369 370
370 html[dir="rtl"] [data-validation] .floating-input input:focus:invalid ~ .attenti on::before, 371 html[dir="rtl"] [data-validation] .floating-input input:focus:invalid ~ .attenti on::before,
371 html[dir="rtl"] [data-validation] .floating-input input:valid ~ .attention::befo re 372 html[dir="rtl"] [data-validation] .floating-input input:valid ~ .attention::befo re
372 { 373 {
373 left: 0rem; 374 left: 0rem;
374 right: auto; 375 right: auto;
375 } 376 }
376 377
377 [data-validation] .floating-input input:focus:invalid ~ .attention::before 378 [data-validation] .floating-input input:focus:invalid ~ .attention::before
378 { 379 {
379 background-color: #C11D27; 380 background-image: url(icons/attention.svg);
380 -webkit-mask: url(icons/attention.svg);
381 mask: url(icons/attention.svg);
382 } 381 }
383 382
384 [data-validation] .floating-input input:valid ~ .attention::before 383 [data-validation] .floating-input input:valid ~ .attention::before
385 { 384 {
386 top: 0.8rem; 385 top: 0.8rem;
387 background-color: green; 386 background-image: url(icons/checkmark.svg#approve);
388 -webkit-mask: url(icons/checkmark.svg);
389 mask: url(icons/checkmark.svg);
390 } 387 }
391 388
392 [data-validation] .floating-input input ~ .error-msg 389 [data-validation] .floating-input input ~ .error-msg
393 { 390 {
394 margin-top: 0.5rem; 391 margin-top: 0.5rem;
395 color: #C11D27; 392 color: #C11D27;
396 display: block; 393 display: block;
397 visibility: hidden; 394 visibility: hidden;
398 } 395 }
399 396
(...skipping 466 matching lines...) Expand 10 before | Expand all | Expand 10 after
866 #dialog .table.list li button[aria-checked="true"] 863 #dialog .table.list li button[aria-checked="true"]
867 { 864 {
868 color: #BBB; 865 color: #BBB;
869 } 866 }
870 867
871 #dialog .table.list li button[aria-checked="true"]::before 868 #dialog .table.list li button[aria-checked="true"]::before
872 { 869 {
873 content: ""; 870 content: "";
874 width: 1.3rem; 871 width: 1.3rem;
875 height: 1.3rem; 872 height: 1.3rem;
876 background-color: #BBB; 873 background-image: url(icons/checkmark.svg#default);
877 -webkit-mask: url(icons/checkmark.svg);
878 mask: url(icons/checkmark.svg);
879 margin: 0rem; 874 margin: 0rem;
880 } 875 }
881 876
882 #dialog .table.list li button .display 877 #dialog .table.list li button .display
883 { 878 {
884 flex: none; 879 flex: none;
885 margin: 0rem 0.8rem; 880 margin: 0rem 0.8rem;
886 text-transform: none; 881 text-transform: none;
887 } 882 }
888 883
(...skipping 12 matching lines...) Expand all
901 text-decoration: none; 896 text-decoration: none;
902 cursor: help; 897 cursor: help;
903 } 898 }
904 899
905 .tooltip::before 900 .tooltip::before
906 { 901 {
907 content: ""; 902 content: "";
908 width: 1.3rem; 903 width: 1.3rem;
909 height: 1.3rem; 904 height: 1.3rem;
910 display: block; 905 display: block;
911 background-color: #099DD1; 906 background-image: url(icons/tooltip.svg);
912 -webkit-mask: url(icons/tooltip.svg);
913 mask: url(icons/tooltip.svg);
914 } 907 }
915 908
916 /* 909 /*
917 Used for translatable screen reader only conten. 910 Used for translatable screen reader only conten.
918 e.g.: Use instead of aria-label to avoid complex attribute value translation 911 e.g.: Use instead of aria-label to avoid complex attribute value translation
919 */ 912 */
920 .sr-only 913 .sr-only
921 { 914 {
922 position: absolute; 915 position: absolute;
923 overflow: hidden; 916 overflow: hidden;
(...skipping 247 matching lines...) Expand 10 before | Expand all | Expand 10 after
1171 { 1164 {
1172 background-color: #E1F2FA; 1165 background-color: #E1F2FA;
1173 cursor: pointer; 1166 cursor: pointer;
1174 } 1167 }
1175 1168
1176 .context-menu li[role="menuitem"] > *::before 1169 .context-menu li[role="menuitem"] > *::before
1177 { 1170 {
1178 content: ""; 1171 content: "";
1179 height: 1.5rem; 1172 height: 1.5rem;
1180 width: 1.5rem; 1173 width: 1.5rem;
1181 background-color: #099DD1;
1182 margin: 0rem 1.1rem; 1174 margin: 0rem 1.1rem;
1183 } 1175 }
1184 1176
1185 .context-menu .update-subscription::before 1177 .context-menu .update-subscription::before
1186 { 1178 {
1187 -webkit-mask: url(icons/reload.svg); 1179 background-image: url(icons/reload.svg);
1188 mask: url(icons/reload.svg);
1189 } 1180 }
1190 1181
1191 .context-menu .website::before 1182 .context-menu .website::before
1192 { 1183 {
1193 -webkit-mask: url(icons/globe.svg); 1184 background-image: url(icons/globe.svg);
1194 mask: url(icons/globe.svg);
1195 } 1185 }
1196 1186
1197 .context-menu .source::before 1187 .context-menu .source::before
1198 { 1188 {
1199 -webkit-mask: url(icons/code.svg); 1189 background-image: url(icons/code.svg);
1200 mask: url(icons/code.svg);
1201 } 1190 }
1202 1191
1203 .context-menu .delete::before 1192 .context-menu .delete::before
1204 { 1193 {
1205 -webkit-mask: url(icons/trash.svg); 1194 background-image: url(icons/trash.svg#default);
1206 mask: url(icons/trash.svg);
1207 } 1195 }
1208 1196
1209 /* 1197 /*
1210 Help tab content 1198 Help tab content
1211 */ 1199 */
1212 1200
1213 html:not([lang="zh"]) #social-chinese, 1201 html:not([lang="zh"]) #social-chinese,
1214 html[lang="zh"] #social-general 1202 html[lang="zh"] #social-general
1215 { 1203 {
1216 display: none; 1204 display: none;
(...skipping 18 matching lines...) Expand all
1235 text-align: center; 1223 text-align: center;
1236 } 1224 }
1237 1225
1238 #social ul li a::before 1226 #social ul li a::before
1239 { 1227 {
1240 display: block; 1228 display: block;
1241 margin: 0em auto; 1229 margin: 0em auto;
1242 width: 2.5rem; 1230 width: 2.5rem;
1243 height: 2.5rem; 1231 height: 2.5rem;
1244 content: ""; 1232 content: "";
1245 background-color: #099DD1;
1246 } 1233 }
1247 1234
1248 #twitter::before 1235 #twitter::before
1249 { 1236 {
1250 -webkit-mask: url("social/twitter.svg"); 1237 background-image: url("social/twitter.svg");
1251 mask: url("social/twitter.svg");
1252 } 1238 }
1253 1239
1254 #facebook::before 1240 #facebook::before
1255 { 1241 {
1256 -webkit-mask: url("social/facebook.svg"); 1242 background-image: url("social/facebook.svg");
1257 mask: url("social/facebook.svg");
1258 } 1243 }
1259 1244
1260 #google-plus::before 1245 #google-plus::before
1261 { 1246 {
1262 -webkit-mask: url("social/googleplus.svg"); 1247 background-image: url("social/googleplus.svg");
1263 mask: url("social/googleplus.svg");
1264 } 1248 }
1265 1249
1266 /* 1250 /*
1267 Dialog 1251 Dialog
1268 */ 1252 */
1269 1253
1270 #dialog-background 1254 #dialog-background
1271 { 1255 {
1272 display: none; 1256 display: none;
1273 position: fixed; 1257 position: fixed;
(...skipping 49 matching lines...) Expand 10 before | Expand all | Expand 10 after
1323 } 1307 }
1324 1308
1325 #dialog-close::before, 1309 #dialog-close::before,
1326 #hide-notification::after 1310 #hide-notification::after
1327 { 1311 {
1328 content: ""; 1312 content: "";
1329 display: block; 1313 display: block;
1330 height: 1rem; 1314 height: 1rem;
1331 width: 1rem; 1315 width: 1rem;
1332 border: 0rem; 1316 border: 0rem;
1333 background-color: #FFF; 1317 background-image: url(icons/delete.svg#primary);
1334 -webkit-mask: url(icons/delete.svg);
1335 mask: url(icons/delete.svg);
1336 } 1318 }
1337 1319
1338 #dialog-close:hover::before 1320 #dialog-close:hover::before
1339 { 1321 {
1340 background-color: #000; 1322 background-image: url(icons/delete.svg#primary-hover);
1341 } 1323 }
1342 1324
1343 #dialog #dialog-body 1325 #dialog #dialog-body
1344 { 1326 {
1345 max-height: 60vh; 1327 max-height: 60vh;
1346 overflow: auto; 1328 overflow: auto;
1347 } 1329 }
1348 1330
1349 .dialog-content 1331 .dialog-content
1350 { 1332 {
(...skipping 101 matching lines...) Expand 10 before | Expand all | Expand 10 after
1452 text-align: center; 1434 text-align: center;
1453 } 1435 }
1454 1436
1455 #hide-notification 1437 #hide-notification
1456 { 1438 {
1457 margin: 0rem 1rem; 1439 margin: 0rem 1rem;
1458 } 1440 }
1459 1441
1460 #hide-notification::after 1442 #hide-notification::after
1461 { 1443 {
1462 background-color: #099DD1; 1444 background-image: url(icons/delete.svg#secondary);
1463 } 1445 }
1464 1446
1465 #hide-notification:hover::after 1447 #hide-notification:hover::after
1466 { 1448 {
1467 background-color: #5CBCE1; 1449 background-image: url(icons/delete.svg#secondary-hover);
1468 } 1450 }
OLDNEW
« no previous file with comments | « no previous file | skin/icons/attention.svg » ('j') | skin/icons/tooltip.svg » ('J')

Powered by Google App Engine
This is Rietveld