Opening!

3 files changed, 440 insertions, 322 deletions

diff --git a/static/css/darktheme.css b/static/css/darktheme.css
index e052a92..10377fc 100644
--- a/static/css/darktheme.css
+++ b/static/css/darktheme.css
@@ -1,241 +1,241 @@
-#navigation-bar {
-    border-bottom: 1px solid #252525 !important;
-    background: #111 !important;
-}
-
-body, #selector, #main-box {
-    background: #111 !important;
-    color: white !important;
-}
-
-#logo {
-    color: white !important;
-}
-
-#main-container, .navbar-brand, .nav-link {
-    color: white !important;
-}
-
-.navbar-brand:hover, .nav-link:hover {
-    opacity: .8;
-}
-
-.navbar-brand:active, .nav-link:active, .navbar-brand:focus, .nav-link:focus {
-    opacity: .7;
-}
-
-li.list-group-item {
-    background: #222;
-    color: white;
-}
-
-li.list-group-item:hover {
-    background: #333 !important;
-    color: white !important;
-}
-
-li.list-group-item:active {
-    background: #252525 !important;
-    color: white !important;
-}
-
-#loader, #loader-box {
-    background: #151515 !important;
-}
-
-#search-box, #counts {
-    color: white !important;
-}
-
-#search {
-    background: #222;
-    border: 1px solid #222;
-    color: white;
-}
-
-.card {
-    background: #222;
-    color: white;
-}
-
-.modal-content {
-    color: black;
-}
-
-.alert-warning {
-    color: #fff3cd;
-    background-color: #8564044a;
-    border-color: #8564049c;
-}
-
-.alert-secondary {
-    color: white !important;
-    background: #252525 !important;
-    border: 1px solid black !important;
-}
-
-#close-btn {
-    filter: invert(1);
-}
-
-html, body {
-    background: black !important;
-    color: white !important;
-}
-
-#statusbar, #tabs {
-    background: #222 !important;
-    color: white !important;
-}
-
-.tab:not(.tab-active) img {
-    filter: invert(1) !important;
-}
-
-.loader {
-    background: rgba(10, 10, 10, .75) !important;
-}
-
-.loader img {
-    filter: invert(1) !important;
-}
-
-#tabs .tab.tab-active {
-    border-bottom-color: white !important;
-}
-
-.list-group-item {
-    background-color: #151515 !important;
-}
-
-.btn-light {
-    background: transparent !important;
-    color: white !important;
-}
-
-.dropdown-menu {
-    filter: invert(1) !important;
-}
-
-#panes {
-    background: black !important;
-}
-
-.list-group-item-action {
-    color: white !important;
-}
-
-.modal-content {
-    background-color: #151515 !important;
-}
-
-.modal-header button.close {
-    filter: invert(1) !important;
-}
-
-.modal-header {
-    border-bottom: 1px solid #222 !important;
-}
-
-.modal-footer {
-    border-top: 1px solid #222 !important;
-}
-
-a.list-group-item:hover {
-    background-color: #222 !important;
-}
-
-a.list-group-item:active, a.list-group-item:focus {
-    background-color: #252525 !important;
-}
-
-.card, #footer-space {
-    background: #222 !important;
-}
-
-.card.bg-dark {
-    background: #333 !important;
-}
-
-.bg-warning {
-    background-color: #8e6c06 !important;
-}
-
-nav.navbar.fixed-top.navbar-expand-lg.navbar-light.bg-light {
-    background-color: rgba(34, 34, 34, 0.75) !important;
-    backdrop-filter: blur(10px);
-}
-
-::-webkit-scrollbar {
-    width: 5px;
-}
-
-::-webkit-scrollbar-track {
-    border-radius: 9999px;
-    background: transparent;
-}
-
-::-webkit-scrollbar-thumb {
-    border-radius: 9999px;
-    background-color: #888;
-    transition: background 200ms;
-}
-
-::-webkit-scrollbar-thumb:hover {
-    background-color: #555;
-}
-
-::-webkit-scrollbar-thumb:active {
-    background-color: #222;
-}
-
-#project-hero {
-    height: 65vh;
-    margin-top: -84px;
-    margin-bottom: 16px;
-    background-size: cover;
-    background-position: center;
-}
-
-#apps_outer {
-    background: transparent;
-    border: none;
-}
-
-#apps_outer::after {
-    display: none;
-}
-
-#apps_path {
-    fill: #fff;
-}
-
-#apps_outer:hover #apps_path {
-    opacity: .75;
-}
-
-#apps_outer:active #apps_path, #apps_outer:focus #apps_path {
-    opacity: .5;
-}
-
-.app-icon {
-    width: 24px;
-    height: 24px;
-    vertical-align: middle;
-    margin-right: 5px;
-    filter: invert(1);
-}
-
-.app-title {
-    vertical-align: middle;
-}
-
-.code {
-    background: #222;
-    padding: 10px;
-    border-radius: 10px;
-    font-family: monospace;
-    margin-top: 10px;
-    margin-bottom: 10px;
-    word-wrap: break-word;
+#navigation-bar {

+    border-bottom: 1px solid #252525 !important;

+    background: #111 !important;

+}

