5.4: instagram support

src/front/cobalt.css

@@ -82,37 +82,51 @@ a {
 :focus-visible {
     outline: var(--border-15);
 }
+.checkbox {
+    display: inline-flex;
+    align-items: center;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    padding: 0.55rem 1rem 0.55rem 0.7rem;
+    width: auto;
+    margin-right: var(--padding-1);
+    margin-bottom: var(--padding-1);
+    background: var(--accent-button-bg);
+}
+.checkbox-label {
+    line-height: 1.3rem;
+}
 [type="checkbox"] {
     -webkit-appearance: none;
     appearance: none;
-    margin-right: var(--padding-1);
+    width: 20px;
+    height: 20px;
     z-index: 0;
-    border: 0;
-    height: 15px;
-    width: 15px;
+    margin-right: var(--padding-1);
+    border: 0.15rem solid var(--accent);
 }
 [type="checkbox"]::before {
     content: "";
-    width: 15px;
-    height: 15px;
-    border: 0.15rem solid var(--accent);
-    display: block;
-    z-index: 5;
+    display: none;
     position: relative;
+    width: 6px;
+    height: 12px;
+    z-index: 5;
+    transform: scaleX(0.9)rotate(45deg);
+    left: 6px;
+    top: 1px;
+    border-bottom: 0.18rem solid var(--background);
+    border-right: 0.18rem solid var(--background);
 }
 [type="checkbox"]:checked::before {
-    background: var(--checkmark);
-    background-size: 90%;
-    background-position: center;
-    background-repeat: no-repeat;
+    display: block;
 }
-[type="checkbox"]:checked::before {
+[type="checkbox"]:checked {
     background-color: var(--accent);
-    border: 0.15rem solid var(--accent);
+    border: 0;
 }
-.checkbox span {
-    margin-top: 0.21rem;
-    margin-left: 0.4rem;
+input[type="checkbox"] {
+    cursor: pointer;
 }
 button {
     background: none;
@@ -160,9 +174,6 @@ button:active,
     cursor: pointer;
     transform: scale(0.95)
 }
-input[type="checkbox"] {
-    cursor: pointer;
-}
 .button {
     background: none;
     border: var(--border-15);
@@ -449,20 +460,6 @@ input[type="checkbox"] {
 .no-margin {
     margin: 0!important;
 }
-.checkbox {
-    display: inline-flex;
-    align-items: center;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    padding: 0.55rem 1rem 0.8rem 0.7rem;
-    width: auto;
-    margin-right: var(--padding-1);
-    margin-bottom: var(--padding-1);
-    background: var(--accent-button-bg);
-}
-.checkbox-label {
-    line-height: 1.3rem;
-}
 .switch-container {
     width: 100%;
 }
@@ -579,6 +576,7 @@ input[type="checkbox"] {
     width: 25rem;
     margin-bottom: var(--padding-1);
     background-color: var(--accent-button-bg);
+    border: var(--accent-button-bg) 0.18rem solid;
     position: relative;
 }
 #picker-holder {

src/front/cobalt.js

@@ -1,7 +1,7 @@
 let ua = navigator.userAgent.toLowerCase();
 let isIOS = ua.match("iphone os");
 let isMobile = ua.match("android") || ua.match("iphone os");
-let version = 25;
+let version = 26;
 let regex = new RegExp(/https:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()!@:%_\+.~#?&\/\/=]*)/);
 let notification = `<div class="notification-dot"></div>`
 

src/front/vectorIcons/checkmark.svg

@@ -1,3 +0,0 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M3 13.3871H2.1188L2.57078 14.1436L12.1982 30.2565L12.3437 30.5H12.6274H14.9529H15.2564L15.3965 30.2308L29.4436 3.23077L29.8238 2.5H29H25.6087H25.3024L25.1633 2.77281L13.875 24.903L6.45111 13.6124L6.30297 13.3871H6.03333H3Z" fill="white" stroke="white"/>
-</svg>

src/front/vectorIcons/checkmark_b.svg

@@ -1,3 +0,0 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M3 13.3871H2.1188L2.57078 14.1436L12.1982 30.2565L12.3437 30.5H12.6274H14.9529H15.2564L15.3965 30.2308L29.4436 3.23077L29.8238 2.5H29H25.6087H25.3024L25.1633 2.77281L13.875 24.903L6.45111 13.6124L6.30297 13.3871H6.03333H3Z" fill="black" stroke="black"/>
-</svg>