basic public page

ui/_/code/quill.js

@@ -508,6 +508,18 @@ HTMLElement.prototype.marginHorizontal = StyleFunction(function(value, unit = "p
     return this
 })
 
+HTMLElement.prototype.borderVertical = StyleFunction(function(value) {
+    this.style.borderTop = value
+    this.style.borderBottom = value
+    return this
+})
+
+HTMLElement.prototype.borderHorizontal = StyleFunction(function(value) {
+    this.style.borderRight = value
+    this.style.borderLeft = value
+    return this
+})
+
 HTMLElement.prototype.fontSize = StyleFunction(function(value, unit = "px") {
     
     switch(value) {
@@ -643,10 +655,10 @@ HTMLElement.prototype.centerY = function () {
     return this;
 };
 
-HTMLElement.prototype.alignVertical = function (value) {
+HTMLElement.prototype.verticalAlign = function (value) {
     const direction = getComputedStyle(this).flexDirection;
     if(!direction) {
-        throw new Error("alignVertical can be only be used on HStacks or VStacks!")
+        throw new Error("verticalAlign can be only be used on HStacks or VStacks!")
     }
 
     if (direction === "column" || direction === "column-reverse") {
@@ -657,10 +669,10 @@ HTMLElement.prototype.alignVertical = function (value) {
     return this
 }
 
-HTMLElement.prototype.alignHorizontal = function (value) {
+HTMLElement.prototype.horizontalAlign = function (value) {
     const direction = getComputedStyle(this).flexDirection;
     if(!direction) {
-        throw new Error("alignHorizontal can be only be used on HStacks or VStacks!")
+        throw new Error("horizontalAlign can be only be used on HStacks or VStacks!")
     }
 
     if (direction === "column" || direction === "column-reverse") {

ui/_/code/shared.css

@@ -2,11 +2,10 @@
     --main: var(--brown);
     --accent: var(--gold);
 
-    --tan: #FFDFB4;
-    --gold: #F2B36F;
+    --gold: #FEBA7D;
     --divider: #bb7c36;
     --green: #0857265c;
-    --red: #BC1C02;
+    --red: #E84343;
     --brown: #812A18;
     --darkbrown: #3f0808;
 
@@ -29,17 +28,17 @@
 }
 
 @font-face {
-    font-family: 'Bona Nova';
-    src: url('/_/fonts/BonaNova/BonaNova-Regular.woff') format('truetype');
-    font-weight: normal;
+    font-family: 'Nabla';
     font-style: normal;
+    font-weight: normal;
+    src: local('Nabla'), url('/_/fonts/Nabla/Nabla-Regular.ttf') format('truetype');
 }
 
 @font-face {
-    font-family: 'Bona Nova';
-    src: url('/_/fonts/BonaNova/BonaNova-Bold.woff') format('truetype');
-    font-weight: bold;
+    font-family: 'Nanum';
+    src: url('/_/fonts/Nanum/NanumGothicCoding-Regular.ttf') format('truetype');
     font-style: normal;
+    font-weight: normal;
 }
 
 body {