+

+body, #selector, #main-box {

+    background: #111 !important;

+    color: white !important;

+}

+

+#logo {

+    color: white !important;

+}

+

+#main-container, .navbar-brand, .nav-link {

+    color: white !important;

+}

+

+.navbar-brand:hover, .nav-link:hover {

+    opacity: .8;

+}

+

+.navbar-brand:active, .nav-link:active, .navbar-brand:focus, .nav-link:focus {

+    opacity: .7;

+}

+

+li.list-group-item {

+    background: #222;

+    color: white;

+}

+

+li.list-group-item:hover {

+    background: #333 !important;

+    color: white !important;

+}

+

+li.list-group-item:active {

+    background: #252525 !important;

+    color: white !important;

+}

+

+#loader, #loader-box {

+    background: #151515 !important;

+}

+

+#search-box, #counts {

+    color: white !important;

+}

+

+#search {

+    background: #222;

+    border: 1px solid #222;

+    color: white;

+}

+

+.card {

+    background: #222;

+    color: white;

+}

+

+.modal-content {

+    color: black;

+}

+

+.alert-warning {

+    color: #fff3cd;

+    background-color: #8564044a;

+    border-color: #8564049c;

+}

+

+.alert-secondary {

+    color: white !important;

+    background: #252525 !important;

+    border: 1px solid black !important;

+}

+

+#close-btn {

+    filter: invert(1);

+}

+

+html, body {

+    background: black !important;

+    color: white !important;

+}

+

+#statusbar, #tabs {

+    background: #222 !important;

+    color: white !important;

+}

+

+.tab:not(.tab-active) img {

+    filter: invert(1) !important;

+}

+

+.loader {

+    background: rgba(10, 10, 10, .75) !important;

+}

+

+.loader img {

+    filter: invert(1) !important;

+}

+

+#tabs .tab.tab-active {

+    border-bottom-color: white !important;

+}

+

+.list-group-item {

+    background-color: #151515 !important;

+}

+

+.btn-light {

+    background: transparent !important;

+    color: white !important;

+}

+

+.dropdown-menu {

+    filter: invert(1) !important;

+}

+

+#panes {

+    background: black !important;

+}

+

+.list-group-item-action {

+    color: white !important;

+}

+

+.modal-content {

+    background-color: #151515 !important;

+}

+

+.modal-header button.close {

+    filter: invert(1) !important;

+}

+

+.modal-header {

+    border-bottom: 1px solid #222 !important;

+}

+

+.modal-footer {

+    border-top: 1px solid #222 !important;

+}

+

+a.list-group-item:hover {

+    background-color: #222 !important;

+}

+

+a.list-group-item:active, a.list-group-item:focus {

+    background-color: #252525 !important;

+}

+

+.card, #footer-space {

+    background: #222 !important;

+}

+

+.card.bg-dark {

+    background: #333 !important;

+}

+

+.bg-warning {

+    background-color: #8e6c06 !important;

+}

+

+nav.navbar.fixed-top.navbar-expand-lg.navbar-light.bg-light {

+    background-color: rgba(34, 34, 34, 0.75) !important;

+    backdrop-filter: blur(10px);

+}

+

+::-webkit-scrollbar {

+    width: 5px;

+}

+

+::-webkit-scrollbar-track {

+    border-radius: 9999px;

+    background: transparent;

+}

+

+::-webkit-scrollbar-thumb {

+    border-radius: 9999px;

+    background-color: #888;

+    transition: background 200ms;

+}

+

