sidebar

src/_/code/quill.js

@@ -51,12 +51,17 @@ window.setQuery = function(key, value) {
 
     return newUrl;
 };
-  
+
 window.navigateTo = function(url) {
     window.dispatchEvent(new Event('navigate'));
     window.history.pushState({}, '', url);
 }
 
+window.setLocation = function(url) {
+    window.dispatchEvent(new Event('navigate'));
+    window.history.replaceState({}, '', url);
+}
+
 /* $ SELECTOR */
 
 HTMLElement.prototype.$ = function(selector) {
@@ -91,8 +96,6 @@ console.green = function(message) {
 }
 
 /* GET CSS VARIABLES FOR DARK OR LIGHT MODE */
-window.darkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
-document.documentElement.classList.add(darkMode ? 'dark' : 'light');
 
 window.getColor = function(name) {
     const rootStyles = getComputedStyle(document.documentElement);
@@ -815,6 +818,20 @@ window.input = function(placeholder = "", width, height) {
     return el
 }
 
+window.select = function(cb) {
+    let el = document.createElement("select")
+    el.render = cb
+    quill.render(el)
+    return el
+}
+
+window.option = function(placeholder = "") {
+    let el = document.createElement("option")
+    el.innerText = placeholder
+    quill.render(el)
+    return el
+}
+
 window.label = function(inside) {
     let el = document.createElement("label")
     if(typeof inside === "string") {
@@ -1034,7 +1051,7 @@ HTMLElement.prototype.onInput = function(cb) {
 };
 
 HTMLElement.prototype.onChange = function(cb) {
-    if(!this.matches('input, textarea, [contenteditable=""], [contenteditable="true"]'))
+    if(!this.matches('input, textarea, select, [contenteditable=""], [contenteditable="true"]'))
         throw new Error("Can't put input event on non-input element!")
     this._storeListener("change", cb);
     return this;

src/_/code/styles.css

@@ -9,4 +9,17 @@
 :root {
 
 }
+}
+
+html,
+body {
+  padding: 0;
+  margin: 0;
+}
+
+body {
+  padding-top: env(safe-area-inset-top);
+  padding-bottom: env(safe-area-inset-bottom);
+  padding-left: env(safe-area-inset-left);
+  padding-right: env(safe-area-inset-right);
 }