LEFT | RIGHT |
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 38 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
49 font-size: 16px; | 49 font-size: 16px; |
50 } | 50 } |
51 | 51 |
52 body | 52 body |
53 { | 53 { |
54 background-color: #F3F3F3; | 54 background-color: #F3F3F3; |
55 display: flex; | 55 display: flex; |
56 justify-content: center; | 56 justify-content: center; |
57 /* We force vertical scrollbars to keep the content centered */ | 57 /* We force vertical scrollbars to keep the content centered */ |
58 overflow-y: scroll; | 58 overflow-y: scroll; |
59 margin: 1.2rem 0.3rem; | 59 margin: 1rem 0.3rem; |
60 font-family: "Source Sans Pro", sans-serif; | 60 font-family: "Source Sans Pro", sans-serif; |
61 font-size: 1rem; | 61 font-size: 1rem; |
62 line-height: 1.5rem; | 62 line-height: 1.5rem; |
63 color: #4A4A4A; | 63 color: #4A4A4A; |
64 } | 64 } |
65 | 65 |
66 h1 | 66 h1 |
67 { | 67 { |
68 font-size: 3rem; | 68 font-size: 3rem; |
69 font-weight: 300; | 69 font-weight: 300; |
(...skipping 214 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
284 | 284 |
285 button.link:hover | 285 button.link:hover |
286 { | 286 { |
287 color: #5CBCE1; | 287 color: #5CBCE1; |
288 } | 288 } |
289 | 289 |
290 button.list | 290 button.list |
291 { | 291 { |
292 border-style: solid;; | 292 border-style: solid;; |
293 border-color: #CDCDCD; | 293 border-color: #CDCDCD; |
294 border-width: 0px 1px 1px 1px; | 294 border-width: 1px; |
295 width: 100%; | 295 width: 100%; |
296 background-color: #E1F2FA; | 296 background-color: #E1F2FA; |
297 text-align: initial; | 297 text-align: initial; |
298 } | 298 } |
299 | 299 |
300 button.list:hover | 300 button.list:hover |
301 { | 301 { |
302 box-shadow: inset 0 0 0 3px #077CA6; | 302 box-shadow: inset 0 0 0 3px #077CA6; |
303 border-color: #077CA6; | 303 border-color: #077CA6; |
304 } | 304 } |
(...skipping 73 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
378 [data-validation] .floating-input input:focus:invalid ~ .attention::before, | 378 [data-validation] .floating-input input:focus:invalid ~ .attention::before, |
379 [data-validation] .floating-input input:valid ~ .attention::before | 379 [data-validation] .floating-input input:valid ~ .attention::before |
380 { | 380 { |
381 content: ""; | 381 content: ""; |
382 position: absolute; | 382 position: absolute; |
383 display: block; | 383 display: block; |
384 margin: 0.5rem; | 384 margin: 0.5rem; |
385 height: 1.5rem; | 385 height: 1.5rem; |
386 width: 1.5rem; | 386 width: 1.5rem; |
387 border: 0rem; | 387 border: 0rem; |
388 top: 0.5rem; | 388 top: 0.3rem; |
389 right: 0rem; | 389 right: 0rem; |
390 } | 390 } |
391 | 391 |
392 html[dir="rtl"] [data-validation] .floating-input input:focus:invalid ~ .attenti
on::before, | 392 html[dir="rtl"] [data-validation] .floating-input input:focus:invalid ~ .attenti
on::before, |
393 html[dir="rtl"] [data-validation] .floating-input input:valid ~ .attention::befo
re | 393 html[dir="rtl"] [data-validation] .floating-input input:valid ~ .attention::befo
re |
394 { | 394 { |
395 left: 0rem; | 395 left: 0rem; |
396 right: auto; | 396 right: auto; |
397 } | 397 } |
398 | 398 |
399 [data-validation] .floating-input input:focus:invalid ~ .attention::before | 399 [data-validation] .floating-input input:focus:invalid ~ .attention::before |
400 { | 400 { |
401 background-image: url(icons/attention.svg); | 401 background-image: url(icons/attention.svg); |
402 } | 402 } |
403 | 403 |
404 [data-validation] .floating-input input:valid ~ .attention::before | 404 [data-validation] .floating-input input:valid ~ .attention::before |
405 { | 405 { |
406 top: 0.8rem; | 406 top: 0.5rem; |
407 background-image: url(icons/checkmark.svg#approved); | 407 background-image: url(icons/checkmark.svg#approved); |
408 } | 408 } |
409 | 409 |
410 [data-validation] .floating-input input ~ .error-msg | 410 [data-validation] .floating-input input ~ .error-msg |
411 { | 411 { |
412 margin-top: 0.5rem; | 412 margin-top: 0.5rem; |
413 color: #C11D27; | 413 color: #C11D27; |
414 display: block; | 414 display: block; |
415 visibility: hidden; | 415 visibility: hidden; |
416 } | 416 } |
(...skipping 319 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
736 { | 736 { |
737 border-top: 1px solid #CDCDCD; | 737 border-top: 1px solid #CDCDCD; |
738 } | 738 } |
739 | 739 |
740 .table.list li | 740 .table.list li |
741 { | 741 { |
742 padding: 0.5rem 1rem; | 742 padding: 0.5rem 1rem; |
743 margin: 0rem; | 743 margin: 0rem; |
744 } | 744 } |
745 | 745 |
| 746 .table.list.bottom-control li:last-of-type |
| 747 { |
| 748 border-bottom: 0px; |
| 749 } |
| 750 |
746 li .display | 751 li .display |
747 { | 752 { |
748 margin: 0rem 1rem; | 753 margin: 0rem 1rem; |
749 } | 754 } |
750 | 755 |
751 .table.list li .display | 756 .table.list li .display |
752 { | 757 { |
753 flex: 1; | 758 flex: 1; |
754 margin: 0rem; | 759 margin: 0rem; |
755 } | 760 } |
756 | 761 |
757 .table.list li.empty-placeholder | 762 .table.list li.empty-placeholder |
758 { | 763 { |
759 padding: 1.3em 1.9em; | 764 padding: 1rem 1.4rem; |
760 } | 765 } |
761 | 766 |
762 .table.list li.empty-placeholder:not(:last-of-type) | 767 .table.list li.empty-placeholder:not(:last-of-type) |
763 { | 768 { |
764 border-bottom: 0px; | 769 border-bottom: 0px; |
765 } | 770 } |
766 | 771 |
767 .table.list button.link | 772 .table.list button.link |
768 { | 773 { |
769 font-weight: 700; | 774 font-weight: 700; |
770 text-transform: uppercase; | 775 text-transform: uppercase; |
| 776 text-decoration: none; |
771 } | 777 } |
772 | 778 |
773 .table:not(.list):not(.cols) li | 779 .table:not(.list):not(.cols) li |
774 { | 780 { |
775 padding-top: 0px; | 781 padding-top: 0px; |
776 padding-bottom: 6px; | 782 padding-bottom: 6px; |
777 } | 783 } |
778 | 784 |
779 .table li [data-single="visible"], | 785 .table li [data-single="visible"], |
780 .table li:first-of-type:last-of-type [data-single="hidden"] | 786 .table li:first-of-type:last-of-type [data-single="hidden"] |
(...skipping 115 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
896 height: 1.3rem; | 902 height: 1.3rem; |
897 background-image: url(icons/checkmark.svg#default); | 903 background-image: url(icons/checkmark.svg#default); |
898 margin: 0rem; | 904 margin: 0rem; |
899 } | 905 } |
900 | 906 |
901 #dialog .table.list li button .display | 907 #dialog .table.list li button .display |
902 { | 908 { |
903 flex: none; | 909 flex: none; |
904 margin: 0rem 0.8rem; | 910 margin: 0rem 0.8rem; |
905 text-transform: none; | 911 text-transform: none; |
| 912 font-weight: 400; |
906 } | 913 } |
907 | 914 |
908 /* | 915 /* |
909 Tooltips | 916 Tooltips |
910 */ | 917 */ |
911 | 918 |
912 .tooltip | 919 .tooltip |
913 { | 920 { |
914 display: inline-block; | 921 display: inline-block; |
915 position: relative; | 922 position: relative; |
(...skipping 258 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1174 padding: 0rem; | 1181 padding: 0rem; |
1175 } | 1182 } |
1176 | 1183 |
1177 .context-menu li[role="menuitem"] > * | 1184 .context-menu li[role="menuitem"] > * |
1178 { | 1185 { |
1179 width: 100%; | 1186 width: 100%; |
1180 display: flex; | 1187 display: flex; |
1181 border: 0rem; | 1188 border: 0rem; |
1182 padding: 0.7rem 0rem; | 1189 padding: 0.7rem 0rem; |
1183 color: #077CA6; | 1190 color: #077CA6; |
| 1191 align-items: center; |
1184 font-size: 1rem; | 1192 font-size: 1rem; |
1185 font-weight: 400; | 1193 font-weight: 400; |
1186 text-transform: none; | 1194 text-transform: none; |
1187 text-decoration: none; | 1195 text-decoration: none; |
1188 } | 1196 } |
1189 | 1197 |
1190 .context-menu li[role="menuitem"] > *:hover, | 1198 .context-menu li[role="menuitem"] > *:hover, |
1191 .context-menu li[role="menuitem"] > *:focus | 1199 .context-menu li[role="menuitem"] > *:focus |
1192 { | 1200 { |
1193 background-color: #E1F2FA; | 1201 background-color: #E1F2FA; |
(...skipping 272 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1466 | 1474 |
1467 #hide-notification::after | 1475 #hide-notification::after |
1468 { | 1476 { |
1469 background-image: url(icons/delete.svg#secondary); | 1477 background-image: url(icons/delete.svg#secondary); |
1470 } | 1478 } |
1471 | 1479 |
1472 #hide-notification:hover::after | 1480 #hide-notification:hover::after |
1473 { | 1481 { |
1474 background-image: url(icons/delete.svg#secondary-hover); | 1482 background-image: url(icons/delete.svg#secondary-hover); |
1475 } | 1483 } |
LEFT | RIGHT |