+::-webkit-scrollbar-thumb:hover {

+    background-color: #555;

+}

+

+::-webkit-scrollbar-thumb:active {

+    background-color: #222;

+}

+

+#project-hero {

+    height: 65vh;

+    margin-top: -84px;

+    margin-bottom: 16px;

+    background-size: cover;

+    background-position: center;

+}

+

+#apps_outer {

+    background: transparent;

+    border: none;

+}

+

+#apps_outer::after {

+    display: none;

+}

+

+#apps_path {

+    fill: #fff;

+}

+

+#apps_outer:hover #apps_path {

+    opacity: .75;

+}

+

+#apps_outer:active #apps_path, #apps_outer:focus #apps_path {

+    opacity: .5;

+}

+

+.app-icon {

+    width: 24px;

+    height: 24px;

+    vertical-align: middle;

+    margin-right: 5px;

+    filter: invert(1);

+}

+

+.app-title {

+    vertical-align: middle;

+}

+

+.code {

+    background: #222;

+    padding: 10px;

+    border-radius: 10px;

+    font-family: monospace;

+    margin-top: 10px;

+    margin-bottom: 10px;

+    word-wrap: break-word;

 }
\ No newline at end of file
diff --git a/static/css/editor.css b/static/css/editor.css
new file mode 100644
index 0000000..de03848
--- /dev/null
+++ b/static/css/editor.css
@@ -0,0 +1,118 @@
+:root {
+    /* Overrides the border radius setting in the theme. */
+    --ck-border-radius: 4px;
+
+    /* Overrides the default font size in the theme. */
+    --ck-font-size-base: 14px;
+
+    /* Helper variables to avoid duplication in the colors. */
+    --ck-custom-background: #111;
+    --ck-custom-foreground: #222;
+    --ck-custom-border: #333;
+    --ck-custom-white: hsl(0, 0%, 100%);
+
+    /* -- Overrides generic colors. ------------------------------------------------------------- */
+
+    --ck-color-base-border: var(--ck-custom-foreground);
+    --ck-color-base-background: var(--ck-custom-background);
+    --ck-color-base-foreground: var(--ck-custom-background);
+    --ck-color-focus-border: hsl(208, 90%, 62%);
+    --ck-color-text: hsl(0, 0%, 98%);
+    --ck-color-shadow-drop: hsla(0, 0%, 0%, 0.2);
+    --ck-color-shadow-inner: hsla(0, 0%, 0%, 0.1);
+
+    /* -- Overrides the default .ck-button class colors. ---------------------------------------- */
+
+    --ck-color-button-default-background: var(--ck-custom-background);
+    --ck-color-button-default-hover-background: hsl(270, 1%, 22%);
+    --ck-color-button-default-active-background: hsl(270, 2%, 20%);
+    --ck-color-button-default-active-shadow: hsl(270, 2%, 23%);
+    --ck-color-button-default-disabled-background: var(--ck-custom-background);
+
+    --ck-color-button-on-background: var(--ck-custom-foreground);
+    --ck-color-button-on-hover-background: hsl(255, 4%, 16%);
+    --ck-color-button-on-active-background: hsl(255, 4%, 14%);
+    --ck-color-button-on-active-shadow: hsl(240, 3%, 19%);
+    --ck-color-button-on-disabled-background: var(--ck-custom-foreground);
+
+    --ck-color-button-action-background: hsl(168, 76%, 42%);
+    --ck-color-button-action-hover-background: hsl(168, 76%, 38%);
+    --ck-color-button-action-active-background: hsl(168, 76%, 36%);
+    --ck-color-button-action-active-shadow: hsl(168, 75%, 34%);
+    --ck-color-button-action-disabled-background: hsl(168, 76%, 42%);
+    --ck-color-button-action-text: var(--ck-custom-white);
+
+    --ck-color-button-save: hsl(120, 100%, 46%);
+    --ck-color-button-cancel: hsl(15, 100%, 56%);
+
+    /* -- Overrides the default .ck-dropdown class colors. -------------------------------------- */
+
+    --ck-color-dropdown-panel-background: var(--ck-custom-background);
+    --ck-color-dropdown-panel-border: var(--ck-custom-foreground);
+
+    /* -- Overrides the default .ck-splitbutton class colors. ----------------------------------- */
+
+    --ck-color-split-button-hover-background: var(--ck-color-button-default-hover-background);
+    --ck-color-split-button-hover-border: var(--ck-custom-foreground);
+
+    /* -- Overrides the default .ck-input class colors. ----------------------------------------- */
+
+    --ck-color-input-background: var(--ck-custom-background);
+    --ck-color-input-border: hsl(257, 3%, 43%);
+    --ck-color-input-text: hsl(0, 0%, 98%);
+    --ck-color-input-disabled-background: hsl(255, 4%, 21%);
+    --ck-color-input-disabled-border: hsl(250, 3%, 38%);
+    --ck-color-input-disabled-text: hsl(0, 0%, 78%);
+
+    /* -- Overrides the default .ck-labeled-field-view class colors. ---------------------------- */
+
+    --ck-color-labeled-field-label-background: var(--ck-custom-background);
+
+    /* -- Overrides the default .ck-list class colors. ------------------------------------------ */
+
+    --ck-color-list-background: var(--ck-custom-background);
+    --ck-color-list-button-hover-background: var(--ck-color-base-foreground);
+    --ck-color-list-button-on-background: var(--ck-color-base-active);
+    --ck-color-list-button-on-background-focus: var(--ck-color-base-active-focus);
+    --ck-color-list-button-on-text: var(--ck-color-base-background);
+
+    /* -- Overrides the default .ck-balloon-panel class colors. --------------------------------- */
+
+    --ck-color-panel-background: var(--ck-custom-background);
+    --ck-color-panel-border: var(--ck-custom-border);
+
+    /* -- Overrides the default .ck-toolbar class colors. --------------------------------------- */
+
+    --ck-color-toolbar-background: var(--ck-custom-background);
+    --ck-color-toolbar-border: var(--ck-custom-border);
+
+    /* -- Overrides the default .ck-tooltip class colors. --------------------------------------- */
+
+    --ck-color-tooltip-background: hsl(252, 7%, 14%);
+    --ck-color-tooltip-text: hsl(0, 0%, 93%);
+
+    /* -- Overrides the default colors used by the ckeditor5-image package. --------------------- */
+
+    --ck-color-image-caption-background: hsl(0, 0%, 97%);
+    --ck-color-image-caption-text: hsl(0, 0%, 20%);
+
+    /* -- Overrides the default colors used by the ckeditor5-widget package. -------------------- */
+
+    --ck-color-widget-blurred-border: hsl(0, 0%, 87%);
+    --ck-color-widget-hover-border: hsl(43, 100%, 68%);
+    --ck-color-widget-editable-focus-background: var(--ck-custom-white);
+
+    /* -- Overrides the default colors used by the ckeditor5-link package. ---------------------- */
+
+    --ck-color-link-default: hsl(190, 100%, 75%);
+
+}
+
+/* FONT */
+.ck-editor {
+    font-family: "MavenPro","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;
+}
+
+.ck-toolbar, .ck-toolbar * {
+    font-family: "Overpass","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;
+}
\ No newline at end of file
diff --git a/static/css/fonts/index.php b/static/css/fonts/index.php
index f855ee5..4e3f36f 100644
--- a/static/css/fonts/index.php
+++ b/static/css/fonts/index.php
@@ -1,83 +1,83 @@
-<?php
-
-header("Content-Type: text/css");
-
-/*
- * @font-face {
-    src: url("/static/fonts/Jost-Black.ttf");
-    font-family: "Jost";
-    font-style: normal;
-    font-weight: 900;
-}
- */
-
-function css($name, $weight, $weightId, $style) {
-    if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/static/fonts/{$name}-{$weight}.ttf")) {
-        return "\n@font-face {\n    src: url(\"/static/fonts/{$name}-{$weight}.ttf\");\n    font-family: \"{$name}\";\n    font-style: {$style};\n    font-weight: {$weightId};\n}\n";
-    }
-}
-
-function font(string $name) {
-    $txt = "";
-
-    // 100 - Thin
-    $txt .= css($name, "Thin", 100, "normal");
-    $txt .= css($name, "ThinItalic", 100, "italic");
-
-    // 200 - Extra Light
-    $txt .= css($name, "ExtraLight", 200, "normal");
-    $txt .= css($name, "ExtraLightItalic", 200, "italic");
-
-    // 300 - Light
-    $txt .= css($name, "Light", 300, "normal");
-    $txt .= css($name, "LightItalic", 300, "italic");
-
-    // 400 - Regular
-    $txt .= css($name, "Italic", 400, "italic");
-    $txt .= css($name, "Regular", 400, "normal");
-
-    // 500 - Medium
-    $txt .= css($name, "Medium", 500, "normal");
-    $txt .= css($name, "MediumItalic", 500, "italic");
-
-    // 600 - Semi-bold
-    $txt .= css($name, "SemiBold", 600, "normal");
-    $txt .= css($name, "SemiBoldItalic", 600, "italic");
-
-    // 700 - Bold
-    $txt .= css($name, "Bold", 700, "normal");
-    $txt .= css($name, "BoldItalic", 700, "italic");
-
-    // 800 - Extra Bold
-    $txt .= css($name, "ExtraBold", 800, "normal");
-    $txt .= css($name, "ExtraBoldItalic", 800, "italic");
-
-    // 900 - Black
-    $txt .= css($name, "Black", 900, "normal");
-    $txt .= css($name, "BlackItalic", 900, "normal");
-
-    return $txt;
-}
-
-?>
-
-/* Generated on <?= date('r') ?> */
-<?= font("Jost") ?>
-<?= font("MavenPro") ?>
-<?= font("Overpass") ?>
-
-:root {
-    --bs-font-sans-serif: "MavenPro","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;
-}
-
-html, body {
-    font-family: "MavenPro","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;
-}
-
-body.admin {
-    font-family: "Overpass","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;
-}
-
-h1, h2, h3, h4, h5, h6, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
-    font-family: "Jost","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system;
+<?php

