diff --git a/pages/popup/icon.png b/pages/popup/icon.png
deleted file mode 100644
index 7f06704e4b5229f0a71df8f9883d5711e03e406c..0000000000000000000000000000000000000000
Binary files a/pages/popup/icon.png and /dev/null differ
diff --git a/pages/popup/icon.svg b/pages/popup/icon.svg
index 5cd1aed6af5e5b496e4733657a671202f7d5872b..2c85d6a04bc603f119452c30c76a717d94bd824c 100644
--- a/pages/popup/icon.svg
+++ b/pages/popup/icon.svg
@@ -1,18 +1,8 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="81.382mm" width="81.382mm" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 288.36257 288.36256">
- <g transform="translate(-252.96 -305.32)">
- <g>
- <circle cx="397.14" cy="449.51" r="144.18" fill="#69ab90"/>
- <circle cx="397.33" cy="449.69" r="96.804" fill="#4a856d"/>
- <circle cx="397.14" cy="449.51" r="85.491" fill="#d9ccb5"/>
- <path d="m397.84 317.05c-35.857-0.21436-69.613 13.549-95.287 39.223-21.726 21.726-34.785 48.725-38.356 79.299-1.5095 12.924-1.1505 18.559 1.4496 22.765 2.5923 4.1928 7.7157 7.094 12.529 7.094 2.224 0 4.3673-0.59088 6.8602-1.8932 2.6102-1.3636 4.1843-2.796 5.6179-5.1148 1.79-2.8953 2.048-4.0575 2.5639-11.494 1.0787-15.547 3.6425-26.467 9.0225-38.438 5.5317-12.308 11.942-21.608 21.432-31.099 15.367-15.367 34.084-25.098 55.841-29.031 7.7155-1.3947 24.814-1.5398 33.687-0.28464 7.756 1.0971 10.134 0.7672 14.301-1.9925 5.8022-3.8431 8.1425-11.751 5.3024-17.917-3.0315-6.5811-7.1319-8.7184-19.484-10.163-5.1906-0.60718-10.356-0.9226-15.479-0.95322zm109.93 74.51c-8.1977-0.0376-14.914 6.5284-14.914 14.576 0 11.147 10.954 18.298 20.867 13.623 4.0006-1.8866 5.9627-3.8591 7.5023-7.5442 4.0457-9.6829-3.0709-20.608-13.456-20.655zm-14.971 113.33c-4.0751 0.0647-7.3332 2.0205-11.055 6.3482-9.1984 10.697-11.412 13.066-15.958 17.079-13.705 12.096-31.307 20.6-50.351 24.325-9.3447 1.8276-28.844 1.6379-38.299-0.3729-19.891-4.2303-35.81-12.389-51.031-26.152-7.8199-7.071-10.345-8.4952-15.06-8.4952-8.2275 0-14.524 6.3846-14.559 14.764-0.026 6.3329 1.7615 9.0449 11.94 18.107 19.95 17.762 46.738 29.723 73.456 32.798 7.3929 0.8508 22.091 0.86962 29.682 0.0398 24.156-2.6409 47.493-11.922 66.845-26.582 6.4568-4.8917 19.763-18.022 24.347-24.025 5.5848-7.3136 6.7915-11.417 5.1346-17.474-1.1034-4.0332-6.2363-8.7401-10.697-9.8103-1.5875-0.38083-3.0371-0.57098-4.3954-0.54943z" fill-rule="evenodd" fill="#e1eee9"/>
- </g>
- <g fill="#fff">
- <path d="m513.64 468.9c-2.2815-0.10063-3.476 1.6445-4.709 6.2656-0.72585 2.3218-0.8127 3.4136-1.5879 5.7129l-1.1328 3.4004-2.2207-0.7832-2.2207-0.78125 0.48242 3.1484c1.2524 8.1662 2.7305 16.622 2.8926 16.553 1.7355-1.3997 8.0109-6.6523 15.238-12.561 0 0-1.199-0.43109-2.5371-0.91406l-2.3144-0.90039 1.2168-3.7168c0.66905-2.0444 1.5029-5.601 1.8535-7.9043 0.10026-0.65807 0.14896-1.1589 0.19727-1.6621 0.13779-3.332-0.88319-4.7139-3.3906-5.5059-0.6561-0.20727-1.2411-0.32834-1.7676-0.35157z"/>
- <path d="m468.09 356.16c-1.5821 1.6469-3.6508 1.2077-7.7315-1.2869-2.1272-1.1799-2.9434-1.9104-5.0908-3.04l-3.166-1.68-1.0672 2.099-1.0686 2.0976-1.8229-2.612c-4.7273-6.7756-9.491-13.916-9.326-13.978 2.222-0.18409 10.389-0.7113 19.697-1.4206 0 0-0.57051 1.1392-1.206 2.4121l-1.0542 2.2486 3.4451 1.8511c1.8947 1.0183 4.9521 3.0176 6.795 4.4431 0.52659 0.4072 0.90738 0.73615 1.2895 1.0671 2.3985 2.3169 2.6128 4.0217 1.3441 6.3249-0.33194 0.60269-0.67188 1.0939-1.037 1.474z"/>
- <path d="m-432.68-16.955c-0.92625 0.11186-1.7636 0.61843-2.5957 1.4668-2.5338 2.583-1.7893 5.0501 3.1855 10.545 2.4906 2.751 6.0466 6.7358 7.9004 8.8555 3.7538 4.2926 5.5909 4.8261 8.1582 2.3672 2.8579-2.737 2.1581-5.0574-3.6914-12.246-6.6046-8.1165-10.178-11.324-12.957-10.988z" transform="translate(912.46 377.29)"/>
- <path d="m511.69 452.45c-0.1731-2.8106-0.55381-8.1371-0.84577-11.837-0.58317-7.3893 0.33368-9.7981 3.9172-10.296 4.7082-0.65411 6.1374 3.0921 6.5005 17.04 0.24112 9.2648-0.62148 11.529-4.5568 11.95-3.5346 0.37895-4.6643-1.1658-5.0151-6.8574z"/>
- </g>
- <path fill="#2a4c3d" d="m459.45 442.28c-2.1109-0.0187-4.3622 1.2952-7.7031 4.248-10.175 8.9932-21.922 15.327-34.545 18.627-8.938 2.3365-24.56 2.9354-33.938 1.3027-14.797-2.576-26.79-8.3704-39.924-19.289-4.784-3.9773-6.1342-4.7617-8.1875-4.7617-3.5186 0-6.0234 2.6331-6.0234 6.332 0 2.525 0.38568 3.1373 4.3926 6.9707 2.416 2.3114 6.445 5.638 8.9551 7.3945 2.51 1.7566 4.8076 3.4001 5.1055 3.6523 0.2983 0.25226 0.17832 1.9504-0.26758 3.7715-1.4733 6.0171-4.278 10.442-7.6934 12.551-1.1265 0.76846-2.2641 1.2685-3.3203 1.3828-6.5363 0.70717-9.3955 4.3121-7.293 9.1953 1.6698 3.8781 6.6162 4.7935 12.031 2.9883 0.24651-0.0848 0.49286-0.16918 0.73829-0.26368 0.23829-0.0897 0.47741-0.18505 0.71679-0.28515 0.49332-0.20988 0.98411-0.43326 1.4707-0.68164 0.0508-0.0257 0.10153-0.0481 0.15234-0.0742 1.8138-0.94212 3.5716-2.1505 5.2266-3.5957 0.14038-0.12553 0.28085-0.25756 0.42188-0.39063 0.20456-0.18578 0.40438-0.38109 0.60547-0.57422 1.7137-1.7335 3.4328-3.9476 4.8926-6.2402 0.20605-0.3236 0.39292-0.64933 0.58789-0.97461 0.10747-0.18366 0.22362-0.36247 0.32813-0.54688 1.5252-2.6914 2.7177-5.4344 3.1113-7.4023 0.2326-1.1632 0.67161-2.1152 0.97461-2.1152 0.3031-0.00001 2.6227 0.7471 5.1543 1.6602 6.1439 2.2158 14.829 4.2505 20.553 4.8144l4.668 0.45899v11.014c0 10.802 0.033 11.054 1.7129 13.051 0.9421 1.1196 2.3872 2.1375 3.2109 2.2617 2.6996 0.407 4.527-0.26757 6.2363-2.2988 1.6414-1.9513 1.6836-2.265 1.6836-13.004v-11.004l4.8105-0.44727c6.0027-0.55789 16.571-3.1406 22.189-5.4238 2.3449-0.9528 4.4893-1.5925 4.7656-1.4219 0.2761 0.17065 0.68736 1.457 0.91406 2.8594 0.7511 4.6454 4.9402 12.24 8.8633 16.07 7.2261 7.0551 16.814 8.4874 19.682 2.9414 2.429-4.6972-0.15457-8.474-6.5898-9.6348-2.868-0.51734-6.1671-3.8642-8.0273-8.1445-1.5696-3.6119-2.9464-10.521-2.2266-11.172 0.3135-0.28323 2.5308-1.9235 4.9277-3.6445 6.261-4.4955 12.034-10.285 12.537-12.574 0.49754-2.2654-1.0289-5.7049-3-6.7598-0.99058-0.53012-1.9214-0.81378-2.8809-0.82227z"/>
+<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="7.1673mm" width="7.2061mm" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 25.5334 25.395792">
+ <g transform="translate(177.77 -519.66)">
+ <path d="m-165 519.66c-2.6196 0-4.9735 0.71508-7.2323 2.1971-0.9279 0.60864-2.7283 2.4092-3.337 3.337-1.4712 2.2424-2.1972 4.6154-2.1972 7.1819 0 2.5788 0.7141 4.9223 2.1797 7.1552 0.6309 0.96123 2.4192 2.7501 3.3802 3.3808 1.4791 0.97083 3.2841 1.71 4.9268 2.0176 1.0838 0.20297 3.9457 0.15209 5.0159-0.0894 2.4596-0.55481 4.4742-1.6723 6.29-3.4887 2.4847-2.4856 3.7408-5.4989 3.7408-8.9756 0-3.4682-1.2629-6.498-3.7405-8.9756-2.4919-2.4919-5.5045-3.7404-9.0264-3.7404z" fill="#7db69f"/>
+ <path d="m-165.02 528.24c-0.8699 0-1.6514 0.23746-2.4016 0.72959-0.3081 0.20212-0.9061 0.80004-1.1081 1.1081-0.4886 0.74466-0.7298 1.5326-0.7298 2.3849 0 0.85636 0.2371 1.6346 0.724 2.3761 0.2094 0.3192 0.8033 0.91326 1.1224 1.1227 0.4911 0.32239 1.0906 0.56785 1.6361 0.67001 0.3598 0.0673 1.3102 0.0504 1.6658-0.0297 0.8167-0.18424 1.4856-0.55532 2.0886-1.1585 0.8251-0.8254 1.2423-1.826 1.2423-2.9806 0-1.1517-0.4195-2.1578-1.2421-2.9806-0.8277-0.82751-1.8279-1.2421-2.9976-1.2421z" fill="#4a826c"/>
+ <path d="m-2404.4 671.18c-3.2399-0.0194-6.3107 1.2365-8.6289 3.5547 0 0.002 0 0.004-0.01 0.006-1.9541 1.9569-3.1473 4.4242-3.4687 7.1758-0.1336 1.143-0.1324 1.8177 0.2265 2.3984 0.3941 0.63745 0.9181 0.94336 1.6758 0.94336 0.2981 0 0.6535-0.10695 0.916-0.24414 0.2434-0.12713 0.6126-0.46272 0.7539-0.69141 0.065-0.10555 0.202-0.39493 0.2403-0.56641 0.053-0.23546 0.061-0.41065 0.084-0.74218 0.088-1.2626 0.2865-2.0912 0.7089-3.0312 0.4385-0.97557 0.9254-1.6871 1.6778-2.4395 1.2078-1.2078 2.6659-1.965 4.3828-2.2754 0.3293-0.0595 0.7416-0.0624 1.2617-0.0684s1.0247-0.004 1.3828 0.0469c0.3661 0.0518 0.6053 0.0832 0.9219 0.0391 0.2645-0.0368 0.6003-0.19398 0.791-0.32031 0.8224-0.54467 1.1248-1.5151 0.707-2.4219a0.6513 0.6513 0 0 1 0 -0.002c-0.1439-0.31257-0.5075-0.75154-0.8496-0.92969-0.4136-0.21541-0.8031-0.27857-1.3769-0.3457-0.4667-0.0546-0.9332-0.0832-1.3985-0.0859zm9.3692 6.3516c-1.074-0.004-1.9883 0.87522-1.9883 1.957 0 1.3647 1.5564 2.3925 2.7988 1.8066 0.3338-0.1574 0.8593-0.69555 0.9922-1.0137 0.5288-1.2658-0.423-2.7422-1.8008-2.75zm-1.291 9.6602c-0.5015 0.009-1.1313 0.39448-1.4707 0.78906-0.7801 0.90716-0.9293 1.0694-1.2911 1.3887-1.0664 0.94113-2.4514 1.6118-3.957 1.9062-0.394 0.0771-0.8958 0.072-1.4824 0.0664-0.5866-0.006-1.0998-0.0118-1.4941-0.0957l0.1328 0.0137a0.6513 0.6513 0 0 1 -0.1328 -0.0137c-1.5797-0.33594-2.8091-0.96601-4.0195-2.0606-0.3529-0.31903-0.5674-0.50965-0.8692-0.67969-0.2288-0.12895-0.689-0.22851-0.8945-0.22851-1.03 0-1.951 0.94359-1.9551 1.9688v0.002a0.6513 0.6513 0 0 1 0 0.002c0 0.26313 0.1216 0.80286 0.3028 1.0781 0.2346 0.35637 0.5009 0.59192 0.957 0.99805 1.8218 1.622 4.2177 2.6942 6.6543 2.9746 0.7641 0.0879 1.9155 0.0871 2.6895 0.002 2.1894-0.23969 4.2945-1.0791 6.0489-2.4082 0.7055-0.53445 1.6855-1.491 2.2129-2.1816 0.2682-0.35126 0.4557-0.64063 0.5664-1.0176 0.098-0.33319 0.076-0.788-0.01-1.0938-0.1165-0.42605-0.279-0.59899-0.5546-0.85157-0.2646-0.24237-0.4858-0.39738-0.8809-0.49218-0.1798-0.0432-0.3602-0.0694-0.5527-0.0664z" fill-rule="evenodd" transform="matrix(.82404 0 0 .82404 1816.1 -30.489)" fill="#f1f7f5"/>
</g>
</svg>
diff --git a/pages/popup/icon32.png b/pages/popup/icon32.png
deleted file mode 100644
index 3c677f83756dec23a3573b3c05f3c183d6320bc6..0000000000000000000000000000000000000000
Binary files a/pages/popup/icon32.png and /dev/null differ
diff --git a/pages/popup/icon36.png b/pages/popup/icon36.png
deleted file mode 100644
index aa046d02132f962271b8bebfccef3eae99c239c9..0000000000000000000000000000000000000000
Binary files a/pages/popup/icon36.png and /dev/null differ
diff --git a/pages/popup/popup.css b/pages/popup/popup.css
index 1a144f02a6d3383e942b8c9a0804154bc1093659..31c6befaf0bba81fe5ad1d7a6391b6d39ac2fb9e 100644
--- a/pages/popup/popup.css
+++ b/pages/popup/popup.css
@@ -1,3 +1,7 @@
+/**
+* Sections
+*/
+
body {
background-color: #f0f0f0;
color: #555;
@@ -10,29 +14,47 @@ body {
width: 350px;
}
-h1 {
- font-size: 36px;
- margin: 0;
- text-align: center;
-}
-
-.title {
- font-weight: bold;
- margin-bottom: 2px;
- text-align: center;
+header {
+ align-items: center;
+ border-bottom: solid lightgray 1px;
+ display: flex;
+ padding: 4px 0;
+ position: relative;
}
-.description {
- color: #777;
- font-style: italic;
- margin-bottom: 18px;
- text-align: center;
+.button-panel {
+ overflow: hidden;
+ padding: 6px;
+ text-align: right;
}
.popup-content {
padding: 0;
}
+/**
+* Hyperlinks
+*/
+
+.text-link {
+ color: #bdbdbd;
+ cursor: pointer;
+ float: left;
+ font-size: 13px;
+ padding-left: 4px;
+ padding-top: 5px;
+ text-decoration: none;
+}
+
+.text-link:hover {
+ color: #777;
+ text-decoration: underline;
+}
+
+/**
+ * Lists
+ */
+
.list {
border-bottom: 1px solid #d8d8d8;
margin: 0;
@@ -76,167 +98,90 @@ h1 {
border-bottom: none;
}
-.side-note {
- color: #a5a5a5;
- font-style: italic;
- font-weight: normal;
-}
-
-.badge {
- background-color: #6bb798;
- border-radius: 10px;
- color: #fff;
- font-family: monospace;
- font-size: 13px;
- font-weight: bold;
- margin-right: 8px;
- padding: 3px 15px;
-}
-
-.button-panel {
- padding: 6px;
- text-align: right;
-}
+/**
+ * Buttons
+ */
.btn-sm {
- font-size: 12px !important;
-}
-
-.text-link {
- color: #bdbdbd;
+ background-color: #f5f5f5;
+ border-radius: 2px;
+ border: 1px solid #cfcfcf;
cursor: pointer;
- float: left;
- font-size: 13px;
- padding-left: 4px;
- padding-top: 2px;
- text-decoration: none;
-}
-
-.text-link:hover {
- color: #777;
- text-decoration: underline;
-}
-
-#injection-counter {
- padding-top: 14px;
+ float: right;
+ font-size: 12px;
+ padding: 5px 22px;
}
-#extension-options-overlay-header {
- align-items: center;
- border-bottom: solid lightgray 1px;
- display: flex;
- padding: 4px 0;
- position: relative;
+.btn-sm:hover {
+ background-color: #fff;
}
-#extension-options-overlay-icon {
- padding: 8px;
-}
+/**
+ * Titles
+ */
-#extension-options-overlay-icon {
- height: 32px;
- width: 32px;
+h1 {
+ font-size: 36px;
+ margin: 0;
+ padding-top: 14px;
+ text-align: center;
}
-#extension-options-overlay-title {
+.extension-title {
font-size: 14px;
font-weight: bold;
padding-left: 0;
}
-:enabled:hover:-webkit-any(
- select,
- input[type='checkbox'],
- input[type='radio'],
- :-webkit-any(
- button,
- input[type='button'],
- input[type='submit']):not(.custom-appearance)) {
- background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0);
- border-color: rgba(0, 0, 0, 0.3);
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12),
- inset 0 1px 2px rgba(255, 255, 255, 0.95);
- color: black;
-}
-
-:enabled:active:-webkit-any(
- select,
- input[type='checkbox'],
- input[type='radio'],
- :-webkit-any(
- button,
- input[type='button'],
- input[type='submit']):not(.custom-appearance)) {
- background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
- box-shadow: none;
- text-shadow: none;
-}
-
-:enabled:focus:-webkit-any(
- select,
- input[type='checkbox'],
- input[type='number'],
- input[type='password'],
- input[type='radio'],
- input[type='search'],
- input[type='text'],
- input[type='url'],
- input:not([type]),
- :-webkit-any(
- button,
- input[type='button'],
- input[type='submit']):not(.custom-appearance)) {
- /* OVERRIDE */
- -webkit-transition: border-color 200ms;
- /* We use border color because it follows the border radius (unlike outline).
- * This is particularly noticeable on mac. */
- border-color: rgb(77, 144, 254);
- outline: none;
-}
-
-:-webkit-any(button,
- input[type='button'],
- input[type='submit']):not(.custom-appearance),
-select,
-input[type='checkbox'],
-input[type='radio'] {
- -webkit-appearance: none;
- -webkit-user-select: none;
- background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
- border: 1px solid rgba(0, 0, 0, 0.25);
- border-radius: 2px;
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08),
- inset 0 1px 2px rgba(255, 255, 255, 0.75);
- color: #444;
- font: inherit;
- margin: 0 1px 0 0;
- outline: none;
- text-shadow: 0 1px 0 rgb(240, 240, 240);
+.description {
+ color: #777;
+ font-style: italic;
+ margin: 0 6px 18px;
+ text-align: center;
}
-:-webkit-any(button,
- input[type='button'],
- input[type='submit']):not(.custom-appearance),
-select {
- min-height: 2em;
- min-width: 4em;
- padding-top: 1px;
- padding-bottom: 1px;
-
+.title {
+ font-weight: bold;
+ margin-bottom: 2px;
+ text-align: center;
}
-:-webkit-any(button,
- input[type='button'],
- input[type='submit']):not(.custom-appearance) {
- -webkit-padding-end: 10px;
- -webkit-padding-start: 10px;
-}
+/**
+ * Icons
+ */
.btn-icon {
color: #5f5f5f;
}
+.extension-icon {
+ height: 26px;
+ padding: 10px 6px 10px 8px;
+ width: 26px;
+}
+
+/**
+ * Miscellaneous
+ */
+
+.badge {
+ background-color: #6bb798;
+ border-radius: 10px;
+ color: #fff;
+ font-family: monospace;
+ font-size: 13px;
+ font-weight: bold;
+ margin-right: 8px;
+ padding: 3px 15px;
+}
+
.label-beta {
color: #6aac91;
font-size: 9px;
}
+
+.side-note {
+ color: #a5a5a5;
+ font-style: italic;
+ font-weight: normal;
+}
diff --git a/pages/popup/popup.html b/pages/popup/popup.html
index a141a5a3820417c84d08a9242cf017ae3ebd1e99..892079b68fd546376c2c4bcf2982e5bcf58289cf 100644
--- a/pages/popup/popup.html
+++ b/pages/popup/popup.html
@@ -20,11 +20,10 @@
<script src="popup.js"></script>
- <div id="extension-options-overlay-header">
- <img id="extension-options-overlay-icon" src="icon.png" alt="Extension Icon">
- <div id="extension-options-overlay-title">Decentraleyes <sup class="label-beta">BETA</sup></div>
- <div style="float: right;"></div>
- </div>
+ <header>
+ <img class="extension-icon" src="icon.svg" alt="Extension Icon">
+ <div class="extension-title">Decentraleyes <sup class="label-beta">BETA</sup></div>
+ </header>
<section id="popup-content" class="popup-content">
@@ -39,9 +38,9 @@
<span id="testing-utility-link" class="text-link">decentraleyes.org/test</span>
- <button id="options-button" class="btn-sm" title="Options">
+ <div id="options-button" class="btn-sm" title="Options">
<i class="btn-icon fas fa-cog" data-fa-transform="grow-2"></i>
- </button>
+ </div>
</section>
</body>