just a clean up

- moved pattern testers out of match module (thanks you @radkii)
- button borders are now easier to see

the reason this commit exists is because i tried to implement a language picker and failed to do it properly so here we are

src/front/cobalt.css

@@ -2,6 +2,7 @@
     --transparent: rgba(0, 0, 0, 0);
     --without-padding: calc(100% - 4rem);
     --border-15: 0.15rem solid var(--accent);
+    --font-mono: 'Noto Sans Mono', 'Consolas', 'SF Mono', monospace;
 }
 @media (prefers-color-scheme: dark) {
     :root {
@@ -44,7 +45,7 @@ body {
     margin: 0;
     background: var(--background);
     color: var(--accent);
-    font-family: 'Noto Sans Mono', 'Consolas', 'SF Mono', monospace;
+    font-family: var(--font-mono);
     user-select: none;
     -webkit-tap-highlight-color: var(--transparent);
     overflow: hidden;
@@ -89,7 +90,7 @@ a {
 button {
     background: none;
     border: none;
-    font-family: 'Noto Sans Mono', 'Consolas', 'SF Mono', monospace;
+    font-family: var(--font-mono);
     color: var(--accent);
     font-size: 0.9rem;
 }
@@ -130,7 +131,7 @@ input[type="checkbox"] {
     font-size: 1rem;
 }
 .mono {
-    font-family: 'Noto Sans Mono', 'Consolas', 'SF Mono', monospace;
+    font-family: var(--font-mono);
 }
 .center {
     top: 50%;
@@ -169,13 +170,13 @@ input[type="checkbox"] {
     color: var(--accent);
     border: 0;
     float: right;
-    border-bottom: 0.1rem solid var(--accent-unhover);
+    border-bottom: 0.15rem solid var(--accent-unhover);
     transition: border-bottom 0.2s;
     outline: none;
 }
 #url-input-area:focus {
     outline: none;
-    border-bottom: 0.1rem solid var(--accent);
+    border-bottom: var(--border-15);
 }
 #download-button {
     height: 2.5rem;
@@ -334,7 +335,7 @@ input[type="checkbox"] {
     align-content: center;
     padding: 0.6rem;
     padding-right: 1rem;
-    border: 0.1rem solid;
+    border: var(--border-15);
     width: auto;
     margin: 0 0.5rem 0.5rem 0;
 }
@@ -364,8 +365,8 @@ input[type="checkbox"] {
     color: var(--accent-unhover-2);
 }
 .switch {
-    border-top: solid 0.1rem var(--accent);
-    border-bottom: solid 0.1rem var(--accent);
+    border-top: var(--border-15);
+    border-bottom: var(--border-15);
     padding: 0.8rem;
     width: 100%;
     text-align: center;
@@ -376,13 +377,13 @@ input[type="checkbox"] {
     cursor: pointer;
 }
 .switch.full {
-    border: solid 0.1rem var(--accent);
+    border: var(--border-15);
 }
 .switch.left {
-    border-left: solid 0.1rem var(--accent);
+    border-left: var(--border-15);
 }
 .switch.right {
-    border-right: solid 0.1rem var(--accent);
+    border-right: var(--border-15);
 }
 .switch.space-right {
     margin-right: 1rem

src/front/cobalt.js

@@ -41,7 +41,7 @@ function changeDownloadButton(action, text) {
             break;
     }
 }
-document.addEventListener("keydown", function(event) {
+document.addEventListener("keydown", function (event) {
     if (event.key == "Tab") {
         eid("download-button").value = '>>'
         eid("download-button").style.padding = '0 1rem'
@@ -81,7 +81,7 @@ function popup(type, action, text) {
         case "download":
             if (action == 1) {
                 eid("pd-download").href = text;
-                eid("pd-copy").setAttribute("onClick", `copy('pd-copy', '${text}')` );
+                eid("pd-copy").setAttribute("onClick", `copy('pd-copy', '${text}')`);
             }
             eid("popup-download").style.visibility = vis(action);
             break;
@@ -200,4 +200,4 @@ eid("url-input-area").addEventListener("keyup", (event) => {
     if (event.key === 'Enter') {
         eid("download-button").click();
     }
-})
+})