+

+header("Content-Type: text/css");

+

+/*

+ * @font-face {

+    src: url("/static/fonts/Jost-Black.ttf");

+    font-family: "Jost";

+    font-style: normal;

+    font-weight: 900;

+}

+ */

+

+function css($name, $weight, $weightId, $style) {

+    if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/static/fonts/{$name}-{$weight}.ttf")) {

+        return "\n@font-face {\n    src: url(\"/static/fonts/{$name}-{$weight}.ttf\");\n    font-family: \"{$name}\";\n    font-style: {$style};\n    font-weight: {$weightId};\n}\n";

+    }

+}

+

+function font(string $name) {

+    $txt = "";

+

+    // 100 - Thin

+    $txt .= css($name, "Thin", 100, "normal");

+    $txt .= css($name, "ThinItalic", 100, "italic");

+

+    // 200 - Extra Light

+    $txt .= css($name, "ExtraLight", 200, "normal");

+    $txt .= css($name, "ExtraLightItalic", 200, "italic");

+

+    // 300 - Light

+    $txt .= css($name, "Light", 300, "normal");

+    $txt .= css($name, "LightItalic", 300, "italic");

+

+    // 400 - Regular

+    $txt .= css($name, "Italic", 400, "italic");

+    $txt .= css($name, "Regular", 400, "normal");

+

+    // 500 - Medium

+    $txt .= css($name, "Medium", 500, "normal");

+    $txt .= css($name, "MediumItalic", 500, "italic");

+

+    // 600 - Semi-bold

+    $txt .= css($name, "SemiBold", 600, "normal");

+    $txt .= css($name, "SemiBoldItalic", 600, "italic");

+

+    // 700 - Bold

+    $txt .= css($name, "Bold", 700, "normal");

+    $txt .= css($name, "BoldItalic", 700, "italic");

+

+    // 800 - Extra Bold

+    $txt .= css($name, "ExtraBold", 800, "normal");

+    $txt .= css($name, "ExtraBoldItalic", 800, "italic");

+

+    // 900 - Black

+    $txt .= css($name, "Black", 900, "normal");

+    $txt .= css($name, "BlackItalic", 900, "normal");

+

+    return $txt;

+}

+

+?>

+

+/* Generated on <?= date('r') ?> */

+<?= font("Jost") ?>

+<?= font("MavenPro") ?>

+<?= font("Overpass") ?>

+

+:root {

+    --bs-font-sans-serif: "MavenPro","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;

+}

+

+html, body {

+    font-family: "MavenPro","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;

+}

+

+body.admin {

+    font-family: "Overpass","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system !important;

+}

+

+h1, h2, h3, h4, h5, h6, .display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {

+    font-family: "Jost","Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji",system-ui,-apple-system;

 }
\ No newline at end of file