From 9ba2cff84a9724a5ac27997e146929f9737e7461 Mon Sep 17 00:00:00 2001
From: Aevann1 <Aevann3@gmail.com>
Date: Mon, 27 Sep 2021 21:06:27 +0200
Subject: [PATCH] gdgd

---
 files/assets/css/4chan.scss                   |   1 -
 files/assets/css/4chan_2a96f3.css             |   1 -
 files/assets/css/4chan_30409f.css             |   1 -
 files/assets/css/4chan_38a169.css             |   1 -
 files/assets/css/4chan_3e98a7.css             |   1 -
 files/assets/css/4chan_62ca56.css             |   1 -
 files/assets/css/4chan_7b9ae4.css             |   1 -
 files/assets/css/4chan_7f8fa6.css             |   1 -
 files/assets/css/4chan_805ad5.css             |   1 -
 files/assets/css/4chan_80ffff.css             |   1 -
 files/assets/css/4chan_e4432d.css             |   1 -
 files/assets/css/4chan_eb4963.css             |   1 -
 files/assets/css/4chan_ec72de.css             |   1 -
 files/assets/css/4chan_f39731.css             |   1 -
 files/assets/css/4chan_f8db58.css             |   1 -
 files/assets/css/4chan_ff0000.css             |   1 -
 files/assets/css/4chan_ff66ac.css             |   1 -
 files/assets/css/bootstrap/_alert.scss        |  13 +-
 files/assets/css/bootstrap/_badge.scss        |  11 +-
 files/assets/css/bootstrap/_breadcrumb.scss   |  18 +-
 files/assets/css/bootstrap/_button-group.scss |  40 +-
 files/assets/css/bootstrap/_buttons.scss      |  18 +-
 files/assets/css/bootstrap/_card.scss         |  62 +--
 files/assets/css/bootstrap/_carousel.scss     |  34 +-
 files/assets/css/bootstrap/_close.scss        |  10 +-
 files/assets/css/bootstrap/_code.scss         |  10 +-
 files/assets/css/bootstrap/_custom-forms.scss |  86 +----
 files/assets/css/bootstrap/_dropdown.scss     |  45 +--
 files/assets/css/bootstrap/_forms.scss        | 114 ++----
 files/assets/css/bootstrap/_functions.scss    |  21 +-
 files/assets/css/bootstrap/_grid.scss         |  19 +-
 files/assets/css/bootstrap/_images.scss       |  14 +-
 files/assets/css/bootstrap/_input-group.scss  |  47 +--
 files/assets/css/bootstrap/_list-group.scss   |  37 +-
 files/assets/css/bootstrap/_mixins.scss       |   8 -
 files/assets/css/bootstrap/_modal.scss        |  86 +----
 files/assets/css/bootstrap/_nav.scss          |  17 +-
 files/assets/css/bootstrap/_navbar.scss       |  62 +--
 files/assets/css/bootstrap/_pagination.scss   |   4 +-
 files/assets/css/bootstrap/_popover.scss      |  20 +-
 files/assets/css/bootstrap/_print.scss        |  48 +--
 files/assets/css/bootstrap/_progress.scss     |   4 +-
 files/assets/css/bootstrap/_reboot.scss       | 220 ++---------
 files/assets/css/bootstrap/_root.scss         |   8 +-
 files/assets/css/bootstrap/_spinners.scss     |   8 +-
 files/assets/css/bootstrap/_tables.scss       |  23 +-
 files/assets/css/bootstrap/_toasts.scss       |   6 +-
 files/assets/css/bootstrap/_tooltip.scss      |   9 +-
 files/assets/css/bootstrap/_type.scss         |  13 +-
 files/assets/css/bootstrap/_variables.scss    | 112 +-----
 .../bootstrap/mixins/_background-variant.scss |   2 -
 .../css/bootstrap/mixins/_border-radius.scss  |   2 -
 .../css/bootstrap/mixins/_box-shadow.scss     |   6 +-
 .../css/bootstrap/mixins/_breakpoints.scss    |  37 --
 .../assets/css/bootstrap/mixins/_buttons.scss |  25 +-
 .../css/bootstrap/mixins/_deprecate.scss      |   4 -
 files/assets/css/bootstrap/mixins/_float.scss |   1 -
 files/assets/css/bootstrap/mixins/_forms.scss |  23 +-
 .../css/bootstrap/mixins/_gradients.scss      |   5 -
 .../css/bootstrap/mixins/_grid-framework.scss |  18 +-
 files/assets/css/bootstrap/mixins/_grid.scss  |  22 +-
 files/assets/css/bootstrap/mixins/_hover.scss |   7 -
 files/assets/css/bootstrap/mixins/_image.scss |  22 +-
 .../css/bootstrap/mixins/_list-group.scss     |   1 -
 files/assets/css/bootstrap/mixins/_lists.scss |   2 -
 .../css/bootstrap/mixins/_nav-divider.scss    |   2 -
 .../css/bootstrap/mixins/_pagination.scss     |   1 -
 .../css/bootstrap/mixins/_reset-text.scss     |   6 +-
 .../assets/css/bootstrap/mixins/_resize.scss  |   5 +-
 .../css/bootstrap/mixins/_screen-reader.scss  |   9 +-
 files/assets/css/bootstrap/mixins/_size.scss  |   1 -
 .../css/bootstrap/mixins/_table-row.scss      |   9 +-
 .../css/bootstrap/mixins/_text-emphasis.scss  |   2 -
 .../css/bootstrap/mixins/_text-hide.scss      |   4 +-
 .../css/bootstrap/mixins/_text-truncate.scss  |   2 -
 .../css/bootstrap/mixins/_transition.scss     |   1 -
 .../css/bootstrap/mixins/_visibility.scss     |   2 -
 .../css/bootstrap/utilities/_align.scss       |   4 +-
 .../css/bootstrap/utilities/_background.scss  |   1 -
 .../css/bootstrap/utilities/_borders.scss     |   3 -
 .../css/bootstrap/utilities/_display.scss     |   3 -
 .../css/bootstrap/utilities/_embed.scss       |   1 -
 .../assets/css/bootstrap/utilities/_flex.scss |   3 -
 .../css/bootstrap/utilities/_float.scss       |   1 -
 .../css/bootstrap/utilities/_overflow.scss    |   1 -
 .../css/bootstrap/utilities/_position.scss    |   3 -
 .../bootstrap/utilities/_screenreaders.scss   |   1 -
 .../css/bootstrap/utilities/_shadows.scss     |   1 -
 .../css/bootstrap/utilities/_sizing.scss      |   3 -
 .../css/bootstrap/utilities/_spacing.scss     |   8 +-
 .../bootstrap/utilities/_stretched-link.scss  |   7 +-
 .../assets/css/bootstrap/utilities/_text.scss |  12 +-
 .../css/bootstrap/utilities/_visibility.scss  |   2 -
 files/assets/css/bootstrap/vendor/_rfs.scss   |  79 +---
 files/assets/css/coffee.scss                  |   1 -
 files/assets/css/coffee_2a96f3.css            |   1 -
 files/assets/css/coffee_30409f.css            |   1 -
 files/assets/css/coffee_38a169.css            |   1 -
 files/assets/css/coffee_3e98a7.css            |   1 -
 files/assets/css/coffee_62ca56.css            |   1 -
 files/assets/css/coffee_7b9ae4.css            |   1 -
 files/assets/css/coffee_7f8fa6.css            |   1 -
 files/assets/css/coffee_805ad5.css            |   1 -
 files/assets/css/coffee_80ffff.css            |   1 -
 files/assets/css/coffee_e4432d.css            |   1 -
 files/assets/css/coffee_eb4963.css            |   1 -
 files/assets/css/coffee_ec72de.css            |   1 -
 files/assets/css/coffee_f39731.css            |   1 -
 files/assets/css/coffee_f8db58.css            |   1 -
 files/assets/css/coffee_ff0000.css            |   1 -
 files/assets/css/coffee_ff66ac.css            |   1 -
 files/assets/css/dark.scss                    |   1 -
 files/assets/css/dark_2a96f3.css              |   1 -
 files/assets/css/dark_30409f.css              |   1 -
 files/assets/css/dark_38a169.css              |   1 -
 files/assets/css/dark_3e98a7.css              |   1 -
 files/assets/css/dark_62ca56.css              |   1 -
 files/assets/css/dark_7b9ae4.css              |   1 -
 files/assets/css/dark_7f8fa6.css              |   1 -
 files/assets/css/dark_805ad5.css              |   1 -
 files/assets/css/dark_80ffff.css              |   1 -
 files/assets/css/dark_e4432d.css              |   1 -
 files/assets/css/dark_eb4963.css              |   1 -
 files/assets/css/dark_ec72de.css              |   1 -
 files/assets/css/dark_f39731.css              |   1 -
 files/assets/css/dark_f8db58.css              |   1 -
 files/assets/css/dark_ff0000.css              |   1 -
 files/assets/css/dark_ff66ac.css              |   1 -
 files/assets/css/light.scss                   | 112 +-----
 files/assets/css/light_2a96f3.css             |   1 -
 files/assets/css/light_30409f.css             |   1 -
 files/assets/css/light_38a169.css             |   1 -
 files/assets/css/light_3e98a7.css             |   1 -
 files/assets/css/light_62ca56.css             |   1 -
 files/assets/css/light_7b9ae4.css             |   1 -
 files/assets/css/light_7f8fa6.css             |   1 -
 files/assets/css/light_805ad5.css             |   1 -
 files/assets/css/light_80ffff.css             |   1 -
 files/assets/css/light_e4432d.css             |   1 -
 files/assets/css/light_eb4963.css             |   1 -
 files/assets/css/light_ec72de.css             |   1 -
 files/assets/css/light_f39731.css             |   1 -
 files/assets/css/light_f8db58.css             |   1 -
 files/assets/css/light_ff0000.css             |   1 -
 files/assets/css/light_ff66ac.css             |   1 -
 files/assets/css/main.scss                    | 110 +-----
 files/assets/css/midnight.scss                |   1 -
 files/assets/css/midnight_2a96f3.css          |   1 -
 files/assets/css/midnight_30409f.css          |   1 -
 files/assets/css/midnight_38a169.css          |   1 -
 files/assets/css/midnight_3e98a7.css          |   1 -
 files/assets/css/midnight_62ca56.css          |   1 -
 files/assets/css/midnight_7b9ae4.css          |   1 -
 files/assets/css/midnight_7f8fa6.css          |   1 -
 files/assets/css/midnight_805ad5.css          |   1 -
 files/assets/css/midnight_80ffff.css          |   1 -
 files/assets/css/midnight_e4432d.css          |   1 -
 files/assets/css/midnight_eb4963.css          |   1 -
 files/assets/css/midnight_ec72de.css          |   1 -
 files/assets/css/midnight_f39731.css          |   1 -
 files/assets/css/midnight_f8db58.css          |   1 -
 files/assets/css/midnight_ff0000.css          |   1 -
 files/assets/css/midnight_ff66ac.css          |   1 -
 files/assets/css/transparent.scss             |   1 -
 files/assets/css/transparent_2a96f3.css       |   1 -
 files/assets/css/transparent_30409f.css       |   1 -
 files/assets/css/transparent_38a169.css       |   1 -
 files/assets/css/transparent_3e98a7.css       |   1 -
 files/assets/css/transparent_62ca56.css       |   1 -
 files/assets/css/transparent_7b9ae4.css       |   1 -
 files/assets/css/transparent_7f8fa6.css       |   1 -
 files/assets/css/transparent_805ad5.css       |   1 -
 files/assets/css/transparent_80ffff.css       |   1 -
 files/assets/css/transparent_e4432d.css       |   1 -
 files/assets/css/transparent_eb4963.css       |   1 -
 files/assets/css/transparent_ec72de.css       |   1 -
 files/assets/css/transparent_f39731.css       |   1 -
 files/assets/css/transparent_f8db58.css       |   1 -
 files/assets/css/transparent_ff0000.css       |   1 -
 files/assets/css/transparent_ff66ac.css       |   1 -
 files/assets/css/tron.scss                    |   1 -
 files/assets/css/tron_2a96f3.css              |   1 -
 files/assets/css/tron_30409f.css              |   1 -
 files/assets/css/tron_38a169.css              |   1 -
 files/assets/css/tron_3e98a7.css              |   1 -
 files/assets/css/tron_62ca56.css              |   1 -
 files/assets/css/tron_7b9ae4.css              |   1 -
 files/assets/css/tron_7f8fa6.css              |   1 -
 files/assets/css/tron_805ad5.css              |   1 -
 files/assets/css/tron_80ffff.css              |   1 -
 files/assets/css/tron_e4432d.css              |   1 -
 files/assets/css/tron_eb4963.css              |   1 -
 files/assets/css/tron_ec72de.css              |   1 -
 files/assets/css/tron_f39731.css              |   1 -
 files/assets/css/tron_f8db58.css              |   1 -
 files/assets/css/tron_ff0000.css              |   1 -
 files/assets/css/tron_ff66ac.css              |   1 -
 files/assets/css/win98.scss                   |   1 -
 files/assets/css/win98_2a96f3.css             |   1 -
 files/assets/css/win98_30409f.css             |   1 -
 files/assets/css/win98_38a169.css             |   1 -
 files/assets/css/win98_3e98a7.css             |   1 -
 files/assets/css/win98_62ca56.css             |   1 -
 files/assets/css/win98_7b9ae4.css             |   1 -
 files/assets/css/win98_7f8fa6.css             |   1 -
 files/assets/css/win98_805ad5.css             |   1 -
 files/assets/css/win98_80ffff.css             |   1 -
 files/assets/css/win98_e4432d.css             |   1 -
 files/assets/css/win98_eb4963.css             |   1 -
 files/assets/css/win98_ec72de.css             |   1 -
 files/assets/css/win98_f39731.css             |   1 -
 files/assets/css/win98_f8db58.css             |   1 -
 files/assets/css/win98_ff0000.css             |   1 -
 files/assets/css/win98_ff66ac.css             |   1 -
 files/assets/js/award_modal.js                | 143 +++++++
 files/assets/js/changelog.js                  |  52 +++
 files/assets/js/comments_admin.js             |  83 ++++
 files/assets/js/comments_v.js                 | 287 ++++++++++++++
 files/assets/js/default.js                    | 152 ++++++++
 files/assets/js/emoji_modal.js                | 105 +++++
 files/assets/js/general41.js                  | 130 -------
 files/assets/js/gif_modal.js                  | 104 +++++
 files/assets/js/header.js                     |  59 +++
 files/assets/js/mobile_navigation_bar.js      |  46 +++
 files/assets/js/report_post_modal.js          |  47 +++
 files/assets/js/settings_profile.js           |  81 ++++
 files/assets/js/submit.js                     | 222 +++++++++++
 files/assets/js/userpage.js                   | 114 ++++++
 files/templates/authforms.html                |   1 -
 files/templates/award_modal.html              | 152 +-------
 files/templates/changelog.html                |   1 +
 files/templates/comments.html                 | 364 +-----------------
 files/templates/contact.html                  |   1 -
 files/templates/default.html                  | 157 +-------
 files/templates/delete_post_modal.html        |  23 +-
 files/templates/email/default.html            |  58 ---
 files/templates/emoji_modal.html              | 110 +-----
 files/templates/expanded_image_modal.html     |   5 -
 files/templates/formatting.html               |   2 -
 files/templates/gif_modal.html                | 142 +------
 files/templates/header.html                   |   2 +
 files/templates/home.html                     |  12 +
 files/templates/home_comments.html            |   1 -
 files/templates/login.html                    |   2 -
 files/templates/login_2fa.html                |   1 -
 files/templates/mobile_navigation_bar.html    |  53 +--
 files/templates/report_post_modal.html        |  52 +--
 files/templates/settings.html                 |  30 +-
 files/templates/settings2.html                |  13 +-
 files/templates/settings_apps.html            |   2 -
 files/templates/settings_blocks.html          |   1 -
 files/templates/settings_filters.html         |   1 -
 files/templates/settings_profile.html         |  91 +----
 files/templates/settings_security.html        |  25 --
 files/templates/sign_up.html                  |  15 +-
 files/templates/sign_up_failed_ref.html       |   1 -
 files/templates/submission.html               | 138 +++----
 files/templates/submission_banned.html        |   7 -
 files/templates/submission_listing.html       |   6 -
 files/templates/submit.html                   | 275 +------------
 files/templates/userpage.html                 | 135 +------
 261 files changed, 1887 insertions(+), 3575 deletions(-)
 create mode 100644 files/assets/js/award_modal.js
 create mode 100644 files/assets/js/changelog.js
 create mode 100644 files/assets/js/comments_admin.js
 create mode 100644 files/assets/js/comments_v.js
 create mode 100644 files/assets/js/default.js
 create mode 100644 files/assets/js/emoji_modal.js
 delete mode 100644 files/assets/js/general41.js
 create mode 100644 files/assets/js/gif_modal.js
 create mode 100644 files/assets/js/header.js
 create mode 100644 files/assets/js/mobile_navigation_bar.js
 create mode 100644 files/assets/js/report_post_modal.js
 create mode 100644 files/assets/js/settings_profile.js
 create mode 100644 files/assets/js/submit.js
 create mode 100644 files/assets/js/userpage.js

diff --git a/files/assets/css/4chan.scss b/files/assets/css/4chan.scss
index 3dcee4a87..88c567ff7 100644
--- a/files/assets/css/4chan.scss
+++ b/files/assets/css/4chan.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #3E2C18;
diff --git a/files/assets/css/4chan_2a96f3.css b/files/assets/css/4chan_2a96f3.css
index 3be20f8d9..f488f564a 100644
--- a/files/assets/css/4chan_2a96f3.css
+++ b/files/assets/css/4chan_2a96f3.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_30409f.css b/files/assets/css/4chan_30409f.css
index 46435566a..c0a46cc4f 100644
--- a/files/assets/css/4chan_30409f.css
+++ b/files/assets/css/4chan_30409f.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_38a169.css b/files/assets/css/4chan_38a169.css
index 9e74ed585..21a040beb 100644
--- a/files/assets/css/4chan_38a169.css
+++ b/files/assets/css/4chan_38a169.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_3e98a7.css b/files/assets/css/4chan_3e98a7.css
index a4b726ac7..5ddf9765e 100644
--- a/files/assets/css/4chan_3e98a7.css
+++ b/files/assets/css/4chan_3e98a7.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_62ca56.css b/files/assets/css/4chan_62ca56.css
index 257d043cb..7e2aa4077 100644
--- a/files/assets/css/4chan_62ca56.css
+++ b/files/assets/css/4chan_62ca56.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_7b9ae4.css b/files/assets/css/4chan_7b9ae4.css
index e114f1710..bfa4da68b 100644
--- a/files/assets/css/4chan_7b9ae4.css
+++ b/files/assets/css/4chan_7b9ae4.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_7f8fa6.css b/files/assets/css/4chan_7f8fa6.css
index d6f589d6c..9d3f130e8 100644
--- a/files/assets/css/4chan_7f8fa6.css
+++ b/files/assets/css/4chan_7f8fa6.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_805ad5.css b/files/assets/css/4chan_805ad5.css
index 93cc4e976..12a910cee 100644
--- a/files/assets/css/4chan_805ad5.css
+++ b/files/assets/css/4chan_805ad5.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_80ffff.css b/files/assets/css/4chan_80ffff.css
index a9ec9a496..3e13056cb 100644
--- a/files/assets/css/4chan_80ffff.css
+++ b/files/assets/css/4chan_80ffff.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_e4432d.css b/files/assets/css/4chan_e4432d.css
index df69d7d45..4165ecc89 100644
--- a/files/assets/css/4chan_e4432d.css
+++ b/files/assets/css/4chan_e4432d.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_eb4963.css b/files/assets/css/4chan_eb4963.css
index e6ce7e262..6a7e5f6f9 100644
--- a/files/assets/css/4chan_eb4963.css
+++ b/files/assets/css/4chan_eb4963.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_ec72de.css b/files/assets/css/4chan_ec72de.css
index 01165a4b9..95ee027bc 100644
--- a/files/assets/css/4chan_ec72de.css
+++ b/files/assets/css/4chan_ec72de.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_f39731.css b/files/assets/css/4chan_f39731.css
index 99c80bc07..e9b45567a 100644
--- a/files/assets/css/4chan_f39731.css
+++ b/files/assets/css/4chan_f39731.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_f8db58.css b/files/assets/css/4chan_f8db58.css
index ceb136535..888385df0 100644
--- a/files/assets/css/4chan_f8db58.css
+++ b/files/assets/css/4chan_f8db58.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_ff0000.css b/files/assets/css/4chan_ff0000.css
index 10a1b39bc..da36b8a0e 100644
--- a/files/assets/css/4chan_ff0000.css
+++ b/files/assets/css/4chan_ff0000.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/4chan_ff66ac.css b/files/assets/css/4chan_ff66ac.css
index 02e5778c8..b1e11b17d 100644
--- a/files/assets/css/4chan_ff66ac.css
+++ b/files/assets/css/4chan_ff66ac.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/bootstrap/_alert.scss b/files/assets/css/bootstrap/_alert.scss
index da2a98af9..4ddc483cb 100644
--- a/files/assets/css/bootstrap/_alert.scss
+++ b/files/assets/css/bootstrap/_alert.scss
@@ -1,5 +1,4 @@
 //
-// Base styles
 //
 
 .alert {
@@ -10,27 +9,21 @@
   @include border-radius($alert-border-radius);
 }
 
-// Headings for larger alerts
 .alert-heading {
-  // Specified to prevent conflicts of changing $headings-color
-  color: inherit;
+    color: inherit;
 }
 
-// Provide class for links that match alerts
 .alert-link {
   font-weight: $alert-link-font-weight;
 }
 
 
-// Dismissible alerts
 //
-// Expand the right padding and account for the close button's positioning.
 
 .alert-dismissible {
   padding-right: $close-font-size + $alert-padding-x * 2;
 
-  // Adjust close link position
-  .close {
+    .close {
     position: absolute;
     top: 0;
     right: 0;
@@ -40,9 +33,7 @@
 }
 
 
-// Alternate styles
 //
-// Generate contextual modifier classes for colorizing the alert.
 
 @each $color, $value in $theme-colors {
   .alert-#{$color} {
diff --git a/files/assets/css/bootstrap/_badge.scss b/files/assets/css/bootstrap/_badge.scss
index 42c5d08d7..3f1879f7b 100644
--- a/files/assets/css/bootstrap/_badge.scss
+++ b/files/assets/css/bootstrap/_badge.scss
@@ -1,7 +1,4 @@
-// Base class
 //
-// Requires one of the contextual, color modifier classes for `color` and
-// `background-color`.
 
 .badge {
   display: inline-block;
@@ -21,21 +18,17 @@
     }
   }
 
-  // Empty badges collapse automatically
-  &:empty {
+    &:empty {
     display: none;
   }
 }
 
-// Quick fix for badges in buttons
 .btn .badge {
   position: relative;
   top: -1px;
 }
 
-// Pill badges
 //
-// Make them extra rounded with a modifier to replace v3's badges.
 
 .badge-pill {
   padding-right: $badge-pill-padding-x;
@@ -43,9 +36,7 @@
   @include border-radius($badge-pill-border-radius);
 }
 
-// Colors
 //
-// Contextual variations (linked badges get darker on :hover).
 
 @each $color, $value in $theme-colors {
   .badge-#{$color} {
diff --git a/files/assets/css/bootstrap/_breadcrumb.scss b/files/assets/css/bootstrap/_breadcrumb.scss
index d748894f9..ce4519b5f 100644
--- a/files/assets/css/bootstrap/_breadcrumb.scss
+++ b/files/assets/css/bootstrap/_breadcrumb.scss
@@ -10,29 +10,21 @@
 }
 
 .breadcrumb-item {
-  // The separator between breadcrumbs (by default, a forward-slash: "/")
-  + .breadcrumb-item {
+    + .breadcrumb-item {
     padding-left: $breadcrumb-item-padding;
 
     &::before {
-      display: inline-block; // Suppress underlining of the separator in modern browsers
-      padding-right: $breadcrumb-item-padding;
+      display: inline-block;       padding-right: $breadcrumb-item-padding;
       color: $breadcrumb-divider-color;
       content: escape-svg($breadcrumb-divider);
     }
   }
 
-  // IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built
-  // without `<ul>`s. The `::before` pseudo-element generates an element
-  // *within* the .breadcrumb-item and thereby inherits the `text-decoration`.
-  //
-  // To trick IE into suppressing the underline, we give the pseudo-element an
-  // underline and then immediately remove it.
-  + .breadcrumb-item:hover::before {
+        //
+      + .breadcrumb-item:hover::before {
     text-decoration: underline;
   }
-  // stylelint-disable-next-line no-duplicate-selectors
-  + .breadcrumb-item:hover::before {
+    + .breadcrumb-item:hover::before {
     text-decoration: none;
   }
 
diff --git a/files/assets/css/bootstrap/_button-group.scss b/files/assets/css/bootstrap/_button-group.scss
index da02d7931..f4a837eaa 100644
--- a/files/assets/css/bootstrap/_button-group.scss
+++ b/files/assets/css/bootstrap/_button-group.scss
@@ -1,19 +1,14 @@
-// stylelint-disable selector-no-qualifying-type
 
-// Make the div behave like a button
 .btn-group,
 .btn-group-vertical {
   position: relative;
   display: inline-flex;
-  vertical-align: middle; // match .btn alignment given font-size hack above
-
+  vertical-align: middle; 
   > .btn {
     position: relative;
     flex: 1 1 auto;
 
-    // Bring the hover, focused, and "active" buttons to the front to overlay
-    // the borders properly
-    @include hover() {
+            @include hover() {
       z-index: 1;
     }
     &:focus,
@@ -24,7 +19,6 @@
   }
 }
 
-// Optional: Group multiple button groups together for a toolbar
 .btn-toolbar {
   display: flex;
   flex-wrap: wrap;
@@ -36,14 +30,12 @@
 }
 
 .btn-group {
-  // Prevent double borders when buttons are next to each other
-  > .btn:not(:first-child),
+    > .btn:not(:first-child),
   > .btn-group:not(:first-child) {
     margin-left: -$btn-border-width;
   }
 
-  // Reset rounded corners
-  > .btn:not(:last-child):not(.dropdown-toggle),
+    > .btn:not(:last-child):not(.dropdown-toggle),
   > .btn-group:not(:last-child) > .btn {
     @include border-right-radius(0);
   }
@@ -54,16 +46,13 @@
   }
 }
 
-// Sizing
 //
-// Remix the default button sizing classes into new ones for easier manipulation.
 
 .btn-group-sm > .btn { @extend .btn-sm; }
 .btn-group-lg > .btn { @extend .btn-lg; }
 
 
 //
-// Split button dropdowns
 //
 
 .dropdown-toggle-split {
@@ -92,20 +81,16 @@
 }
 
 
-// The clickable button for toggling the menu
-// Set the same inset shadow as the :active state
 .btn-group.show .dropdown-toggle {
   @include box-shadow($btn-active-box-shadow);
 
-  // Show no shadow for `.btn-link` since it has no other button styles.
-  &.btn-link {
+    &.btn-link {
     @include box-shadow(none);
   }
 }
 
 
 //
-// Vertical button groups
 //
 
 .btn-group-vertical {
@@ -123,8 +108,7 @@
     margin-top: -$btn-border-width;
   }
 
-  // Reset rounded corners
-  > .btn:not(:last-child):not(.dropdown-toggle),
+    > .btn:not(:last-child):not(.dropdown-toggle),
   > .btn-group:not(:last-child) > .btn {
     @include border-bottom-radius(0);
   }
@@ -136,23 +120,13 @@
 }
 
 
-// Checkbox and radio options
 //
-// In order to support the browser's form validation feedback, powered by the
-// `required` attribute, we have to "hide" the inputs via `clip`. We cannot use
-// `display: none;` or `visibility: hidden;` as that also hides the popover.
-// Simply visually hiding the inputs via `opacity` would leave them clickable in
-// certain cases which is prevented by using `clip` and `pointer-events`.
-// This way, we ensure a DOM element is visible to position the popover from.
 //
-// See https://github.com/twbs/bootstrap/pull/12794 and
-// https://github.com/twbs/bootstrap/pull/14559 for more information.
 
 .btn-group-toggle {
   > .btn,
   > .btn-group > .btn {
-    margin-bottom: 0; // Override default `<label>` value
-
+    margin-bottom: 0; 
     input[type="radio"],
     input[type="checkbox"] {
       position: absolute;
diff --git a/files/assets/css/bootstrap/_buttons.scss b/files/assets/css/bootstrap/_buttons.scss
index e87d3393a..8153d20d4 100644
--- a/files/assets/css/bootstrap/_buttons.scss
+++ b/files/assets/css/bootstrap/_buttons.scss
@@ -1,7 +1,5 @@
-// stylelint-disable selector-no-qualifying-type
 
 //
-// Base styles
 //
 
 .btn {
@@ -30,8 +28,7 @@
     box-shadow: $btn-focus-box-shadow;
   }
 
-  // Disabled comes first so active can properly restyle
-  &.disabled,
+    &.disabled,
   &:disabled {
     opacity: $btn-disabled-opacity;
     @include box-shadow(none);
@@ -47,7 +44,6 @@
   }
 }
 
-// Future-proof disabling of clicks on `<a>` elements
 a.btn.disabled,
 fieldset:disabled a.btn {
   pointer-events: none;
@@ -55,7 +51,6 @@ fieldset:disabled a.btn {
 
 
 //
-// Alternate buttons
 //
 
 @each $color, $value in $theme-colors {
@@ -72,10 +67,8 @@ fieldset:disabled a.btn {
 
 
 //
-// Link buttons
 //
 
-// Make a button look and behave like a link
 .btn-link {
   font-weight: $font-weight-normal;
   color: $link-color;
@@ -98,12 +91,10 @@ fieldset:disabled a.btn {
     pointer-events: none;
   }
 
-  // No need for an active state here
-}
+  }
 
 
 //
-// Button Sizes
 //
 
 .btn-lg {
@@ -116,20 +107,17 @@ fieldset:disabled a.btn {
 
 
 //
-// Block button
 //
 
 .btn-block {
   display: block;
   width: 100%;
 
-  // Vertically space out multiple block buttons
-  + .btn-block {
+    + .btn-block {
     margin-top: $btn-block-spacing-y;
   }
 }
 
-// Specificity overrides
 input[type="submit"],
 input[type="reset"],
 input[type="button"] {
diff --git a/files/assets/css/bootstrap/_card.scss b/files/assets/css/bootstrap/_card.scss
index d6759fde6..b9847a647 100644
--- a/files/assets/css/bootstrap/_card.scss
+++ b/files/assets/css/bootstrap/_card.scss
@@ -1,13 +1,11 @@
 //
-// Base styles
 //
 
 .card {
   position: relative;
   display: flex;
   flex-direction: column;
-  min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106
-  height: $card-height;
+  min-width: 0;   height: $card-height;
   word-wrap: break-word;
   background-color: $card-bg;
   background-clip: border-box;
@@ -33,12 +31,8 @@
 }
 
 .card-body {
-  // Enable `flex-grow: 1` for decks and groups so that card blocks take up
-  // as much space as possible, ensuring footers are aligned to the bottom.
-  flex: 1 1 auto;
-  // Workaround for the image size bug in IE
-  // See: https://github.com/twbs/bootstrap/pull/28855
-  min-height: 1px;
+      flex: 1 1 auto;
+      min-height: 1px;
   padding: $card-spacer-x;
   color: $card-color;
 }
@@ -67,13 +61,11 @@
 }
 
 //
-// Optional textual caps
 //
 
 .card-header {
   padding: $card-spacer-y $card-spacer-x;
-  margin-bottom: 0; // Removes the default margin-bottom of <hN>
-  color: $card-cap-color;
+  margin-bottom: 0;   color: $card-cap-color;
   background-color: $card-cap-bg;
   border-bottom: $card-border-width solid $card-border-color;
 
@@ -100,7 +92,6 @@
 
 
 //
-// Header navs
 //
 
 .card-header-tabs {
@@ -115,7 +106,6 @@
   margin-left: -$card-spacer-x / 2;
 }
 
-// Card image
 .card-img-overlay {
   position: absolute;
   top: 0;
@@ -128,9 +118,7 @@
 .card-img,
 .card-img-top,
 .card-img-bottom {
-  flex-shrink: 0; // For IE: https://github.com/twbs/bootstrap/issues/29396
-  width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch
-}
+  flex-shrink: 0;   width: 100%; }
 
 .card-img,
 .card-img-top {
@@ -143,7 +131,6 @@
 }
 
 
-// Card deck
 
 .card-deck {
   .card {
@@ -157,35 +144,27 @@
     margin-left: -$card-deck-margin;
 
     .card {
-      // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4
-      flex: 1 0 0%;
+            flex: 1 0 0%;
       margin-right: $card-deck-margin;
-      margin-bottom: 0; // Override the default
-      margin-left: $card-deck-margin;
+      margin-bottom: 0;       margin-left: $card-deck-margin;
     }
   }
 }
 
 
 //
-// Card groups
 //
 
 .card-group {
-  // The child selector allows nested `.card` within `.card-group`
-  // to display properly.
-  > .card {
+      > .card {
     margin-bottom: $card-group-margin;
   }
 
   @include media-breakpoint-up(sm) {
     display: flex;
     flex-flow: row wrap;
-    // The child selector allows nested `.card` within `.card-group`
-    // to display properly.
-    > .card {
-      // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4
-      flex: 1 0 0%;
+            > .card {
+            flex: 1 0 0%;
       margin-bottom: 0;
 
       + .card {
@@ -193,20 +172,17 @@
         border-left: 0;
       }
 
-      // Handle rounded corners
-      @if $enable-rounded {
+            @if $enable-rounded {
         &:not(:last-child) {
           @include border-right-radius(0);
 
           .card-img-top,
           .card-header {
-            // stylelint-disable-next-line property-blacklist
-            border-top-right-radius: 0;
+                        border-top-right-radius: 0;
           }
           .card-img-bottom,
           .card-footer {
-            // stylelint-disable-next-line property-blacklist
-            border-bottom-right-radius: 0;
+                        border-bottom-right-radius: 0;
           }
         }
 
@@ -215,13 +191,11 @@
 
           .card-img-top,
           .card-header {
-            // stylelint-disable-next-line property-blacklist
-            border-top-left-radius: 0;
+                        border-top-left-radius: 0;
           }
           .card-img-bottom,
           .card-footer {
-            // stylelint-disable-next-line property-blacklist
-            border-bottom-left-radius: 0;
+                        border-bottom-left-radius: 0;
           }
         }
       }
@@ -231,7 +205,6 @@
 
 
 //
-// Columns
 //
 
 .card-columns {
@@ -246,15 +219,12 @@
     widows: 1;
 
     .card {
-      display: inline-block; // Don't let them vertically span multiple columns
-      width: 100%; // Don't let their width change
-    }
+      display: inline-block;       width: 100%;     }
   }
 }
 
 
 //
-// Accordion
 //
 
 .accordion {
diff --git a/files/assets/css/bootstrap/_carousel.scss b/files/assets/css/bootstrap/_carousel.scss
index fb5e9f856..71a827e00 100644
--- a/files/assets/css/bootstrap/_carousel.scss
+++ b/files/assets/css/bootstrap/_carousel.scss
@@ -1,15 +1,4 @@
-// Notes on the classes:
 //
-// 1. .carousel.pointer-event should ideally be pan-y (to allow for users to scroll vertically)
-//    even when their scroll action started on a carousel, but for compatibility (with Firefox)
-//    we're preventing all actions instead
-// 2. The .carousel-item-left and .carousel-item-right is used to indicate where
-//    the active slide is heading.
-// 3. .active.carousel-item is the current slide.
-// 4. .active.carousel-item-left and .active.carousel-item-right is the current
-//    slide in its in-transition state. Only one of these occurs at a time.
-// 5. .carousel-item-next.carousel-item-left and .carousel-item-prev.carousel-item-right
-//    is the upcoming slide in transition.
 
 .carousel {
   position: relative;
@@ -54,7 +43,6 @@
 
 
 //
-// Alternate transitions
 //
 
 .carousel-fade {
@@ -81,7 +69,6 @@
 
 
 //
-// Left/right controls for nav
 //
 
 .carousel-control-prev,
@@ -90,18 +77,13 @@
   top: 0;
   bottom: 0;
   z-index: 1;
-  // Use flex for alignment (1-3)
-  display: flex; // 1. allow flex styles
-  align-items: center; // 2. vertically center contents
-  justify-content: center; // 3. horizontally center contents
-  width: $carousel-control-width;
+    display: flex;   align-items: center;   justify-content: center;   width: $carousel-control-width;
   color: $carousel-control-color;
   text-align: center;
   opacity: $carousel-control-opacity;
   @include transition($carousel-control-transition);
 
-  // Hover/focus state
-  @include hover-focus() {
+    @include hover-focus() {
     color: $carousel-control-color;
     text-decoration: none;
     outline: 0;
@@ -121,7 +103,6 @@
   }
 }
 
-// Icons for within
 .carousel-control-prev-icon,
 .carousel-control-next-icon {
   display: inline-block;
@@ -137,10 +118,7 @@
 }
 
 
-// Optional indicator pips
 //
-// Add an ordered list with the following class and add a list item for each
-// slide your carousel holds.
 
 .carousel-indicators {
   position: absolute;
@@ -150,9 +128,7 @@
   z-index: 15;
   display: flex;
   justify-content: center;
-  padding-left: 0; // override <ol> default
-  // Use the .carousel-control's width as margin so we don't overlay those
-  margin-right: $carousel-control-width;
+  padding-left: 0;     margin-right: $carousel-control-width;
   margin-left: $carousel-control-width;
   list-style: none;
 
@@ -167,8 +143,7 @@
     cursor: pointer;
     background-color: $carousel-indicator-active-bg;
     background-clip: padding-box;
-    // Use transparent borders to increase the hit area by 10px on top and bottom.
-    border-top: $carousel-indicator-hit-area-height solid transparent;
+        border-top: $carousel-indicator-hit-area-height solid transparent;
     border-bottom: $carousel-indicator-hit-area-height solid transparent;
     opacity: .5;
     @include transition($carousel-indicator-transition);
@@ -180,7 +155,6 @@
 }
 
 
-// Optional captions
 //
 //
 
diff --git a/files/assets/css/bootstrap/_close.scss b/files/assets/css/bootstrap/_close.scss
index 071aebe80..48dd9e56a 100644
--- a/files/assets/css/bootstrap/_close.scss
+++ b/files/assets/css/bootstrap/_close.scss
@@ -7,8 +7,7 @@
   text-shadow: $close-text-shadow;
   opacity: .5;
 
-  // Override <a>'s hover style
-  @include hover() {
+    @include hover() {
     color: $close-color;
     text-decoration: none;
   }
@@ -20,12 +19,7 @@
   }
 }
 
-// Additional properties for button version
-// iOS requires the button element instead of an anchor tag.
-// If you want the anchor version, it requires `href="#"`.
-// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
 
-// stylelint-disable-next-line selector-no-qualifying-type
 button.close {
   padding: 0;
   background-color: transparent;
@@ -33,9 +27,7 @@ button.close {
   appearance: none;
 }
 
-// Future-proof disabling of clicks on `<a>` elements
 
-// stylelint-disable-next-line selector-no-qualifying-type
 a.close.disabled {
   pointer-events: none;
 }
diff --git a/files/assets/css/bootstrap/_code.scss b/files/assets/css/bootstrap/_code.scss
index 4bc117a96..03b1e4b11 100644
--- a/files/assets/css/bootstrap/_code.scss
+++ b/files/assets/css/bootstrap/_code.scss
@@ -1,16 +1,13 @@
-// Inline code
 code {
   @include font-size($code-font-size);
   color: $code-color;
   word-wrap: break-word;
 
-  // Streamline the style when inside anchors to avoid broken underline and more
-  a > & {
+    a > & {
     color: inherit;
   }
 }
 
-// User input typically entered via keyboard
 kbd {
   padding: $kbd-padding-y $kbd-padding-x;
   @include font-size($kbd-font-size);
@@ -27,21 +24,18 @@ kbd {
   }
 }
 
-// Blocks of code
 pre {
   display: block;
   @include font-size($code-font-size);
   color: $pre-color;
 
-  // Account for some code outputs that place code tags in pre tags
-  code {
+    code {
     @include font-size(inherit);
     color: inherit;
     word-break: normal;
   }
 }
 
-// Enable scrollable blocks of code
 .pre-scrollable {
   max-height: $pre-scrollable-max-height;
   overflow-y: scroll;
diff --git a/files/assets/css/bootstrap/_custom-forms.scss b/files/assets/css/bootstrap/_custom-forms.scss
index 6520c3d89..c40843b29 100644
--- a/files/assets/css/bootstrap/_custom-forms.scss
+++ b/files/assets/css/bootstrap/_custom-forms.scss
@@ -1,11 +1,6 @@
-// Embedded icons from Open Iconic.
-// Released under MIT and copyright 2014 Waybury.
-// https://useiconic.com/open
 
 
-// Checkboxes and radios
 //
-// Base class takes care of all the key behavioral aspects.
 
 .custom-control {
   position: relative;
@@ -22,8 +17,7 @@
 .custom-control-input {
   position: absolute;
   left: 0;
-  z-index: -1; // Put the input behind the label so it doesn't overlay text
-  width: $custom-control-indicator-size;
+  z-index: -1;   width: $custom-control-indicator-size;
   height: ($font-size-base * $line-height-base + $custom-control-indicator-size) / 2;
   opacity: 0;
 
@@ -35,8 +29,7 @@
   }
 
   &:focus ~ .custom-control-label::before {
-    // the mixin is not used here to make sure there is feedback
-    @if $enable-shadows {
+        @if $enable-shadows {
       box-shadow: $input-box-shadow, $input-focus-box-shadow;
     } @else {
       box-shadow: $custom-control-indicator-focus-box-shadow;
@@ -54,8 +47,7 @@
     @include box-shadow($custom-control-indicator-active-box-shadow);
   }
 
-  // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
-  &[disabled],
+    &[disabled],
   &:disabled {
     ~ .custom-control-label {
       color: $custom-control-label-disabled-color;
@@ -67,9 +59,7 @@
   }
 }
 
-// Custom control indicators
 //
-// Build the custom controls out of pseudo-elements.
 
 .custom-control-label {
   position: relative;
@@ -78,8 +68,7 @@
   vertical-align: top;
   cursor: $custom-control-cursor;
 
-  // Background-color and (when enabled) gradient
-  &::before {
+    &::before {
     position: absolute;
     top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
     left: -($custom-control-gutter + $custom-control-indicator-size);
@@ -93,8 +82,7 @@
     @include box-shadow($custom-control-indicator-box-shadow);
   }
 
-  // Foreground (icon)
-  &::after {
+    &::after {
     position: absolute;
     top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
     left: -($custom-control-gutter + $custom-control-indicator-size);
@@ -107,9 +95,7 @@
 }
 
 
-// Checkboxes
 //
-// Tweak just a few things for checkboxes.
 
 .custom-checkbox {
   .custom-control-label::before {
@@ -143,14 +129,11 @@
   }
 }
 
-// Radios
 //
-// Tweak just a few things for radios.
 
 .custom-radio {
   .custom-control-label::before {
-    // stylelint-disable-next-line property-blacklist
-    border-radius: $custom-radio-indicator-border-radius;
+        border-radius: $custom-radio-indicator-border-radius;
   }
 
   .custom-control-input:checked ~ .custom-control-label {
@@ -167,9 +150,7 @@
 }
 
 
-// switches
 //
-// Tweak a few things for switches
 
 .custom-switch {
   padding-left: $custom-switch-width + $custom-control-gutter;
@@ -179,8 +160,7 @@
       left: -($custom-switch-width + $custom-control-gutter);
       width: $custom-switch-width;
       pointer-events: all;
-      // stylelint-disable-next-line property-blacklist
-      border-radius: $custom-switch-indicator-border-radius;
+            border-radius: $custom-switch-indicator-border-radius;
     }
 
     &::after {
@@ -189,8 +169,7 @@
       width: $custom-switch-indicator-size;
       height: $custom-switch-indicator-size;
       background-color: $custom-control-indicator-border-color;
-      // stylelint-disable-next-line property-blacklist
-      border-radius: $custom-switch-indicator-border-radius;
+            border-radius: $custom-switch-indicator-border-radius;
       @include transition(transform .15s ease-in-out, $custom-forms-transition);
     }
   }
@@ -210,10 +189,7 @@
 }
 
 
-// Select
 //
-// Replaces the browser default select with a custom one, mostly pulled from
-// https://primer.github.io/.
 //
 
 .custom-select {
@@ -243,12 +219,7 @@
     }
 
     &::-ms-value {
-      // For visual consistency with other platforms/browsers,
-      // suppress the default white text on blue background highlight given to
-      // the selected option text when the (still closed) <select> receives focus
-      // in IE and (under certain conditions) Edge.
-      // See https://github.com/twbs/bootstrap/issues/19398.
-      color: $input-color;
+                                    color: $input-color;
       background-color: $input-bg;
     }
   }
@@ -265,13 +236,11 @@
     background-color: $custom-select-disabled-bg;
   }
 
-  // Hides the default caret in IE11
-  &::-ms-expand {
+    &::-ms-expand {
     display: none;
   }
 
-  // Remove outline from select box in FF
-  &:-moz-focusring {
+    &:-moz-focusring {
     color: transparent;
     text-shadow: 0 0 0 $custom-select-color;
   }
@@ -294,9 +263,7 @@
 }
 
 
-// File
 //
-// Custom file input.
 
 .custom-file {
   position: relative;
@@ -319,8 +286,7 @@
     box-shadow: $custom-file-focus-box-shadow;
   }
 
-  // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
-  &[disabled] ~ .custom-file-label,
+    &[disabled] ~ .custom-file-label,
   &:disabled ~ .custom-file-label {
     background-color: $custom-file-disabled-bg;
   }
@@ -371,25 +337,18 @@
   }
 }
 
-// Range
 //
-// Style range inputs the same across browsers. Vendor-specific rules for pseudo
-// elements cannot be mixed. As such, there are no shared styles for focus or
-// active states on prefixed selectors.
 
 .custom-range {
   width: 100%;
   height: add($custom-range-thumb-height, $custom-range-thumb-focus-box-shadow-width * 2);
-  padding: 0; // Need to reset padding
-  background-color: transparent;
+  padding: 0;   background-color: transparent;
   appearance: none;
 
   &:focus {
     outline: none;
 
-    // Pseudo-elements must be split across multiple rulesets to have an effect.
-    // No box-shadow() mixin for focus accessibility.
-    &::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
+            &::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
     &::-moz-range-thumb     { box-shadow: $custom-range-thumb-focus-box-shadow; }
     &::-ms-thumb            { box-shadow: $custom-range-thumb-focus-box-shadow; }
   }
@@ -401,8 +360,7 @@
   &::-webkit-slider-thumb {
     width: $custom-range-thumb-width;
     height: $custom-range-thumb-height;
-    margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2; // Webkit specific
-    @include gradient-bg($custom-range-thumb-bg);
+    margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2;     @include gradient-bg($custom-range-thumb-bg);
     border: $custom-range-thumb-border;
     @include border-radius($custom-range-thumb-border-radius);
     @include box-shadow($custom-range-thumb-box-shadow);
@@ -417,8 +375,7 @@
   &::-webkit-slider-runnable-track {
     width: $custom-range-track-width;
     height: $custom-range-track-height;
-    color: transparent; // Why?
-    cursor: $custom-range-track-cursor;
+    color: transparent;     cursor: $custom-range-track-cursor;
     background-color: $custom-range-track-bg;
     border-color: transparent;
     @include border-radius($custom-range-track-border-radius);
@@ -446,18 +403,14 @@
     color: transparent;
     cursor: $custom-range-track-cursor;
     background-color: $custom-range-track-bg;
-    border-color: transparent; // Firefox specific?
-    @include border-radius($custom-range-track-border-radius);
+    border-color: transparent;     @include border-radius($custom-range-track-border-radius);
     @include box-shadow($custom-range-track-box-shadow);
   }
 
   &::-ms-thumb {
     width: $custom-range-thumb-width;
     height: $custom-range-thumb-height;
-    margin-top: 0; // Edge specific
-    margin-right: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
-    margin-left: $custom-range-thumb-focus-box-shadow-width;  // Workaround that overflowed box-shadow is hidden.
-    @include gradient-bg($custom-range-thumb-bg);
+    margin-top: 0;     margin-right: $custom-range-thumb-focus-box-shadow-width;     margin-left: $custom-range-thumb-focus-box-shadow-width;      @include gradient-bg($custom-range-thumb-bg);
     border: $custom-range-thumb-border;
     @include border-radius($custom-range-thumb-border-radius);
     @include box-shadow($custom-range-thumb-box-shadow);
@@ -486,8 +439,7 @@
   }
 
   &::-ms-fill-upper {
-    margin-right: 15px; // arbitrary?
-    background-color: $custom-range-track-bg;
+    margin-right: 15px;     background-color: $custom-range-track-bg;
     @include border-radius($custom-range-track-border-radius);
   }
 
diff --git a/files/assets/css/bootstrap/_dropdown.scss b/files/assets/css/bootstrap/_dropdown.scss
index 76f33a4fd..99ef962f9 100644
--- a/files/assets/css/bootstrap/_dropdown.scss
+++ b/files/assets/css/bootstrap/_dropdown.scss
@@ -1,4 +1,3 @@
-// The dropdown wrapper (`<div>`)
 .dropup,
 .dropright,
 .dropdown,
@@ -9,25 +8,20 @@
 .dropdown-toggle {
   white-space: nowrap;
 
-  // Generate the caret automatically
-  @include caret();
+    @include caret();
 }
 
-// The dropdown menu
 .dropdown-menu {
   position: absolute;
   top: 100%;
   left: 0;
   z-index: $zindex-dropdown;
-  display: none; // none by default, but block on "open" of the menu
-  float: left;
+  display: none;   float: left;
   min-width: $dropdown-min-width;
   padding: $dropdown-padding-y 0;
-  margin: $dropdown-spacer 0 0; // override default ul
-  @include font-size($dropdown-font-size);
+  margin: $dropdown-spacer 0 0;   @include font-size($dropdown-font-size);
   color: $dropdown-color;
-  text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
-  list-style: none;
+  text-align: left;   list-style: none;
   background-color: $dropdown-bg;
   background-clip: padding-box;
   border: $dropdown-border-width solid $dropdown-border-color;
@@ -51,8 +45,6 @@
   }
 }
 
-// Allow for dropdowns to go bottom up (aka, dropup-menu)
-// Just add .dropup after the standard .dropdown class and you're set.
 .dropup {
   .dropdown-menu {
     top: auto;
@@ -100,8 +92,6 @@
   }
 }
 
-// When enabled Popper.js, reset basic dropdown position
-// stylelint-disable-next-line no-duplicate-selectors
 .dropdown-menu {
   &[x-placement^="top"],
   &[x-placement^="right"],
@@ -112,29 +102,19 @@
   }
 }
 
-// Dividers (basically an `<hr>`) within the dropdown
 .dropdown-divider {
   @include nav-divider($dropdown-divider-bg, $dropdown-divider-margin-y, true);
 }
 
-// Links, buttons, and more within the dropdown menu
 //
-// `<button>`-specific styles are denoted with `// For <button>s`
 .dropdown-item {
   display: block;
-  width: 100%; // For `<button>`s
-  padding: $dropdown-item-padding-y $dropdown-item-padding-x;
+  width: 100%;   padding: $dropdown-item-padding-y $dropdown-item-padding-x;
   clear: both;
   font-weight: $font-weight-normal;
   color: $dropdown-link-color;
-  text-align: inherit; // For `<button>`s
-  white-space: nowrap; // prevent links from randomly breaking onto new lines
-  background-color: transparent; // For `<button>`s
-  border: 0; // For `<button>`s
-
-  // Prevent dropdown overflow if there's no padding
-  // See https://github.com/twbs/bootstrap/pull/27703
-  @if $dropdown-padding-y == 0 {
+  text-align: inherit;   white-space: nowrap;   background-color: transparent;   border: 0; 
+      @if $dropdown-padding-y == 0 {
     &:first-child {
       @include border-top-radius($dropdown-inner-border-radius);
     }
@@ -162,8 +142,7 @@
     color: $dropdown-link-disabled-color;
     pointer-events: none;
     background-color: transparent;
-    // Remove CSS gradients if they're enabled
-    @if $enable-gradients {
+        @if $enable-gradients {
       background-image: none;
     }
   }
@@ -173,17 +152,13 @@
   display: block;
 }
 
-// Dropdown section headers
 .dropdown-header {
   display: block;
   padding: $dropdown-padding-y $dropdown-item-padding-x;
-  margin-bottom: 0; // for use with heading elements
-  @include font-size($font-size-sm);
+  margin-bottom: 0;   @include font-size($font-size-sm);
   color: $dropdown-header-color;
-  white-space: nowrap; // as with > li > a
-}
+  white-space: nowrap; }
 
-// Dropdown text
 .dropdown-item-text {
   display: block;
   padding: $dropdown-item-padding-y $dropdown-item-padding-x;
diff --git a/files/assets/css/bootstrap/_forms.scss b/files/assets/css/bootstrap/_forms.scss
index b2edb7b27..00e9e2701 100644
--- a/files/assets/css/bootstrap/_forms.scss
+++ b/files/assets/css/bootstrap/_forms.scss
@@ -1,7 +1,5 @@
-// stylelint-disable selector-no-qualifying-type
 
 //
-// Textual form controls
 //
 
 .form-control {
@@ -18,60 +16,43 @@
   background-clip: padding-box;
   border: $input-border-width solid $input-border-color;
 
-  // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
-  @include border-radius($input-border-radius, 0);
+    @include border-radius($input-border-radius, 0);
 
   @include box-shadow($input-box-shadow);
   @include transition($input-transition);
 
-  // Unstyle the caret on `<select>`s in IE10+.
-  &::-ms-expand {
+    &::-ms-expand {
     background-color: transparent;
     border: 0;
   }
 
-  // Remove select outline from select box in FF
-  &:-moz-focusring {
+    &:-moz-focusring {
     color: transparent;
     text-shadow: 0 0 0 $input-color;
   }
 
-  // Customize the `:focus` state to imitate native WebKit styles.
-  @include form-control-focus($ignore-warning: true);
+    @include form-control-focus($ignore-warning: true);
 
-  // Placeholder
-  &::placeholder {
+    &::placeholder {
     color: $input-placeholder-color;
-    // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526.
-    opacity: 1;
+        opacity: 1;
   }
 
-  // Disabled and read-only inputs
-  //
-  // HTML5 says that controls under a fieldset > legend:first-child won't be
-  // disabled if the fieldset is disabled. Due to implementation difficulty, we
-  // don't honor that edge case; we style them as disabled anyway.
-  &:disabled,
+    //
+        &:disabled,
   &[readonly] {
     background-color: $input-disabled-bg;
-    // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.
-    opacity: 1;
+        opacity: 1;
   }
 }
 
 select.form-control {
   &:focus::-ms-value {
-    // Suppress the nested default white text on blue background highlight given to
-    // the selected option text when the (still closed) <select> receives focus
-    // in IE and (under certain conditions) Edge, as it looks bad and cannot be made to
-    // match the appearance of the native widget.
-    // See https://github.com/twbs/bootstrap/issues/19398.
-    color: $input-color;
+                        color: $input-color;
     background-color: $input-bg;
   }
 }
 
-// Make file inputs better match text inputs by forcing them to new lines.
 .form-control-file,
 .form-control-range {
   display: block;
@@ -80,17 +61,12 @@ select.form-control {
 
 
 //
-// Labels
 //
 
-// For use with horizontal and inline forms, when you need the label (or legend)
-// text to align with the form controls.
 .col-form-label {
   padding-top: add($input-padding-y, $input-border-width);
   padding-bottom: add($input-padding-y, $input-border-width);
-  margin-bottom: 0; // Override the `<label>/<legend>` default
-  @include font-size(inherit); // Override the `<legend>` default
-  line-height: $input-line-height;
+  margin-bottom: 0;   @include font-size(inherit);   line-height: $input-line-height;
 }
 
 .col-form-label-lg {
@@ -108,17 +84,13 @@ select.form-control {
 }
 
 
-// Readonly controls as plain text
 //
-// Apply class to a readonly input to make it appear like regular plain
-// text (without any border, background color, focus indicator)
 
 .form-control-plaintext {
   display: block;
   width: 100%;
   padding: $input-padding-y 0;
-  margin-bottom: 0; // match inputs if this class comes on inputs with default margins
-  @include font-size($input-font-size);
+  margin-bottom: 0;   @include font-size($input-font-size);
   line-height: $input-line-height;
   color: $input-plaintext-color;
   background-color: transparent;
@@ -133,12 +105,8 @@ select.form-control {
 }
 
 
-// Form control sizing
 //
-// Build on `.form-control` with modifier classes to decrease or increase the
-// height and font-size of form controls.
 //
-// Repeated in `_input_group.scss` to avoid Sass extend issues.
 
 .form-control-sm {
   height: $input-height-sm;
@@ -156,7 +124,6 @@ select.form-control {
   @include border-radius($input-border-radius-lg);
 }
 
-// stylelint-disable-next-line no-duplicate-selectors
 select.form-control {
   &[size],
   &[multiple] {
@@ -168,10 +135,7 @@ textarea.form-control {
   height: auto;
 }
 
-// Form groups
 //
-// Designed to help with the organization and spacing of vertical forms. For
-// horizontal forms, use the predefined grid classes.
 
 .form-group {
   margin-bottom: $form-group-margin-bottom;
@@ -183,9 +147,7 @@ textarea.form-control {
 }
 
 
-// Form grid
 //
-// Special replacement for our grid system's `.row` for tighter form layouts.
 
 .form-row {
   display: flex;
@@ -201,9 +163,7 @@ textarea.form-control {
 }
 
 
-// Checkboxes and radios
 //
-// Indent the labels to position radios/checkboxes as hanging controls.
 
 .form-check {
   position: relative;
@@ -216,25 +176,21 @@ textarea.form-control {
   margin-top: $form-check-input-margin-y;
   margin-left: -$form-check-input-gutter;
 
-  // Use [disabled] and :disabled for workaround https://github.com/twbs/bootstrap/issues/28247
-  &[disabled] ~ .form-check-label,
+    &[disabled] ~ .form-check-label,
   &:disabled ~ .form-check-label {
     color: $text-muted;
   }
 }
 
 .form-check-label {
-  margin-bottom: 0; // Override default `<label>` bottom margin
-}
+  margin-bottom: 0; }
 
 .form-check-inline {
   display: inline-flex;
   align-items: center;
-  padding-left: 0; // Override base .form-check
-  margin-right: $form-check-inline-margin-x;
+  padding-left: 0;   margin-right: $form-check-inline-margin-x;
 
-  // Undo .form-check-input defaults and add some `margin-right`.
-  .form-check-input {
+    .form-check-input {
     position: static;
     margin-top: 0;
     margin-right: $form-check-inline-input-margin-x;
@@ -243,40 +199,24 @@ textarea.form-control {
 }
 
 
-// Form validation
 //
-// Provide feedback to users when form field values are valid or invalid. Works
-// primarily for client-side validation via scoped `:invalid` and `:valid`
-// pseudo-classes but also includes `.is-invalid` and `.is-valid` classes for
-// server side validation.
 
 @each $state, $data in $form-validation-states {
   @include form-validation-state($state, map-get($data, color), map-get($data, icon));
 }
 
-// Inline forms
 //
-// Make forms appear inline(-block) by adding the `.form-inline` class. Inline
-// forms begin stacked on extra small (mobile) devices and then go inline when
-// viewports reach <768px.
 //
-// Requires wrapping inputs and labels with `.form-group` for proper display of
-// default HTML form controls and our custom form controls (e.g., input groups).
 
 .form-inline {
   display: flex;
   flex-flow: row wrap;
-  align-items: center; // Prevent shorter elements from growing to same height as others (e.g., small buttons growing to normal sized button height)
-
-  // Because we use flex, the initial sizing of checkboxes is collapsed and
-  // doesn't occupy the full-width (which is what we want for xs grid tier),
-  // so we force that here.
-  .form-check {
+  align-items: center; 
+        .form-check {
     width: 100%;
   }
 
-  // Kick in the inline
-  @include media-breakpoint-up(sm) {
+    @include media-breakpoint-up(sm) {
     label {
       display: flex;
       align-items: center;
@@ -284,8 +224,7 @@ textarea.form-control {
       margin-bottom: 0;
     }
 
-    // Inline-block all the things for "inline"
-    .form-group {
+        .form-group {
       display: flex;
       flex: 0 0 auto;
       flex-flow: row wrap;
@@ -293,15 +232,12 @@ textarea.form-control {
       margin-bottom: 0;
     }
 
-    // Allow folks to *not* use `.form-group`
-    .form-control {
+        .form-control {
       display: inline-block;
-      width: auto; // Prevent labels from stacking above inputs in `.form-group`
-      vertical-align: middle;
+      width: auto;       vertical-align: middle;
     }
 
-    // Make static controls behave like regular ones
-    .form-control-plaintext {
+        .form-control-plaintext {
       display: inline-block;
     }
 
@@ -310,9 +246,7 @@ textarea.form-control {
       width: auto;
     }
 
-    // Remove default margin on radios/checkboxes that were used for stacking, and
-    // then undo the floating of radios and checkboxes to match.
-    .form-check {
+            .form-check {
       display: flex;
       align-items: center;
       justify-content: center;
diff --git a/files/assets/css/bootstrap/_functions.scss b/files/assets/css/bootstrap/_functions.scss
index 695e6cd2f..d40a8f6e9 100644
--- a/files/assets/css/bootstrap/_functions.scss
+++ b/files/assets/css/bootstrap/_functions.scss
@@ -1,16 +1,11 @@
-// Bootstrap functions
 //
-// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.
 
-// Ascending
-// Used to evaluate Sass maps like our grid breakpoints.
 @mixin _assert-ascending($map, $map-name) {
   $prev-key: null;
   $prev-num: null;
   @each $key, $num in $map {
     @if $prev-num == null or unit($num) == "%" or unit($prev-num) == "%" {
-      // Do nothing
-    } @else if not comparable($prev-num, $num) {
+          } @else if not comparable($prev-num, $num) {
       @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
     } @else if $prev-num >= $num {
       @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
@@ -20,8 +15,6 @@
   }
 }
 
-// Starts at zero
-// Used to ensure the min-width of the lowest breakpoint starts at 0.
 @mixin _assert-starts-at-zero($map, $map-name: "$grid-breakpoints") {
   $values: map-values($map);
   $first-value: nth($values, 1);
@@ -30,14 +23,7 @@
   }
 }
 
-// Replace `$search` with `$replace` in `$string`
-// Used on our SVG icon backgrounds for custom forms.
 //
-// @author Hugo Giraudel
-// @param {String} $string - Initial string
-// @param {String} $search - Substring to replace
-// @param {String} $replace ('') - New value
-// @return {String} - Updated string
 @function str-replace($string, $search, $replace: "") {
   $index: str-index($string, $search);
 
@@ -48,7 +34,6 @@
   @return $string;
 }
 
-// See https://codepen.io/kevinweber/pen/dXWoRw
 @function escape-svg($string) {
   @if str-index($string, "data:image/svg+xml") {
     @each $char, $encoded in $escaped-characters {
@@ -59,7 +44,6 @@
   @return $string;
 }
 
-// Color contrast
 @function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) {
   $r: red($color);
   $g: green($color);
@@ -74,7 +58,6 @@
   }
 }
 
-// Retrieve color Sass maps
 @function color($key: "blue") {
   @return map-get($colors, $key);
 }
@@ -87,7 +70,6 @@
   @return map-get($grays, $key);
 }
 
-// Request a theme color level
 @function theme-color-level($color-name: "primary", $level: 0) {
   $color: theme-color($color-name);
   $color-base: if($level > 0, $black, $white);
@@ -96,7 +78,6 @@
   @return mix($color-base, $color, $level * $theme-color-interval);
 }
 
-// Return valid calc
 @function add($value1, $value2, $return-calc: true) {
   @if $value1 == null {
     @return $value2;
diff --git a/files/assets/css/bootstrap/_grid.scss b/files/assets/css/bootstrap/_grid.scss
index d36ee75d8..c3ff01a1c 100644
--- a/files/assets/css/bootstrap/_grid.scss
+++ b/files/assets/css/bootstrap/_grid.scss
@@ -1,21 +1,16 @@
-// Container widths
 //
-// Set the container width, and override it for fixed navbars in media queries.
 
 @if $enable-grid-classes {
-  // Single container class with breakpoint max-widths
-  .container {
+    .container {
     @include make-container();
     @include make-container-max-widths();
   }
 
-  // 100% wide container at all breakpoints
-  .container-fluid {
+    .container-fluid {
     @include make-container();
   }
 
-  // Responsive containers that are 100% wide until a breakpoint
-  @each $breakpoint, $container-max-width in $container-max-widths {
+    @each $breakpoint, $container-max-width in $container-max-widths {
     .container-#{$breakpoint} {
       @extend .container-fluid;
     }
@@ -37,18 +32,14 @@
 }
 
 
-// Row
 //
-// Rows contain your columns.
 
 @if $enable-grid-classes {
   .row {
     @include make-row();
   }
 
-  // Remove the negative margin from default .row, then the horizontal padding
-  // from all immediate children columns (to prevent runaway style inheritance).
-  .no-gutters {
+      .no-gutters {
     margin-right: 0;
     margin-left: 0;
 
@@ -60,9 +51,7 @@
   }
 }
 
-// Columns
 //
-// Common styles for small and large grid columns
 
 @if $enable-grid-classes {
   @include make-grid-columns();
diff --git a/files/assets/css/bootstrap/_images.scss b/files/assets/css/bootstrap/_images.scss
index b11b45a37..a35e99d06 100644
--- a/files/assets/css/bootstrap/_images.scss
+++ b/files/assets/css/bootstrap/_images.scss
@@ -1,16 +1,9 @@
-// Responsive images (ensure images don't scale beyond their parents)
 //
-// This is purposefully opt-in via an explicit class rather than being the default for all `<img>`s.
-// We previously tried the "images are responsive by default" approach in Bootstrap v2,
-// and abandoned it in Bootstrap v3 because it breaks lots of third-party widgets (including Google Maps)
-// which weren't expecting the images within themselves to be involuntarily resized.
-// See also https://github.com/twbs/bootstrap/issues/18178
 .img-fluid {
   @include img-fluid();
 }
 
 
-// Image thumbnails
 .img-thumbnail {
   padding: $thumbnail-padding;
   background-color: $thumbnail-bg;
@@ -18,17 +11,14 @@
   @include border-radius($thumbnail-border-radius);
   @include box-shadow($thumbnail-box-shadow);
 
-  // Keep them at most 100% wide
-  @include img-fluid();
+    @include img-fluid();
 }
 
 //
-// Figures
 //
 
 .figure {
-  // Ensures the caption's text aligns with the image.
-  display: inline-block;
+    display: inline-block;
 }
 
 .figure-img {
diff --git a/files/assets/css/bootstrap/_input-group.scss b/files/assets/css/bootstrap/_input-group.scss
index bf69ddb41..adcc4dec8 100644
--- a/files/assets/css/bootstrap/_input-group.scss
+++ b/files/assets/css/bootstrap/_input-group.scss
@@ -1,24 +1,19 @@
-// stylelint-disable selector-no-qualifying-type
 
 //
-// Base styles
 //
 
 .input-group {
   position: relative;
   display: flex;
-  flex-wrap: wrap; // For form validation feedback
-  align-items: stretch;
+  flex-wrap: wrap;   align-items: stretch;
   width: 100%;
 
   > .form-control,
   > .form-control-plaintext,
   > .custom-select,
   > .custom-file {
-    position: relative; // For focus state's z-index
-    flex: 1 1 0%;
-    min-width: 0; // https://stackoverflow.com/questions/36247140/why-dont-flex-items-shrink-past-content-size
-    margin-bottom: 0;
+    position: relative;     flex: 1 1 0%;
+    min-width: 0;     margin-bottom: 0;
 
     + .form-control,
     + .custom-select,
@@ -27,15 +22,13 @@
     }
   }
 
-  // Bring the "active" form control to the top of surrounding elements
-  > .form-control:focus,
+    > .form-control:focus,
   > .custom-select:focus,
   > .custom-file .custom-file-input:focus ~ .custom-file-label {
     z-index: 3;
   }
 
-  // Bring the custom file input above the label
-  > .custom-file .custom-file-input:focus {
+    > .custom-file .custom-file-input:focus {
     z-index: 4;
   }
 
@@ -45,9 +38,7 @@
     &:not(:first-child) { @include border-left-radius(0); }
   }
 
-  // Custom file inputs have more complex markup, thus requiring different
-  // border-radius overrides.
-  > .custom-file {
+      > .custom-file {
     display: flex;
     align-items: center;
 
@@ -58,20 +49,13 @@
 }
 
 
-// Prepend and append
 //
-// While it requires one extra layer of HTML for each, dedicated prepend and
-// append elements allow us to 1) be less clever, 2) simplify our selectors, and
-// 3) support HTML5 form validation.
 
 .input-group-prepend,
 .input-group-append {
   display: flex;
 
-  // Ensure buttons are always above inputs for more visually pleasing borders.
-  // This isn't needed for `.input-group-text` since it shares the same border-color
-  // as our inputs.
-  .btn {
+        .btn {
     position: relative;
     z-index: 2;
 
@@ -92,18 +76,13 @@
 .input-group-append { margin-left: -$input-border-width; }
 
 
-// Textual addons
 //
-// Serves as a catch-all element for any text or radio/checkbox input you wish
-// to prepend or append to an input.
 
 .input-group-text {
   display: flex;
   align-items: center;
   padding: $input-padding-y $input-padding-x;
-  margin-bottom: 0; // Allow use of <label> elements by overriding our default margin-bottom
-  @include font-size($input-font-size); // Match inputs
-  font-weight: $font-weight-normal;
+  margin-bottom: 0;   @include font-size($input-font-size);   font-weight: $font-weight-normal;
   line-height: $input-line-height;
   color: $input-group-addon-color;
   text-align: center;
@@ -112,18 +91,14 @@
   border: $input-border-width solid $input-group-addon-border-color;
   @include border-radius($input-border-radius);
 
-  // Nuke default margins from checkboxes and radios to vertically center within.
-  input[type="radio"],
+    input[type="radio"],
   input[type="checkbox"] {
     margin-top: 0;
   }
 }
 
 
-// Sizing
 //
-// Remix the default form control sizing classes into new ones for easier
-// manipulation.
 
 .input-group-lg > .form-control:not(textarea),
 .input-group-lg > .custom-select {
@@ -165,11 +140,7 @@
 }
 
 
-// Prepend and append rounded corners
 //
-// These rulesets must come after the sizing ones to properly override sm and lg
-// border-radius values when extending. They're more specific than we'd like
-// with the `.input-group >` part, but without it, we cannot override the sizing.
 
 
 .input-group > .input-group-prepend > .btn,
diff --git a/files/assets/css/bootstrap/_list-group.scss b/files/assets/css/bootstrap/_list-group.scss
index 468c2e31a..6d72297fe 100644
--- a/files/assets/css/bootstrap/_list-group.scss
+++ b/files/assets/css/bootstrap/_list-group.scss
@@ -1,31 +1,20 @@
-// Base class
 //
-// Easily usable on <ul>, <ol>, or <div>.
 
 .list-group {
   display: flex;
   flex-direction: column;
 
-  // No need to set list-style: none; since .list-group-item is block level
-  padding-left: 0; // reset padding because ul and ol
-  margin-bottom: 0;
+    padding-left: 0;   margin-bottom: 0;
 }
 
 
-// Interactive list items
 //
-// Use anchor or button elements instead of `li`s or `div`s to create interactive
-// list items. Includes an extra `.active` modifier class for selected items.
 
 .list-group-item-action {
-  width: 100%; // For `<button>`s (anchors become 100% by default though)
-  color: $list-group-action-color;
-  text-align: inherit; // For `<button>`s (anchors inherit)
-
-  // Hover state
-  @include hover-focus() {
-    z-index: 1; // Place hover/focus items above their siblings for proper border styling
-    color: $list-group-action-hover-color;
+  width: 100%;   color: $list-group-action-color;
+  text-align: inherit; 
+    @include hover-focus() {
+    z-index: 1;     color: $list-group-action-hover-color;
     text-decoration: none;
     background-color: $list-group-hover-bg;
   }
@@ -37,9 +26,7 @@
 }
 
 
-// Individual list items
 //
-// Use on `li`s or `div`s within the `.list-group` parent.
 
 .list-group-item {
   position: relative;
@@ -64,10 +51,8 @@
     background-color: $list-group-disabled-bg;
   }
 
-  // Include both here for `<a>`s and `<button>`s
-  &.active {
-    z-index: 2; // Place active items above their siblings for proper border styling
-    color: $list-group-active-color;
+    &.active {
+    z-index: 2;     color: $list-group-active-color;
     background-color: $list-group-active-bg;
     border-color: $list-group-active-border-color;
   }
@@ -83,9 +68,7 @@
 }
 
 
-// Horizontal
 //
-// Change the layout of list group items from vertical (default) to horizontal.
 
 @each $breakpoint in map-keys($grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
@@ -124,10 +107,7 @@
 }
 
 
-// Flush list items
 //
-// Remove borders and border-radius to keep list group items edge-to-edge. Most
-// useful within other components (e.g., cards).
 
 .list-group-flush {
   .list-group-item {
@@ -148,10 +128,7 @@
 }
 
 
-// Contextual variants
 //
-// Add modifier classes to change text and background color on individual items.
-// Organizationally, this must come after the `:hover` states.
 
 @each $color, $value in $theme-colors {
   @include list-group-item-variant($color, theme-color-level($color, -9), theme-color-level($color, 6));
diff --git a/files/assets/css/bootstrap/_mixins.scss b/files/assets/css/bootstrap/_mixins.scss
index 7e7a23d25..4d61cbd33 100644
--- a/files/assets/css/bootstrap/_mixins.scss
+++ b/files/assets/css/bootstrap/_mixins.scss
@@ -1,14 +1,9 @@
-// Toggles
 //
-// Used in conjunction with global variables to enable certain theme features.
 
-// Vendor
 @import "vendor/rfs";
 
-// Deprecate
 @import "mixins/deprecate";
 
-// Utilities
 @import "mixins/breakpoints";
 @import "mixins/hover";
 @import "mixins/image";
@@ -22,7 +17,6 @@
 @import "mixins/text-truncate";
 @import "mixins/visibility";
 
-// Components
 @import "mixins/alert";
 @import "mixins/buttons";
 @import "mixins/caret";
@@ -33,14 +27,12 @@
 @import "mixins/forms";
 @import "mixins/table-row";
 
-// Skins
 @import "mixins/background-variant";
 @import "mixins/border-radius";
 @import "mixins/box-shadow";
 @import "mixins/gradients";
 @import "mixins/transition";
 
-// Layout
 @import "mixins/clearfix";
 @import "mixins/grid-framework";
 @import "mixins/grid";
diff --git a/files/assets/css/bootstrap/_modal.scss b/files/assets/css/bootstrap/_modal.scss
index 9053c173f..2cfbb6522 100644
--- a/files/assets/css/bootstrap/_modal.scss
+++ b/files/assets/css/bootstrap/_modal.scss
@@ -1,12 +1,7 @@
-// .modal-open      - body class for killing the scroll
-// .modal           - container to scroll within
-// .modal-dialog    - positioning shell for the actual modal
-// .modal-content   - actual modal w/ bg and corners and stuff
 
 
 .modal-open {
-  // Kill the scroll on the body
-  overflow: hidden;
+    overflow: hidden;
 
   .modal {
     overflow-x: hidden;
@@ -14,7 +9,6 @@
   }
 }
 
-// Container that the modal scrolls within
 .modal {
   position: fixed;
   top: 0;
@@ -24,24 +18,16 @@
   width: 100%;
   height: 100%;
   overflow: hidden;
-  // Prevent Chrome on Windows from adding a focus outline. For details, see
-  // https://github.com/twbs/bootstrap/pull/10951.
-  outline: 0;
-  // We deliberately don't use `-webkit-overflow-scrolling: touch;` due to a
-  // gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342
-  // See also https://github.com/twbs/bootstrap/issues/17695
-}
+      outline: 0;
+      }
 
-// Shell div to position the modal with bottom padding
 .modal-dialog {
   position: relative;
   width: auto;
   margin: $modal-dialog-margin;
-  // allow clicks to pass through for custom click handling to close modal
-  pointer-events: none;
+    pointer-events: none;
 
-  // When fading in the modal, animate it to slide down
-  .modal.fade & {
+    .modal.fade & {
     @include transition($modal-transition);
     transform: $modal-fade-transform;
   }
@@ -49,19 +35,16 @@
     transform: $modal-show-transform;
   }
 
-  // When trying to close, animate focus to scale
-  .modal.modal-static & {
+    .modal.modal-static & {
     transform: $modal-scale-transform;
   }
 }
 
 .modal-dialog-scrollable {
-  display: flex; // IE10/11
-  max-height: subtract(100%, $modal-dialog-margin * 2);
+  display: flex;   max-height: subtract(100%, $modal-dialog-margin * 2);
 
   .modal-content {
-    max-height: subtract(100vh, $modal-dialog-margin * 2); // IE10/11
-    overflow: hidden;
+    max-height: subtract(100vh, $modal-dialog-margin * 2);     overflow: hidden;
   }
 
   .modal-header,
@@ -79,15 +62,12 @@
   align-items: center;
   min-height: subtract(100%, $modal-dialog-margin * 2);
 
-  // Ensure `modal-dialog-centered` extends the full height of the view (IE10/11)
-  &::before {
-    display: block; // IE10
-    height: subtract(100vh, $modal-dialog-margin * 2);
+    &::before {
+    display: block;     height: subtract(100vh, $modal-dialog-margin * 2);
     content: "";
   }
 
-  // Ensure `.modal-body` shows scrollbar (IE10/11)
-  &.modal-dialog-scrollable {
+    &.modal-dialog-scrollable {
     flex-direction: column;
     justify-content: center;
     height: 100%;
@@ -102,25 +82,20 @@
   }
 }
 
-// Actual modal
 .modal-content {
   position: relative;
   display: flex;
   flex-direction: column;
-  width: 100%; // Ensure `.modal-content` extends the full width of the parent `.modal-dialog`
-  // counteract the pointer-events: none; in the .modal-dialog
-  color: $modal-content-color;
+  width: 100%;     color: $modal-content-color;
   pointer-events: auto;
   background-color: $modal-content-bg;
   background-clip: padding-box;
   border: $modal-content-border-width solid $modal-content-border-color;
   @include border-radius($modal-content-border-radius);
   @include box-shadow($modal-content-box-shadow-xs);
-  // Remove focus outline from opened modal
-  outline: 0;
+    outline: 0;
 }
 
-// Modal background
 .modal-backdrop {
   position: fixed;
   top: 0;
@@ -130,64 +105,45 @@
   height: 100vh;
   background-color: $modal-backdrop-bg;
 
-  // Fade for backdrop
-  &.fade { opacity: 0; }
+    &.fade { opacity: 0; }
   &.show { opacity: $modal-backdrop-opacity; }
 }
 
-// Modal header
-// Top section of the modal w/ title and dismiss
 .modal-header {
   display: flex;
-  align-items: flex-start; // so the close btn always stays on the upper right corner
-  justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
-  padding: $modal-header-padding;
+  align-items: flex-start;   justify-content: space-between;   padding: $modal-header-padding;
   border-bottom: $modal-header-border-width solid $modal-header-border-color;
   @include border-top-radius($modal-content-inner-border-radius);
 
   .close {
     padding: $modal-header-padding;
-    // auto on the left force icon to the right even when there is no .modal-title
-    margin: (-$modal-header-padding-y) (-$modal-header-padding-x) (-$modal-header-padding-y) auto;
+        margin: (-$modal-header-padding-y) (-$modal-header-padding-x) (-$modal-header-padding-y) auto;
   }
 }
 
-// Title text within header
 .modal-title {
   margin-bottom: 0;
   line-height: $modal-title-line-height;
 }
 
-// Modal body
-// Where all modal content resides (sibling of .modal-header and .modal-footer)
 .modal-body {
   position: relative;
-  // Enable `flex-grow: 1` so that the body take up as much space as possible
-  // when there should be a fixed height on `.modal-dialog`.
-  flex: 1 1 auto;
+      flex: 1 1 auto;
   padding: $modal-inner-padding;
 }
 
-// Footer (for actions)
 .modal-footer {
   display: flex;
   flex-wrap: wrap;
-  align-items: center; // vertically center
-  justify-content: flex-end; // Right align buttons with flex property because text-align doesn't work on flex items
-  padding: $modal-inner-padding - $modal-footer-margin-between / 2;
+  align-items: center;   justify-content: flex-end;   padding: $modal-inner-padding - $modal-footer-margin-between / 2;
   border-top: $modal-footer-border-width solid $modal-footer-border-color;
   @include border-bottom-radius($modal-content-inner-border-radius);
 
-  // Place margin between footer elements
-  // This solution is far from ideal because of the universal selector usage,
-  // but is needed to fix https://github.com/twbs/bootstrap/issues/24800
-  // stylelint-disable-next-line selector-max-universal
-  > * {
+          > * {
     margin: $modal-footer-margin-between / 2;
   }
 }
 
-// Measure scrollbar width for padding body during modal show/hide
 .modal-scrollbar-measure {
   position: absolute;
   top: -9999px;
@@ -196,10 +152,8 @@
   overflow: scroll;
 }
 
-// Scale up the modal
 @include media-breakpoint-up(sm) {
-  // Automatically set modal's width for larger viewports
-  .modal-dialog {
+    .modal-dialog {
     max-width: $modal-md;
     margin: $modal-dialog-margin-y-sm-up auto;
   }
diff --git a/files/assets/css/bootstrap/_nav.scss b/files/assets/css/bootstrap/_nav.scss
index 667d68272..17ec192b0 100644
--- a/files/assets/css/bootstrap/_nav.scss
+++ b/files/assets/css/bootstrap/_nav.scss
@@ -1,7 +1,4 @@
-// Base class
 //
-// Kickstart any navigation component with a set of style resets. Works with
-// `<nav>`s, `<ul>`s or `<ol>`s.
 
 .nav {
   display: flex;
@@ -19,8 +16,7 @@
     text-decoration: none;
   }
 
-  // Disabled state lightens text
-  &.disabled {
+    &.disabled {
     color: $nav-link-disabled-color;
     pointer-events: none;
     cursor: default;
@@ -28,7 +24,6 @@
 }
 
 //
-// Tabs
 //
 
 .nav-tabs {
@@ -61,16 +56,13 @@
   }
 
   .dropdown-menu {
-    // Make dropdown border overlap tab border
-    margin-top: -$nav-tabs-border-width;
-    // Remove the top rounded corners here since there is a hard edge above the menu
-    @include border-top-radius(0);
+        margin-top: -$nav-tabs-border-width;
+        @include border-top-radius(0);
   }
 }
 
 
 //
-// Pills
 //
 
 .nav-pills {
@@ -87,7 +79,6 @@
 
 
 //
-// Justified variants
 //
 
 .nav-fill {
@@ -106,9 +97,7 @@
 }
 
 
-// Tabbable tabs
 //
-// Hide tabbable panes to start, show them when `.active`
 
 .tab-content {
   > .tab-pane {
diff --git a/files/assets/css/bootstrap/_navbar.scss b/files/assets/css/bootstrap/_navbar.scss
index 5f10a62f1..328d009a5 100644
--- a/files/assets/css/bootstrap/_navbar.scss
+++ b/files/assets/css/bootstrap/_navbar.scss
@@ -1,31 +1,15 @@
-// Contents
 //
-// Navbar
-// Navbar brand
-// Navbar nav
-// Navbar text
-// Navbar divider
-// Responsive navbar
-// Navbar position
-// Navbar themes
 
 
-// Navbar
 //
-// Provide a static navbar from which we expand to create full-width, fixed, and
-// other navbar variations.
 
 .navbar {
   position: relative;
   display: flex;
-  flex-wrap: wrap; // allow us to do the line break for collapsing content
-  align-items: center;
-  justify-content: space-between; // space out brand from logo
-  padding: $navbar-padding-y $navbar-padding-x;
+  flex-wrap: wrap;   align-items: center;
+  justify-content: space-between;   padding: $navbar-padding-y $navbar-padding-x;
 
-  // Because flex properties aren't inherited, we need to redeclare these first
-  // few properties so that content nested within behave properly.
-  %container-flex-properties {
+      %container-flex-properties {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
@@ -45,9 +29,7 @@
 }
 
 
-// Navbar brand
 //
-// Used for brand, project, or site names.
 
 .navbar-brand {
   display: inline-block;
@@ -64,14 +46,11 @@
 }
 
 
-// Navbar nav
 //
-// Custom navbar navigation (doesn't require `.nav`, but does make use of `.nav-link`).
 
 .navbar-nav {
   display: flex;
-  flex-direction: column; // cannot use `inherit` to get the `.navbar`s value
-  padding-left: 0;
+  flex-direction: column;   padding-left: 0;
   margin-bottom: 0;
   list-style: none;
 
@@ -87,7 +66,6 @@
 }
 
 
-// Navbar text
 //
 //
 
@@ -98,38 +76,25 @@
 }
 
 
-// Responsive navbar
 //
-// Custom styles for responsive collapsing and toggling of navbar contents.
-// Powered by the collapse Bootstrap JavaScript plugin.
 
-// When collapsed, prevent the toggleable navbar contents from appearing in
-// the default flexbox row orientation. Requires the use of `flex-wrap: wrap`
-// on the `.navbar` parent.
 .navbar-collapse {
   flex-basis: 100%;
   flex-grow: 1;
-  // For always expanded or extra full navbars, ensure content aligns itself
-  // properly vertically. Can be easily overridden with flex utilities.
-  align-items: center;
+      align-items: center;
 }
 
-// Button for toggling the navbar when in its collapsed state
 .navbar-toggler {
   padding: $navbar-toggler-padding-y $navbar-toggler-padding-x;
   @include font-size($navbar-toggler-font-size);
   line-height: 1;
-  background-color: transparent; // remove default button style
-  border: $border-width solid transparent; // remove default button style
-  @include border-radius($navbar-toggler-border-radius);
+  background-color: transparent;   border: $border-width solid transparent;   @include border-radius($navbar-toggler-border-radius);
 
   @include hover-focus() {
     text-decoration: none;
   }
 }
 
-// Keep as a separate element so folks can easily override it with another icon
-// or image file as needed.
 .navbar-toggler-icon {
   display: inline-block;
   width: 1.5em;
@@ -140,8 +105,6 @@
   background-size: 100% 100%;
 }
 
-// Generate series of `.navbar-expand-*` responsive classes for configuring
-// where your navbar collapses.
 .navbar-expand {
   @each $breakpoint in map-keys($grid-breakpoints) {
     $next: breakpoint-next($breakpoint, $grid-breakpoints);
@@ -183,8 +146,7 @@
           }
         }
 
-        // For nesting containers, have to redeclare for alignment purposes
-        %container-nesting-#{$breakpoint} {
+                %container-nesting-#{$breakpoint} {
           flex-wrap: nowrap;
         }
 
@@ -200,10 +162,8 @@
         }
 
         .navbar-collapse {
-          display: flex !important; // stylelint-disable-line declaration-no-important
-
-          // Changes flex-bases to auto because of an IE10 bug
-          flex-basis: auto;
+          display: flex !important; 
+                    flex-basis: auto;
         }
 
         .navbar-toggler {
@@ -215,11 +175,8 @@
 }
 
 
-// Navbar themes
 //
-// Styles for switching between navbars with light or dark background.
 
-// Dark links against a light background
 .navbar-light {
   .navbar-brand {
     color: $navbar-light-brand-color;
@@ -271,7 +228,6 @@
   }
 }
 
-// White links against a dark background
 .navbar-dark {
   .navbar-brand {
     color: $navbar-dark-brand-color;
diff --git a/files/assets/css/bootstrap/_pagination.scss b/files/assets/css/bootstrap/_pagination.scss
index 953a35a7f..45e1f2fb3 100644
--- a/files/assets/css/bootstrap/_pagination.scss
+++ b/files/assets/css/bootstrap/_pagination.scss
@@ -52,8 +52,7 @@
   &.disabled .page-link {
     color: $pagination-disabled-color;
     pointer-events: none;
-    // Opinionated: remove the "hand" cursor set previously for .page-link
-    cursor: auto;
+        cursor: auto;
     background-color: $pagination-disabled-bg;
     border-color: $pagination-disabled-border-color;
   }
@@ -61,7 +60,6 @@
 
 
 //
-// Sizing
 //
 
 .pagination-lg {
diff --git a/files/assets/css/bootstrap/_popover.scss b/files/assets/css/bootstrap/_popover.scss
index 0ad76af3e..20e189f38 100644
--- a/files/assets/css/bootstrap/_popover.scss
+++ b/files/assets/css/bootstrap/_popover.scss
@@ -5,12 +5,9 @@
   z-index: $zindex-popover;
   display: block;
   max-width: $popover-max-width;
-  // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
-  // So reset our font and text properties to avoid inheriting weird values.
-  @include reset-text();
+      @include reset-text();
   @include font-size($popover-font-size);
-  // Allow breaking very long words so they don't overflow the popover's bounds
-  word-wrap: break-word;
+    word-wrap: break-word;
   background-color: $popover-bg;
   background-clip: padding-box;
   border: $popover-border-width solid $popover-border-color;
@@ -62,8 +59,7 @@
     left: subtract(-$popover-arrow-height, $popover-border-width);
     width: $popover-arrow-height;
     height: $popover-arrow-width;
-    margin: $popover-border-radius 0; // make sure the arrow does not touch the popover's rounded corners
-
+    margin: $popover-border-radius 0; 
     &::before {
       left: 0;
       border-width: ($popover-arrow-width / 2) $popover-arrow-height ($popover-arrow-width / 2) 0;
@@ -97,8 +93,7 @@
     }
   }
 
-  // This will remove the popover-header's border just below the arrow
-  .popover-header::before {
+    .popover-header::before {
     position: absolute;
     top: 0;
     left: 50%;
@@ -117,8 +112,7 @@
     right: subtract(-$popover-arrow-height, $popover-border-width);
     width: $popover-arrow-height;
     height: $popover-arrow-width;
-    margin: $popover-border-radius 0; // make sure the arrow does not touch the popover's rounded corners
-
+    margin: $popover-border-radius 0; 
     &::before {
       right: 0;
       border-width: ($popover-arrow-width / 2) 0 ($popover-arrow-width / 2) $popover-arrow-height;
@@ -149,11 +143,9 @@
 }
 
 
-// Offset the popover to account for the popover arrow
 .popover-header {
   padding: $popover-header-padding-y $popover-header-padding-x;
-  margin-bottom: 0; // Reset the default from Reboot
-  @include font-size($font-size-base);
+  margin-bottom: 0;   @include font-size($font-size-base);
   color: $popover-header-color;
   background-color: $popover-header-bg;
   border-bottom: $popover-border-width solid darken($popover-header-bg, 5%);
diff --git a/files/assets/css/bootstrap/_print.scss b/files/assets/css/bootstrap/_print.scss
index 56ed457a7..7320e42f3 100644
--- a/files/assets/css/bootstrap/_print.scss
+++ b/files/assets/css/bootstrap/_print.scss
@@ -1,21 +1,12 @@
-// stylelint-disable declaration-no-important, selector-no-qualifying-type
 
-// Source: https://github.com/h5bp/dark.css/blob/master/src/_print.css
 
-// ==========================================================================
-// Print styles.
-// Inlined to avoid the additional HTTP request:
-// https://www.phpied.com/delay-loading-your-print-css/
-// ==========================================================================
 
 @if $enable-print-styles {
   @media print {
     *,
     *::before,
     *::after {
-      // Bootstrap specific; comment out `color` and `background`
-      //color: $black !important; // Black prints faster
-      text-shadow: none !important;
+            //color: $black !important;       text-shadow: none !important;
       //background: transparent !important;
       box-shadow: none !important;
     }
@@ -26,39 +17,30 @@
       }
     }
 
-    // Bootstrap specific; comment the following selector out
-    //a[href]::after {
-    //  content: " (" attr(href) ")";
-    //}
+        //a[href]::after {
+        //}
 
     abbr[title]::after {
       content: " (" attr(title) ")";
     }
 
-    // Bootstrap specific; comment the following selector out
-    //
-    // Don't show links that are fragment identifiers,
-    // or use the `javascript:` pseudo protocol
-    //
+        //
+            //
 
     //a[href^="#"]::after,
     //a[href^="javascript:"]::after {
-    // content: "";
-    //}
+        //}
 
     pre {
       white-space: pre-wrap !important;
     }
     pre,
     blockquote {
-      border: $border-width solid $gray-500; // Bootstrap custom code; using `$border-width` instead of 1px
-      page-break-inside: avoid;
+      border: $border-width solid $gray-500;       page-break-inside: avoid;
     }
 
     //
-    // Printing Tables:
-    // https://web.archive.org/web/20180815150934/https://css-discuss.incutio.com/wiki/Printing_Tables
-    //
+            //
 
     thead {
       display: table-header-group;
@@ -81,12 +63,8 @@
       page-break-after: avoid;
     }
 
-    // Bootstrap specific changes start
-
-    // Specify a size and min-width to make printing closer across browsers.
-    // We don't set margin here because it breaks `size` in Chrome. We also
-    // don't use `!important` on `size` as it breaks in Chrome.
-    @page {
+    
+                @page {
       size: $print-page-size;
     }
     body {
@@ -96,8 +74,7 @@
       min-width: $print-body-min-width !important;
     }
 
-    // Bootstrap components
-    .navbar {
+        .navbar {
       display: none;
     }
     .badge {
@@ -136,6 +113,5 @@
       border-color: $table-border-color;
     }
 
-    // Bootstrap specific changes end
-  }
+      }
 }
diff --git a/files/assets/css/bootstrap/_progress.scss b/files/assets/css/bootstrap/_progress.scss
index 37ef6022e..86ee9c223 100644
--- a/files/assets/css/bootstrap/_progress.scss
+++ b/files/assets/css/bootstrap/_progress.scss
@@ -1,4 +1,3 @@
-// Disable animation if transitions are disabled
 @if $enable-transitions {
   @keyframes progress-bar-stripes {
     from { background-position: $progress-height 0; }
@@ -9,8 +8,7 @@
 .progress {
   display: flex;
   height: $progress-height;
-  overflow: hidden; // force rounded corners by cropping it
-  @include font-size($progress-font-size);
+  overflow: hidden;   @include font-size($progress-font-size);
   background-color: $progress-bg;
   @include border-radius($progress-border-radius);
   @include box-shadow($progress-box-shadow);
diff --git a/files/assets/css/bootstrap/_reboot.scss b/files/assets/css/bootstrap/_reboot.scss
index 08580e38b..9bdacfb93 100644
--- a/files/assets/css/bootstrap/_reboot.scss
+++ b/files/assets/css/bootstrap/_reboot.scss
@@ -1,124 +1,63 @@
-// stylelint-disable at-rule-no-vendor-prefix, declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix
 
-// Reboot
 //
-// Normalization of HTML elements, manually forked from Normalize.css to remove
-// styles targeting irrelevant browsers while applying new styles.
 //
-// Normalize is licensed MIT. https://github.com/necolas/normalize.css
 
 
-// Document
 //
-// 1. Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
-// 2. Change the default font family in all browsers.
-// 3. Correct the line height in all browsers.
-// 4. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.
-// 5. Change the default tap highlight to be completely transparent in iOS.
 
 *,
 *::before,
 *::after {
-  box-sizing: border-box; // 1
-}
+  box-sizing: border-box; }
 
 html {
-  font-family: sans-serif; // 2
-  line-height: 1.15; // 3
-  -webkit-text-size-adjust: 100%; // 4
-  -webkit-tap-highlight-color: rgba($black, 0); // 5
-}
+  font-family: sans-serif;   line-height: 1.15;   -webkit-text-size-adjust: 100%;   -webkit-tap-highlight-color: rgba($black, 0); }
 
-// Shim for "new" HTML5 structural elements to display correctly (IE10, older browsers)
-// TODO: remove in v5
-// stylelint-disable-next-line selector-list-comma-newline-after
 article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
   display: block;
 }
 
-// Body
 //
-// 1. Remove the margin in all browsers.
-// 2. As a best practice, apply a default `background-color`.
-// 3. Set an explicit initial text-align value so that we can later use
-//    the `inherit` value on things like `<th>` elements.
 
 body {
-  margin: 0; // 1
-  font-family: $font-family-base;
+  margin: 0;   font-family: $font-family-base;
   @include font-size($font-size-base);
   font-weight: $font-weight-base;
   line-height: $line-height-base;
   color: $body-color;
-  text-align: left; // 3
-  background-color: $body-bg; // 2
-}
+  text-align: left;   background-color: $body-bg; }
 
-// Future-proof rule: in browsers that support :focus-visible, suppress the focus outline
-// on elements that programmatically receive focus but wouldn't normally show a visible
-// focus outline. In general, this would mean that the outline is only applied if the
-// interaction that led to the element receiving programmatic focus was a keyboard interaction,
-// or the browser has somehow determined that the user is primarily a keyboard user and/or
-// wants focus outlines to always be presented.
 //
-// See https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible
-// and https://developer.paciellogroup.com/blog/2018/03/focus-visible-and-backwards-compatibility/
 [tabindex="-1"]:focus:not(:focus-visible) {
   outline: 0 !important;
 }
 
 
-// Content grouping
 //
-// 1. Add the correct box sizing in Firefox.
-// 2. Show the overflow in Edge and IE.
 
 hr {
-  box-sizing: content-box; // 1
-  height: 0; // 1
-  overflow: visible; // 2
-}
+  box-sizing: content-box;   height: 0;   overflow: visible; }
 
 
 //
-// Typography
 //
 
-// Remove top margins from headings
 //
-// By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
-// margin for easier control within type scales as it avoids margin collapsing.
-// stylelint-disable-next-line selector-list-comma-newline-after
 h1, h2, h3, h4, h5, h6 {
   margin-top: 0;
   margin-bottom: $headings-margin-bottom;
 }
 
-// Reset margins on paragraphs
 //
-// Similarly, the top margin on `<p>`s get reset. However, we also reset the
-// bottom margin to use `rem` units instead of `em`.
 p {
   margin-top: 0;
   margin-bottom: $paragraph-margin-bottom;
 }
 
-// Abbreviations
 //
-// 1. Duplicate behavior to the data-bs-* attribute for our tooltip plugin
-// 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
-// 3. Add explicit cursor to indicate changed behavior.
-// 4. Remove the bottom border in Firefox 39-.
-// 5. Prevent the text-decoration to be skipped.
 
 abbr[title],
-abbr[data-bs-original-title] { // 1
-  text-decoration: underline; // 2
-  text-decoration: underline dotted; // 2
-  cursor: help; // 3
-  border-bottom: 0; // 4
-  text-decoration-skip-ink: none; // 5
-}
+abbr[data-bs-original-title] {   text-decoration: underline;   text-decoration: underline dotted;   cursor: help;   border-bottom: 0;   text-decoration-skip-ink: none; }
 
 address {
   margin-bottom: 1rem;
@@ -146,8 +85,7 @@ dt {
 
 dd {
   margin-bottom: .5rem;
-  margin-left: 0; // Undo browser default
-}
+  margin-left: 0; }
 
 blockquote {
   margin: 0 0 1rem;
@@ -155,16 +93,12 @@ blockquote {
 
 b,
 strong {
-  font-weight: $font-weight-bolder; // Add the correct font weight in Chrome, Edge, and Safari
-}
+  font-weight: $font-weight-bolder; }
 
 small {
-  @include font-size(80%); // Add the correct font size in all browsers
-}
+  @include font-size(80%); }
 
 //
-// Prevent `sub` and `sup` elements from affecting the line height in
-// all browsers.
 //
 
 sub,
@@ -180,24 +114,18 @@ sup { top: -.5em; }
 
 
 //
-// Links
 //
 
 a {
   color: $link-color;
   text-decoration: $link-decoration;
-  background-color: transparent; // Remove the gray background on active links in IE 10.
-
+  background-color: transparent; 
   @include hover() {
     color: $link-hover-color;
     text-decoration: $link-hover-decoration;
   }
 }
 
-// And undo these styles for placeholder links/named anchors (without href).
-// It would be more straightforward to just use a[href] in previous block, but that
-// causes specificity issues in many other styles that are too complex to fix.
-// See https://github.com/twbs/bootstrap/issues/19402
 
 a:not([href]) {
   color: inherit;
@@ -211,7 +139,6 @@ a:not([href]) {
 
 
 //
-// Code
 //
 
 pre,
@@ -219,53 +146,41 @@ code,
 kbd,
 samp {
   font-family: $font-family-monospace;
-  @include font-size(1em); // Correct the odd `em` font sizing in all browsers.
-}
+  @include font-size(1em); }
 
 pre {
-  // Remove browser default top margin
-  margin-top: 0;
-  // Reset browser default of `1em` to use `rem`s
-  margin-bottom: 1rem;
-  // Don't allow content to break outside
-  overflow: auto;
+    margin-top: 0;
+    margin-bottom: 1rem;
+    overflow: auto;
 }
 
 
 //
-// Figures
 //
 
 figure {
-  // Apply a consistent margin strategy (matches our type styles).
-  margin: 0 0 1rem;
+    margin: 0 0 1rem;
 }
 
 
 //
-// Images and content
 //
 
 img {
   vertical-align: middle;
-  border-style: none; // Remove the border on images inside links in IE 10-.
-}
+  border-style: none; }
 
 svg {
-  // Workaround for the SVG overflow bug in IE10/11 is still required.
-  // See https://github.com/twbs/bootstrap/issues/26878
-  overflow: hidden;
+      overflow: hidden;
   vertical-align: middle;
 }
 
 
 //
-// Tables
 //
 
 table {
-  border-collapse: collapse; // Prevent double borders
-}
+  border-collapse: collapse; }
 
 caption {
   padding-top: $table-cell-padding;
@@ -276,34 +191,24 @@ caption {
 }
 
 th {
-  // Matches default `<td>` alignment by inheriting from the `<body>`, or the
-  // closest parent with a set `text-align`.
-  text-align: inherit;
+      text-align: inherit;
 }
 
 
 //
-// Forms
 //
 
 label {
-  // Allow labels to use `margin` for spacing.
-  display: inline-block;
+    display: inline-block;
   margin-bottom: $label-margin-bottom;
 }
 
-// Remove the default `border-radius` that macOS Chrome adds.
 //
-// Details at https://github.com/twbs/bootstrap/issues/24093
 button {
-  // stylelint-disable-next-line property-blacklist
-  border-radius: 0;
+    border-radius: 0;
 }
 
-// Work around a Firefox/IE bug where the transparent `button` background
-// results in a loss of the default `button` focus styles.
 //
-// Credit: https://github.com/suitcss/base/
 button:focus {
   outline: 1px dotted;
   outline: 5px auto -webkit-focus-ring-color;
@@ -314,41 +219,30 @@ button,
 select,
 optgroup,
 textarea {
-  margin: 0; // Remove the margin in Firefox and Safari
-  font-family: inherit;
+  margin: 0;   font-family: inherit;
   @include font-size(inherit);
   line-height: inherit;
 }
 
 button,
 input {
-  overflow: visible; // Show the overflow in Edge
-}
+  overflow: visible; }
 
 button,
 select {
-  text-transform: none; // Remove the inheritance of text transform in Firefox
-}
+  text-transform: none; }
 
-// Remove the inheritance of word-wrap in Safari.
 //
-// Details at https://github.com/twbs/bootstrap/issues/24990
 select {
   word-wrap: normal;
 }
 
 
-// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
-//    controls in Android 4.
-// 2. Correct the inability to style clickable types in iOS and Safari.
 button,
-[type="button"], // 1
-[type="reset"],
+[type="button"], [type="reset"],
 [type="submit"] {
-  -webkit-appearance: button; // 2
-}
+  -webkit-appearance: button; }
 
-// Opinionated: add "hand" cursor to non-disabled button elements.
 @if $enable-pointer-cursor-for-buttons {
   button,
   [type="button"],
@@ -360,7 +254,6 @@ button,
   }
 }
 
-// Remove inner border and padding from Firefox, but don't restore the outline like Normalize.
 button::-moz-focus-inner,
 [type="button"]::-moz-focus-inner,
 [type="reset"]::-moz-focus-inner,
@@ -371,77 +264,49 @@ button::-moz-focus-inner,
 
 input[type="radio"],
 input[type="checkbox"] {
-  box-sizing: border-box; // 1. Add the correct box sizing in IE 10-
-  padding: 0; // 2. Remove the padding in IE 10-
-}
+  box-sizing: border-box;   padding: 0; }
 
 
 input[type="date"],
 input[type="time"],
 input[type="datetime-local"],
 input[type="month"] {
-  // Remove the default appearance of temporal inputs to avoid a Mobile Safari
-  // bug where setting a custom line-height prevents text from being vertically
-  // centered within the input.
-  // See https://bugs.webkit.org/show_bug.cgi?id=139848
-  // and https://github.com/twbs/bootstrap/issues/11266
-  -webkit-appearance: listbox;
+            -webkit-appearance: listbox;
 }
 
 textarea {
-  overflow: auto; // Remove the default vertical scrollbar in IE.
-  // Textareas should really only resize vertically so they don't break their (horizontal) containers.
-  resize: vertical;
+  overflow: auto;     resize: vertical;
 }
 
 fieldset {
-  // Browsers set a default `min-width: min-content;` on fieldsets,
-  // unlike e.g. `<div>`s, which have `min-width: 0;` by default.
-  // So we reset that to ensure fieldsets behave more like a standard block element.
-  // See https://github.com/twbs/bootstrap/issues/12359
-  // and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements
-  min-width: 0;
-  // Reset the default outline behavior of fieldsets so they don't affect page layout.
-  padding: 0;
+            min-width: 0;
+    padding: 0;
   margin: 0;
   border: 0;
 }
 
-// 1. Correct the text wrapping in Edge and IE.
-// 2. Correct the color inheritance from `fieldset` elements in IE.
 legend {
   display: block;
   width: 100%;
-  max-width: 100%; // 1
-  padding: 0;
+  max-width: 100%;   padding: 0;
   margin-bottom: .5rem;
   @include font-size(1.5rem);
   line-height: inherit;
-  color: inherit; // 2
-  white-space: normal; // 1
-}
+  color: inherit;   white-space: normal; }
 
 progress {
-  vertical-align: baseline; // Add the correct vertical alignment in Chrome, Firefox, and Opera.
-}
+  vertical-align: baseline; }
 
-// Correct the cursor style of increment and decrement buttons in Chrome.
 [type="number"]::-webkit-inner-spin-button,
 [type="number"]::-webkit-outer-spin-button {
   height: auto;
 }
 
 [type="search"] {
-  // This overrides the extra rounded corners on search inputs in iOS so that our
-  // `.form-control` class can properly style them. Note that this cannot simply
-  // be added to `.form-control` as it's not specific enough. For details, see
-  // https://github.com/twbs/bootstrap/issues/11586.
-  outline-offset: -2px; // 2. Correct the outline style in Safari.
-  -webkit-appearance: none;
+          outline-offset: -2px;   -webkit-appearance: none;
 }
 
 //
-// Remove the inner padding in Chrome and Safari on macOS.
 //
 
 [type="search"]::-webkit-search-decoration {
@@ -449,17 +314,12 @@ progress {
 }
 
 //
-// 1. Correct the inability to style clickable types in iOS and Safari.
-// 2. Change font properties to `inherit` in Safari.
 //
 
 ::-webkit-file-upload-button {
-  font: inherit; // 2
-  -webkit-appearance: button; // 1
-}
+  font: inherit;   -webkit-appearance: button; }
 
 //
-// Correct element displays
 //
 
 output {
@@ -467,16 +327,12 @@ output {
 }
 
 summary {
-  display: list-item; // Add the correct display in all browsers
-  cursor: pointer;
+  display: list-item;   cursor: pointer;
 }
 
 template {
-  display: none; // Add the correct display in IE
-}
+  display: none; }
 
-// Always hide an element with the `hidden` HTML attribute (from PureCSS).
-// Needed for proper display in IE 10-.
 [hidden] {
   display: none !important;
 }
diff --git a/files/assets/css/bootstrap/_root.scss b/files/assets/css/bootstrap/_root.scss
index 8110030c6..5afb445ab 100644
--- a/files/assets/css/bootstrap/_root.scss
+++ b/files/assets/css/bootstrap/_root.scss
@@ -1,7 +1,5 @@
-// Do not forget to update getting-started/theming.md!
 :root {
-  // Custom variable values only support SassScript inside `#{}`.
-  @each $color, $value in $colors {
+    @each $color, $value in $colors {
     --#{$color}: #{$value};
   }
 
@@ -13,8 +11,6 @@
     --breakpoint-#{$bp}: #{$value};
   }
 
-  // Use `inspect` for lists so that quoted items keep the quotes.
-  // See https://github.com/sass/sass/issues/2383#issuecomment-336349172
-  --font-family-sans-serif: #{inspect($font-family-sans-serif)};
+      --font-family-sans-serif: #{inspect($font-family-sans-serif)};
   --font-family-monospace: #{inspect($font-family-monospace)};
 }
diff --git a/files/assets/css/bootstrap/_spinners.scss b/files/assets/css/bootstrap/_spinners.scss
index 364a5c1a6..5b1d997b6 100644
--- a/files/assets/css/bootstrap/_spinners.scss
+++ b/files/assets/css/bootstrap/_spinners.scss
@@ -1,5 +1,4 @@
 //
-// Rotating border
 //
 
 @keyframes spinner-border {
@@ -13,8 +12,7 @@
   vertical-align: text-bottom;
   border: $spinner-border-width solid currentColor;
   border-right-color: transparent;
-  // stylelint-disable-next-line property-blacklist
-  border-radius: 50%;
+    border-radius: 50%;
   animation: spinner-border .75s linear infinite;
 }
 
@@ -25,7 +23,6 @@
 }
 
 //
-// Growing circle
 //
 
 @keyframes spinner-grow {
@@ -43,8 +40,7 @@
   height: $spinner-height;
   vertical-align: text-bottom;
   background-color: currentColor;
-  // stylelint-disable-next-line property-blacklist
-  border-radius: 50%;
+    border-radius: 50%;
   opacity: 0;
   animation: spinner-grow .75s linear infinite;
 }
diff --git a/files/assets/css/bootstrap/_tables.scss b/files/assets/css/bootstrap/_tables.scss
index 5fd77a4eb..6e363aa4f 100644
--- a/files/assets/css/bootstrap/_tables.scss
+++ b/files/assets/css/bootstrap/_tables.scss
@@ -1,13 +1,11 @@
 //
-// Basic Bootstrap table
 //
 
 .table {
   width: 100%;
   margin-bottom: $spacer;
   color: $table-color;
-  background-color: $table-bg; // Reset for nesting within parents with `background-color`.
-
+  background-color: $table-bg; 
   th,
   td {
     padding: $table-cell-padding;
@@ -27,7 +25,6 @@
 
 
 //
-// Condensed table w/ half padding
 //
 
 .table-sm {
@@ -38,9 +35,7 @@
 }
 
 
-// Border versions
 //
-// Add or remove borders all around the table and between all the columns.
 
 .table-bordered {
   border: $table-border-width solid $table-border-color;
@@ -67,9 +62,7 @@
   }
 }
 
-// Zebra-striping
 //
-// Default zebra-stripe styles (alternating gray and transparent backgrounds)
 
 .table-striped {
   tbody tr:nth-of-type(#{$table-striped-order}) {
@@ -78,9 +71,7 @@
 }
 
 
-// Hover effect
 //
-// Placed here since it has to come after the potential zebra striping
 
 .table-hover {
   tbody tr {
@@ -92,10 +83,7 @@
 }
 
 
-// Table backgrounds
 //
-// Exact selectors below required to override `.table-striped` and prevent
-// inheritance to nested tables.
 
 @each $color, $value in $theme-colors {
   @include table-row-variant($color, theme-color-level($color, $table-bg-level), theme-color-level($color, $table-border-level));
@@ -104,11 +92,8 @@
 @include table-row-variant(active, $table-active-bg);
 
 
-// Dark styles
 //
-// Same table markup, but inverted color scheme: dark background and light text.
 
-// stylelint-disable-next-line no-duplicate-selectors
 .table {
   .thead-dark {
     th {
@@ -158,10 +143,7 @@
 }
 
 
-// Responsive tables
 //
-// Generate series of `.table-responsive-*` classes for configuring the screen
-// size of where your table will overflow.
 
 .table-responsive {
   @each $breakpoint in map-keys($grid-breakpoints) {
@@ -175,8 +157,7 @@
         overflow-x: auto;
         -webkit-overflow-scrolling: touch;
 
-        // Prevent double border on horizontal scroll due to use of `display: block;`
-        > .table-bordered {
+                > .table-bordered {
           border: 0;
         }
       }
diff --git a/files/assets/css/bootstrap/_toasts.scss b/files/assets/css/bootstrap/_toasts.scss
index 6aa5352a3..41181666c 100644
--- a/files/assets/css/bootstrap/_toasts.scss
+++ b/files/assets/css/bootstrap/_toasts.scss
@@ -1,7 +1,6 @@
 .toast {
   max-width: $toast-max-width;
-  overflow: hidden; // cheap rounded corners on nested items
-  @include font-size($toast-font-size);
+  overflow: hidden;   @include font-size($toast-font-size);
   color: $toast-color;
   background-color: $toast-background-color;
   background-clip: padding-box;
@@ -40,5 +39,4 @@
 }
 
 .toast-body {
-  padding: $toast-padding-x; // apply to both vertical and horizontal
-}
+  padding: $toast-padding-x; }
diff --git a/files/assets/css/bootstrap/_tooltip.scss b/files/assets/css/bootstrap/_tooltip.scss
index 6b3aa62dd..9d672caa7 100644
--- a/files/assets/css/bootstrap/_tooltip.scss
+++ b/files/assets/css/bootstrap/_tooltip.scss
@@ -1,15 +1,11 @@
-// Base class
 .tooltip {
   position: absolute;
   z-index: $zindex-tooltip;
   display: block;
   margin: $tooltip-margin;
-  // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
-  // So reset our font and text properties to avoid inheriting weird values.
-  @include reset-text();
+      @include reset-text();
   @include font-size($tooltip-font-size);
-  // Allow breaking very long words so they don't overflow the tooltip's bounds
-  word-wrap: break-word;
+    word-wrap: break-word;
   opacity: 0;
 
   &.show { opacity: $tooltip-opacity; }
@@ -104,7 +100,6 @@
   }
 }
 
-// Wrapper for the tooltip content
 .tooltip-inner {
   max-width: $tooltip-max-width;
   padding: $tooltip-padding-y $tooltip-padding-x;
diff --git a/files/assets/css/bootstrap/_type.scss b/files/assets/css/bootstrap/_type.scss
index 43dde7d0f..cbe22ac44 100644
--- a/files/assets/css/bootstrap/_type.scss
+++ b/files/assets/css/bootstrap/_type.scss
@@ -1,7 +1,5 @@
-// stylelint-disable declaration-no-important, selector-list-comma-newline-after
 
 //
-// Headings
 //
 
 h1, h2, h3, h4, h5, h6,
@@ -25,7 +23,6 @@ h6, .h6 { @include font-size($h6-font-size); }
   font-weight: $lead-font-weight;
 }
 
-// Type display classes
 .display-1 {
   @include font-size($display1-size);
   font-weight: $display1-weight;
@@ -49,7 +46,6 @@ h6, .h6 { @include font-size($h6-font-size); }
 
 
 //
-// Horizontal rules
 //
 
 hr {
@@ -61,7 +57,6 @@ hr {
 
 
 //
-// Emphasis
 //
 
 small,
@@ -78,14 +73,12 @@ mark,
 
 
 //
-// Lists
 //
 
 .list-unstyled {
   @include list-unstyled();
 }
 
-// Inline turns list items into inline-block
 .list-inline {
   @include list-unstyled();
 }
@@ -99,16 +92,13 @@ mark,
 
 
 //
-// Misc
 //
 
-// Builds on `abbr`
 .initialism {
   @include font-size(90%);
   text-transform: uppercase;
 }
 
-// Blockquotes
 .blockquote {
   margin-bottom: $spacer;
   @include font-size($blockquote-font-size);
@@ -120,6 +110,5 @@ mark,
   color: $blockquote-small-color;
 
   &::before {
-    content: "\2014\00A0"; // em dash, nbsp
-  }
+    content: "\2014\00A0";   }
 }
diff --git a/files/assets/css/bootstrap/_variables.scss b/files/assets/css/bootstrap/_variables.scss
index f8f1ed3e1..4853e9667 100644
--- a/files/assets/css/bootstrap/_variables.scss
+++ b/files/assets/css/bootstrap/_variables.scss
@@ -1,9 +1,5 @@
-// Variables
 //
-// Variables should follow the `$component-state-property-size` formula for
-// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
 
-// Color system
 
 $white:    #fff !default;
 $gray-100: #f8f9fa !default;
@@ -18,7 +14,6 @@ $gray-900: #212529 !default;
 $black:    #000 !default;
 
 $grays: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $grays: map-merge(
   (
     "100": $gray-100,
@@ -46,7 +41,6 @@ $teal:    #20c997 !default;
 $cyan:    #17a2b8 !default;
 
 $colors: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $colors: map-merge(
   (
     "blue":       $blue,
@@ -76,7 +70,6 @@ $light:         $gray-100 !default;
 $dark:          $gray-800 !default;
 
 $theme-colors: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $theme-colors: map-merge(
   (
     "primary":    $primary,
@@ -91,17 +84,13 @@ $theme-colors: map-merge(
   $theme-colors
 );
 
-// Set a specific jump point for requesting color jumps
 $theme-color-interval:      8% !default;
 
-// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255.
 $yiq-contrasted-threshold:  150 !default;
 
-// Customize the light and dark text colors for use in our YIQ color contrast function.
 $yiq-text-dark:             $gray-900 !default;
 $yiq-text-light:            $white !default;
 
-// Characters which are escaped by the escape-svg function
 $escaped-characters: (
   ("<","%3c"),
   (">","%3e"),
@@ -109,9 +98,7 @@ $escaped-characters: (
 ) !default;
 
 
-// Options
 //
-// Quickly modify global styling by enabling or disabling optional features.
 
 $enable-caret:                                true !default;
 $enable-rounded:                              true !default;
@@ -119,8 +106,7 @@ $enable-shadows:                              false !default;
 $enable-gradients:                            false !default;
 $enable-transitions:                          true !default;
 $enable-prefers-reduced-motion-media-query:   true !default;
-$enable-hover-media-query:                    false !default; // Deprecated, no longer affects any compiled CSS
-$enable-grid-classes:                         true !default;
+$enable-hover-media-query:                    false !default; $enable-grid-classes:                         true !default;
 $enable-pointer-cursor-for-buttons:           true !default;
 $enable-print-styles:                         true !default;
 $enable-responsive-font-sizes:                false !default;
@@ -128,15 +114,10 @@ $enable-validation-icons:                     true !default;
 $enable-deprecation-messages:                 true !default;
 
 
-// Spacing
 //
-// Control the default styling of most Bootstrap elements by modifying these
-// variables. Mostly focused on spacing.
-// You can add more entries to the $spacers map, should you need more variation.
 
 $spacer: 1rem !default;
 $spacers: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $spacers: map-merge(
   (
     0: 0,
@@ -149,9 +130,7 @@ $spacers: map-merge(
   $spacers
 );
 
-// This variable affects the `.h-*` and `.w-*` classes.
 $sizes: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $sizes: map-merge(
   (
     25: 25%,
@@ -164,36 +143,26 @@ $sizes: map-merge(
 );
 
 
-// Body
 //
-// Settings for the `<body>` element.
 
 $body-bg:                   $white !default;
 $body-color:                $gray-900 !default;
 
 
-// Links
 //
-// Style anchor elements.
 
 $link-color:                              theme-color("primary") !default;
 $link-decoration:                         none !default;
 $link-hover-color:                        darken($link-color, 15%) !default;
 $link-hover-decoration:                   underline !default;
-// Darken percentage for links with `.text-*` class (e.g. `.text-success`)
 $emphasized-link-hover-darken-percentage: 15% !default;
 
-// Paragraphs
 //
-// Style p element.
 
 $paragraph-margin-bottom:   1rem !default;
 
 
-// Grid breakpoints
 //
-// Define the minimum dimensions at which your layout will change,
-// adapting to different screen sizes, for use in media queries.
 
 $grid-breakpoints: (
   xs: 0,
@@ -207,9 +176,7 @@ $grid-breakpoints: (
 @include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints");
 
 
-// Grid containers
 //
-// Define the maximum width of `.container` for different screen sizes.
 
 $container-max-widths: (
   sm: 540px,
@@ -221,18 +188,14 @@ $container-max-widths: (
 @include _assert-ascending($container-max-widths, "$container-max-widths");
 
 
-// Grid columns
 //
-// Set the number of columns and specify the width of the gutters.
 
 $grid-columns:                12 !default;
 $grid-gutter-width:           30px !default;
 $grid-row-columns:            6 !default;
 
 
-// Components
 //
-// Define common padding and border radius sizes and more.
 
 $line-height-lg:              1.5 !default;
 $line-height-sm:              1.5 !default;
@@ -262,7 +225,6 @@ $transition-fade:             opacity .15s linear !default;
 $transition-collapse:         height .35s ease !default;
 
 $embed-responsive-aspect-ratios: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $embed-responsive-aspect-ratios: join(
   (
     (21 9),
@@ -273,18 +235,13 @@ $embed-responsive-aspect-ratios: join(
   $embed-responsive-aspect-ratios
 );
 
-// Typography
 //
-// Font, line-height, and color for body text, headings, and more.
 
-// stylelint-disable value-keyword-case
 $font-family-sans-serif:      -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
 $font-family-monospace:       SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
 $font-family-base:            $font-family-sans-serif !default;
-// stylelint-enable value-keyword-case
 
-$font-size-base:              1rem !default; // Assumes the browser default, typically `16px`
-$font-size-lg:                $font-size-base * 1.25 !default;
+$font-size-base:              1rem !default; $font-size-lg:                $font-size-base * 1.25 !default;
 $font-size-sm:                $font-size-base * .875 !default;
 
 $font-weight-lighter:         lighter !default;
@@ -348,9 +305,7 @@ $mark-bg:                     #fcf8e3 !default;
 $hr-margin-y:                 $spacer !default;
 
 
-// Tables
 //
-// Customizes the `.table` component with basic values, each used across all table variations.
 
 $table-cell-padding:          .75rem !default;
 $table-cell-padding-sm:       .3rem !default;
@@ -383,9 +338,7 @@ $table-bg-level:              -9 !default;
 $table-border-level:          -6 !default;
 
 
-// Buttons + Forms
 //
-// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
 
 $input-btn-padding-y:         .375rem !default;
 $input-btn-padding-x:         .75rem !default;
@@ -410,17 +363,14 @@ $input-btn-line-height-lg:    $line-height-lg !default;
 $input-btn-border-width:      $border-width !default;
 
 
-// Buttons
 //
-// For each of Bootstrap's buttons, define text, background, and border color.
 
 $btn-padding-y:               $input-btn-padding-y !default;
 $btn-padding-x:               $input-btn-padding-x !default;
 $btn-font-family:             $input-btn-font-family !default;
 $btn-font-size:               $input-btn-font-size !default;
 $btn-line-height:             $input-btn-line-height !default;
-$btn-white-space:             null !default; // Set to `nowrap` to prevent text wrapping
-
+$btn-white-space:             null !default; 
 $btn-padding-y-sm:            $input-btn-padding-y-sm !default;
 $btn-padding-x-sm:            $input-btn-padding-x-sm !default;
 $btn-font-size-sm:            $input-btn-font-size-sm !default;
@@ -444,7 +394,6 @@ $btn-link-disabled-color:     $gray-600 !default;
 
 $btn-block-spacing-y:         .5rem !default;
 
-// Allows for customizing button radius independently from global border radius
 $btn-border-radius:           $border-radius !default;
 $btn-border-radius-lg:        $border-radius-lg !default;
 $btn-border-radius-sm:        $border-radius-sm !default;
@@ -452,7 +401,6 @@ $btn-border-radius-sm:        $border-radius-sm !default;
 $btn-transition:              color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
 
 
-// Forms
 
 $label-margin-bottom:                   .5rem !default;
 
@@ -576,18 +524,15 @@ $custom-select-padding-x:           $input-padding-x !default;
 $custom-select-font-family:         $input-font-family !default;
 $custom-select-font-size:           $input-font-size !default;
 $custom-select-height:              $input-height !default;
-$custom-select-indicator-padding:   1rem !default; // Extra padding to account for the presence of the background-image based indicator
-$custom-select-font-weight:         $input-font-weight !default;
+$custom-select-indicator-padding:   1rem !default; $custom-select-font-weight:         $input-font-weight !default;
 $custom-select-line-height:         $input-line-height !default;
 $custom-select-color:               $input-color !default;
 $custom-select-disabled-color:      $gray-600 !default;
 $custom-select-bg:                  $input-bg !default;
 $custom-select-disabled-bg:         $gray-200 !default;
-$custom-select-bg-size:             8px 10px !default; // In pixels because image dimensions
-$custom-select-indicator-color:     $gray-800 !default;
+$custom-select-bg-size:             8px 10px !default; $custom-select-indicator-color:     $gray-800 !default;
 $custom-select-indicator:           url("data:image/svg+xml,<svg xmlns='https://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") !default;
-$custom-select-background:          escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
-
+$custom-select-background:          escape-svg($custom-select-indicator) no-repeat right $custom-select-padding-x center / $custom-select-bg-size !default; 
 $custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default;
 $custom-select-feedback-icon-position:      center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
 $custom-select-feedback-icon-size:          $input-height-inner-half $input-height-inner-half !default;
@@ -625,8 +570,7 @@ $custom-range-thumb-border:                  0 !default;
 $custom-range-thumb-border-radius:           1rem !default;
 $custom-range-thumb-box-shadow:              0 .1rem .25rem rgba($black, .1) !default;
 $custom-range-thumb-focus-box-shadow:        0 0 0 1px $body-bg, $input-focus-box-shadow !default;
-$custom-range-thumb-focus-box-shadow-width:  $input-focus-width !default; // For focus box shadow issue in IE/Edge
-$custom-range-thumb-active-bg:               lighten($component-active-bg, 35%) !default;
+$custom-range-thumb-focus-box-shadow-width:  $input-focus-width !default; $custom-range-thumb-active-bg:               lighten($component-active-bg, 35%) !default;
 $custom-range-thumb-disabled-bg:             $gray-500 !default;
 
 $custom-file-height:                $input-height !default;
@@ -653,7 +597,6 @@ $custom-file-text: (
 ) !default;
 
 
-// Form validation
 
 $form-feedback-margin-top:          $form-text-margin-top !default;
 $form-feedback-font-size:           $small-font-size !default;
@@ -666,7 +609,6 @@ $form-feedback-icon-invalid-color:  $form-feedback-invalid-color !default;
 $form-feedback-icon-invalid:        url("data:image/svg+xml,<svg xmlns='https://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}' viewBox='0 0 12 12'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$form-feedback-icon-invalid-color}' stroke='none'/></svg>") !default;
 
 $form-validation-states: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $form-validation-states: map-merge(
   (
     "valid": (
@@ -681,10 +623,7 @@ $form-validation-states: map-merge(
   $form-validation-states
 );
 
-// Z-index master list
 //
-// Warning: Avoid customizing these values. They're used for a bird's eye view
-// of components dependent on the z-axis and are designed to all work together.
 
 $zindex-dropdown:                   1000 !default;
 $zindex-sticky:                     1020 !default;
@@ -695,7 +634,6 @@ $zindex-popover:                    1060 !default;
 $zindex-tooltip:                    1070 !default;
 
 
-// Navs
 
 $nav-link-padding-y:                .5rem !default;
 $nav-link-padding-x:                1rem !default;
@@ -717,7 +655,6 @@ $nav-divider-color:                 $gray-200 !default;
 $nav-divider-margin-y:              $spacer / 2 !default;
 
 
-// Navbar
 
 $navbar-padding-y:                  $spacer / 2 !default;
 $navbar-padding-x:                  $spacer !default;
@@ -725,7 +662,6 @@ $navbar-padding-x:                  $spacer !default;
 $navbar-nav-link-padding-x:         .5rem !default;
 
 $navbar-brand-font-size:            $font-size-lg !default;
-// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
 $nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
 $navbar-brand-height:               $navbar-brand-font-size * $line-height-base !default;
 $navbar-brand-padding-y:            ($nav-link-height - $navbar-brand-height) / 2 !default;
@@ -755,9 +691,7 @@ $navbar-dark-brand-color:                 $navbar-dark-active-color !default;
 $navbar-dark-brand-hover-color:           $navbar-dark-active-color !default;
 
 
-// Dropdowns
 //
-// Dropdown menu container and contents.
 
 $dropdown-min-width:                10rem !default;
 $dropdown-padding-y:                .5rem !default;
@@ -788,7 +722,6 @@ $dropdown-item-padding-x:           1.5rem !default;
 $dropdown-header-color:             $gray-600 !default;
 
 
-// Pagination
 
 $pagination-padding-y:              .5rem !default;
 $pagination-padding-x:              .75rem !default;
@@ -819,14 +752,12 @@ $pagination-disabled-bg:            $white !default;
 $pagination-disabled-border-color:  $gray-300 !default;
 
 
-// Jumbotron
 
 $jumbotron-padding:                 2rem !default;
 $jumbotron-color:                   null !default;
 $jumbotron-bg:                      $gray-200 !default;
 
 
-// Cards
 
 $card-spacer-y:                     .75rem !default;
 $card-spacer-x:                     1.25rem !default;
@@ -850,7 +781,6 @@ $card-columns-gap:                  1.25rem !default;
 $card-columns-margin:               $card-spacer-y !default;
 
 
-// Tooltips
 
 $tooltip-font-size:                 $font-size-sm !default;
 $tooltip-max-width:                 200px !default;
@@ -866,7 +796,6 @@ $tooltip-arrow-width:               .8rem !default;
 $tooltip-arrow-height:              .4rem !default;
 $tooltip-arrow-color:               $tooltip-bg !default;
 
-// Form tooltips must come after regular tooltips
 $form-feedback-tooltip-padding-y:     $tooltip-padding-y !default;
 $form-feedback-tooltip-padding-x:     $tooltip-padding-x !default;
 $form-feedback-tooltip-font-size:     $tooltip-font-size !default;
@@ -875,7 +804,6 @@ $form-feedback-tooltip-opacity:       $tooltip-opacity !default;
 $form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
 
 
-// Popovers
 
 $popover-font-size:                 $font-size-sm !default;
 $popover-bg:                        $white !default;
@@ -902,7 +830,6 @@ $popover-arrow-color:               $popover-bg !default;
 $popover-arrow-outer-color:         fade-in($popover-border-color, .05) !default;
 
 
-// Toasts
 
 $toast-max-width:                   350px !default;
 $toast-padding-x:                   .75rem !default;
@@ -920,7 +847,6 @@ $toast-header-background-color:     rgba($white, .85) !default;
 $toast-header-border-color:         rgba(0, 0, 0, .05) !default;
 
 
-// Badges
 
 $badge-font-size:                   75% !default;
 $badge-font-weight:                 $font-weight-bold !default;
@@ -932,17 +858,12 @@ $badge-transition:                  $btn-transition !default;
 $badge-focus-width:                 $input-btn-focus-width !default;
 
 $badge-pill-padding-x:              .6em !default;
-// Use a higher than normal value to ensure completely rounded edges when
-// customizing padding or font-size on labels.
 $badge-pill-border-radius:          10rem !default;
 
 
-// Modals
 
-// Padding applied to the modal body
 $modal-inner-padding:               1rem !default;
 
-// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding
 $modal-footer-margin-between:       .5rem !default;
 
 $modal-dialog-margin:               .5rem !default;
@@ -967,8 +888,7 @@ $modal-header-border-width:         $modal-content-border-width !default;
 $modal-footer-border-width:         $modal-header-border-width !default;
 $modal-header-padding-y:            1rem !default;
 $modal-header-padding-x:            1rem !default;
-$modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
-
+$modal-header-padding:              $modal-header-padding-y $modal-header-padding-x !default; 
 $modal-xl:                          1140px !default;
 $modal-lg:                          800px !default;
 $modal-md:                          500px !default;
@@ -980,9 +900,7 @@ $modal-transition:                  transform .3s ease-out !default;
 $modal-scale-transform:             scale(1.02) !default;
 
 
-// Alerts
 //
-// Define alert colors, border radius, and padding.
 
 $alert-padding-y:                   .75rem !default;
 $alert-padding-x:                   1.25rem !default;
@@ -996,7 +914,6 @@ $alert-border-level:                -9 !default;
 $alert-color-level:                 6 !default;
 
 
-// Progress bars
 
 $progress-height:                   1rem !default;
 $progress-font-size:                $font-size-base * .75 !default;
@@ -1009,7 +926,6 @@ $progress-bar-animation-timing:     1s linear infinite !default;
 $progress-bar-transition:           width .6s ease !default;
 
 
-// List group
 
 $list-group-color:                  null !default;
 $list-group-bg:                     $white !default;
@@ -1035,7 +951,6 @@ $list-group-action-active-color:    $body-color !default;
 $list-group-action-active-bg:       $gray-200 !default;
 
 
-// Image thumbnails
 
 $thumbnail-padding:                 .25rem !default;
 $thumbnail-bg:                      $body-bg !default;
@@ -1045,13 +960,11 @@ $thumbnail-border-radius:           $border-radius !default;
 $thumbnail-box-shadow:              0 1px 2px rgba($black, .075) !default;
 
 
-// Figures
 
 $figure-caption-font-size:          90% !default;
 $figure-caption-color:              $gray-600 !default;
 
 
-// Breadcrumbs
 
 $breadcrumb-font-size:              null !default;
 
@@ -1069,7 +982,6 @@ $breadcrumb-divider:                quote("/") !default;
 $breadcrumb-border-radius:          $border-radius !default;
 
 
-// Carousel
 
 $carousel-control-color:             $white !default;
 $carousel-control-width:             15% !default;
@@ -1093,11 +1005,9 @@ $carousel-control-prev-icon-bg:      url("data:image/svg+xml,<svg xmlns='https:/
 $carousel-control-next-icon-bg:      url("data:image/svg+xml,<svg xmlns='https://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default;
 
 $carousel-transition-duration:       .6s !default;
-$carousel-transition:                transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
+$carousel-transition:                transform $carousel-transition-duration ease-in-out !default; 
 
 
-// Spinners
-
 $spinner-width:         2rem !default;
 $spinner-height:        $spinner-width !default;
 $spinner-border-width:  .25em !default;
@@ -1107,7 +1017,6 @@ $spinner-height-sm:       $spinner-width-sm !default;
 $spinner-border-width-sm: .2em !default;
 
 
-// Close
 
 $close-font-size:                   $font-size-base * 1.5 !default;
 $close-font-weight:                 $font-weight-bold !default;
@@ -1115,7 +1024,6 @@ $close-color:                       $black !default;
 $close-text-shadow:                 0 1px 0 $white !default;
 
 
-// Code
 
 $code-font-size:                    87.5% !default;
 $code-color:                        $pink !default;
@@ -1130,14 +1038,12 @@ $pre-color:                         $gray-900 !default;
 $pre-scrollable-max-height:         340px !default;
 
 
-// Utilities
 
 $displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default;
 $overflows: auto, hidden !default;
 $positions: static, relative, absolute, fixed, sticky !default;
 
 
-// Printing
 
 $print-page-size:                   a3 !default;
 $print-body-min-width:              map-get($grid-breakpoints, "lg") !default;
diff --git a/files/assets/css/bootstrap/mixins/_background-variant.scss b/files/assets/css/bootstrap/mixins/_background-variant.scss
index 3ceb5c563..e631435c7 100644
--- a/files/assets/css/bootstrap/mixins/_background-variant.scss
+++ b/files/assets/css/bootstrap/mixins/_background-variant.scss
@@ -1,6 +1,4 @@
-// stylelint-disable declaration-no-important
 
-// Contextual backgrounds
 
 @mixin bg-variant($parent, $color, $ignore-warning: false) {
   #{$parent} {
diff --git a/files/assets/css/bootstrap/mixins/_border-radius.scss b/files/assets/css/bootstrap/mixins/_border-radius.scss
index 88aeb37d8..05af86b85 100644
--- a/files/assets/css/bootstrap/mixins/_border-radius.scss
+++ b/files/assets/css/bootstrap/mixins/_border-radius.scss
@@ -1,5 +1,3 @@
-// stylelint-disable property-blacklist
-// Single side border-radius
 
 @mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
   @if $enable-rounded {
diff --git a/files/assets/css/bootstrap/mixins/_box-shadow.scss b/files/assets/css/bootstrap/mixins/_box-shadow.scss
index 0726d4359..3a554a0a9 100644
--- a/files/assets/css/bootstrap/mixins/_box-shadow.scss
+++ b/files/assets/css/bootstrap/mixins/_box-shadow.scss
@@ -3,11 +3,9 @@
     $result: ();
 
     @if (length($shadow) == 1) {
-      // We can pass `@include box-shadow(none);`
-      $result: $shadow;
+            $result: $shadow;
     } @else {
-      // Filter to avoid invalid properties for example `box-shadow: none, 1px 1px black;`
-      @for $i from 1 through length($shadow) {
+            @for $i from 1 through length($shadow) {
         @if nth($shadow, $i) != "none" {
           $result: append($result, nth($shadow, $i), "comma");
         }
diff --git a/files/assets/css/bootstrap/mixins/_breakpoints.scss b/files/assets/css/bootstrap/mixins/_breakpoints.scss
index 23a5de96b..7134577e3 100644
--- a/files/assets/css/bootstrap/mixins/_breakpoints.scss
+++ b/files/assets/css/bootstrap/mixins/_breakpoints.scss
@@ -1,60 +1,30 @@
-// Breakpoint viewport sizes and media queries.
 //
-// Breakpoints are defined as a map of (name: minimum width), order from small to large:
 //
-//    (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px)
 //
-// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.
 
-// Name of the next breakpoint, or null for the last breakpoint.
 //
-//    >> breakpoint-next(sm)
-//    md
-//    >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
-//    md
-//    >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))
-//    md
 @function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
   $n: index($breakpoint-names, $name);
   @return if($n != null and $n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
 }
 
-// Minimum breakpoint width. Null for the smallest (first) breakpoint.
 //
-//    >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
-//    576px
 @function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
   $min: map-get($breakpoints, $name);
   @return if($min != 0, $min, null);
 }
 
-// Maximum breakpoint width. Null for the largest (last) breakpoint.
-// The maximum value is calculated as the minimum of the next one less 0.02px
-// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.
-// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
-// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.
-// See https://bugs.webkit.org/show_bug.cgi?id=178261
 //
-//    >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
-//    767.98px
 @function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
   $next: breakpoint-next($name, $breakpoints);
   @return if($next, breakpoint-min($next, $breakpoints) - .02, null);
 }
 
-// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.
-// Useful for making responsive utilities.
 //
-//    >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
-//    ""  (Returns a blank string)
-//    >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
-//    "-sm"
 @function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
   @return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
 }
 
-// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
-// Makes the @content apply to the given breakpoint and wider.
 @mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
   $min: breakpoint-min($name, $breakpoints);
   @if $min {
@@ -66,8 +36,6 @@
   }
 }
 
-// Media of at most the maximum breakpoint width. No query for the largest breakpoint.
-// Makes the @content apply to the given breakpoint and narrower.
 @mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
   $max: breakpoint-max($name, $breakpoints);
   @if $max {
@@ -79,8 +47,6 @@
   }
 }
 
-// Media that spans multiple breakpoint widths.
-// Makes the @content apply between the min and max breakpoints
 @mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
   $min: breakpoint-min($lower, $breakpoints);
   $max: breakpoint-max($upper, $breakpoints);
@@ -100,9 +66,6 @@
   }
 }
 
-// Media between the breakpoint's minimum and maximum widths.
-// No minimum for the smallest breakpoint, and no maximum for the largest one.
-// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
 @mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
   $min: breakpoint-min($name, $breakpoints);
   $max: breakpoint-max($name, $breakpoints);
diff --git a/files/assets/css/bootstrap/mixins/_buttons.scss b/files/assets/css/bootstrap/mixins/_buttons.scss
index c82c4d6d0..8564480db 100644
--- a/files/assets/css/bootstrap/mixins/_buttons.scss
+++ b/files/assets/css/bootstrap/mixins/_buttons.scss
@@ -1,7 +1,4 @@
-// Button variants
 //
-// Easily pump out default styles, as well as :hover, :focus, :active,
-// and disabled options for all buttons
 
 @mixin button-variant($background, $border, $hover-background: darken($background, 7.5%), $hover-border: darken($border, 10%), $active-background: darken($background, 10%), $active-border: darken($border, 12.5%)) {
   color: color-yiq($background);
@@ -20,22 +17,19 @@
     color: color-yiq($hover-background);
     @include gradient-bg($hover-background);
     border-color: $hover-border;
-    // Avoid using mixin so we can pass custom focus shadow properly
-    @if $enable-shadows {
+        @if $enable-shadows {
       box-shadow: $btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
     } @else {
       box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
     }
   }
 
-  // Disabled comes first so active can properly restyle
-  &.disabled,
+    &.disabled,
   &:disabled {
     color: color-yiq($background);
     background-color: $background;
     border-color: $border;
-    // Remove CSS gradients if they're enabled
-    @if $enable-gradients {
+        @if $enable-gradients {
       background-image: none;
     }
   }
@@ -46,13 +40,11 @@
     color: color-yiq($active-background);
     background-color: $active-background;
     @if $enable-gradients {
-      background-image: none; // Remove the gradient for the pressed/active state
-    }
+      background-image: none;     }
     border-color: $active-border;
 
     &:focus {
-      // Avoid using mixin so we can pass custom focus shadow properly
-      @if $enable-shadows and $btn-active-box-shadow != none {
+            @if $enable-shadows and $btn-active-box-shadow != none {
         box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
       } @else {
         box-shadow: 0 0 0 $btn-focus-width rgba(mix(color-yiq($background), $border, 15%), .5);
@@ -90,8 +82,7 @@
     border-color: $active-border;
 
     &:focus {
-      // Avoid using mixin so we can pass custom focus shadow properly
-      @if $enable-shadows and $btn-active-box-shadow != none {
+            @if $enable-shadows and $btn-active-box-shadow != none {
         box-shadow: $btn-active-box-shadow, 0 0 0 $btn-focus-width rgba($color, .5);
       } @else {
         box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
@@ -100,11 +91,9 @@
   }
 }
 
-// Button sizes
 @mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
   padding: $padding-y $padding-x;
   @include font-size($font-size);
   line-height: $line-height;
-  // Manually declare to provide an override to the browser default
-  @include border-radius($border-radius, 0);
+    @include border-radius($border-radius, 0);
 }
diff --git a/files/assets/css/bootstrap/mixins/_deprecate.scss b/files/assets/css/bootstrap/mixins/_deprecate.scss
index df070bc59..e14d50ff9 100644
--- a/files/assets/css/bootstrap/mixins/_deprecate.scss
+++ b/files/assets/css/bootstrap/mixins/_deprecate.scss
@@ -1,8 +1,4 @@
-// Deprecate mixin
 //
-// This mixin can be used to deprecate mixins or functions.
-// `$enable-deprecation-messages` is a global variable, `$ignore-warning` is a variable that can be passed to
-// some deprecated mixins to suppress the warning (for example if the mixin is still be used in the current version of Bootstrap)
 @mixin deprecate($name, $deprecate-version, $remove-version, $ignore-warning: false) {
   @if ($enable-deprecation-messages != false and $ignore-warning != true) {
     @warn "#{$name} has been deprecated as of #{$deprecate-version}. It will be removed entirely in #{$remove-version}.";
diff --git a/files/assets/css/bootstrap/mixins/_float.scss b/files/assets/css/bootstrap/mixins/_float.scss
index 6b376a258..592420ceb 100644
--- a/files/assets/css/bootstrap/mixins/_float.scss
+++ b/files/assets/css/bootstrap/mixins/_float.scss
@@ -1,4 +1,3 @@
-// stylelint-disable declaration-no-important
 
 @mixin float-left() {
   float: left !important;
diff --git a/files/assets/css/bootstrap/mixins/_forms.scss b/files/assets/css/bootstrap/mixins/_forms.scss
index 418470d0b..a0c055132 100644
--- a/files/assets/css/bootstrap/mixins/_forms.scss
+++ b/files/assets/css/bootstrap/mixins/_forms.scss
@@ -1,23 +1,13 @@
-// Form control focus state
 //
-// Generate a customized focus state and for any input with the specified color,
-// which defaults to the `$input-focus-border-color` variable.
 //
-// We highly encourage you to not customize the default value, but instead use
-// this to tweak colors on an as-needed basis. This aesthetic change is based on
-// WebKit's default styles, but applicable to a wider range of browsers. Its
-// usability and accessibility should be taken into account with any change.
 //
-// Example usage: change the default blue border and shadow to white for better
-// contrast against a dark gray background.
 @mixin form-control-focus($ignore-warning: false) {
   &:focus {
     color: $input-focus-color;
     background-color: $input-focus-bg;
     border-color: $input-focus-border-color;
     outline: 0;
-    // Avoid using mixin so we can pass custom focus shadow properly
-    @if $enable-shadows {
+        @if $enable-shadows {
       box-shadow: $input-box-shadow, $input-focus-box-shadow;
     } @else {
       box-shadow: $input-focus-box-shadow;
@@ -26,8 +16,6 @@
   @include deprecate("The `form-control-focus()` mixin", "v4.4.0", "v5", $ignore-warning);
 }
 
-// This mixin uses an `if()` technique to be compatible with Dart Sass
-// See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details
 @mixin form-validation-state-selector($state) {
   @if ($state == "valid" or $state == "invalid") {
     .was-validated #{if(&, "&", "")}:#{$state},
@@ -55,8 +43,7 @@
     top: 100%;
     z-index: 5;
     display: none;
-    max-width: 100%; // Contain to parent when possible
-    padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
+    max-width: 100%;     padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
     margin-top: .1rem;
     @include font-size($form-feedback-tooltip-font-size);
     line-height: $form-feedback-tooltip-line-height;
@@ -91,8 +78,7 @@
     }
   }
 
-  // stylelint-disable-next-line selector-no-qualifying-type
-  textarea.form-control {
+    textarea.form-control {
     @include form-validation-state-selector($state) {
       @if $enable-validation-icons {
         padding-right: $input-height-inner;
@@ -159,8 +145,7 @@
     }
   }
 
-  // custom file
-  .custom-file-input {
+    .custom-file-input {
     @include form-validation-state-selector($state) {
       ~ .custom-file-label {
         border-color: $color;
diff --git a/files/assets/css/bootstrap/mixins/_gradients.scss b/files/assets/css/bootstrap/mixins/_gradients.scss
index 88c4d64b7..1f9f87dac 100644
--- a/files/assets/css/bootstrap/mixins/_gradients.scss
+++ b/files/assets/css/bootstrap/mixins/_gradients.scss
@@ -1,4 +1,3 @@
-// Gradients
 
 @mixin gradient-bg($color) {
   @if $enable-gradients {
@@ -8,17 +7,13 @@
   }
 }
 
-// Horizontal gradient, from left to right
 //
-// Creates two color stops, start and end, by specifying a color and position for each color stop.
 @mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {
   background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);
   background-repeat: repeat-x;
 }
 
-// Vertical gradient, from top to bottom
 //
-// Creates two color stops, start and end, by specifying a color and position for each color stop.
 @mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {
   background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);
   background-repeat: repeat-x;
diff --git a/files/assets/css/bootstrap/mixins/_grid-framework.scss b/files/assets/css/bootstrap/mixins/_grid-framework.scss
index 8e291f7ae..a720b3fd0 100644
--- a/files/assets/css/bootstrap/mixins/_grid-framework.scss
+++ b/files/assets/css/bootstrap/mixins/_grid-framework.scss
@@ -1,11 +1,7 @@
-// Framework grid generation
 //
-// Used only by Bootstrap to generate the correct number of grid classes given
-// any value of `$grid-columns`.
 
 @mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
-  // Common properties for all breakpoints
-  %grid-column {
+    %grid-column {
     position: relative;
     width: 100%;
     padding-right: $gutter / 2;
@@ -15,8 +11,7 @@
   @each $breakpoint in map-keys($breakpoints) {
     $infix: breakpoint-infix($breakpoint, $breakpoints);
 
-    // Allow columns to stretch full width below their breakpoints
-    @for $i from 1 through $columns {
+        @for $i from 1 through $columns {
       .col#{$infix}-#{$i} {
         @extend %grid-column;
       }
@@ -27,8 +22,7 @@
     }
 
     @include media-breakpoint-up($breakpoint, $breakpoints) {
-      // Provide basic `.col-{bp}` classes for equal-width flexbox columns
-      .col#{$infix} {
+            .col#{$infix} {
         flex-basis: 0;
         flex-grow: 1;
         max-width: 100%;
@@ -58,10 +52,8 @@
         .order#{$infix}-#{$i} { order: $i; }
       }
 
-      // `$columns - 1` because offsetting by the width of an entire row isn't possible
-      @for $i from 0 through ($columns - 1) {
-        @if not ($infix == "" and $i == 0) { // Avoid emitting useless .offset-0
-          .offset#{$infix}-#{$i} {
+            @for $i from 0 through ($columns - 1) {
+        @if not ($infix == "" and $i == 0) {           .offset#{$infix}-#{$i} {
             @include make-col-offset($i, $columns);
           }
         }
diff --git a/files/assets/css/bootstrap/mixins/_grid.scss b/files/assets/css/bootstrap/mixins/_grid.scss
index b1240b01f..d57498b74 100644
--- a/files/assets/css/bootstrap/mixins/_grid.scss
+++ b/files/assets/css/bootstrap/mixins/_grid.scss
@@ -1,6 +1,4 @@
-/// Grid system
-//
-// Generate semantic grid columns with these mixins.
+///
 
 @mixin make-container($gutter: $grid-gutter-width) {
   width: 100%;
@@ -11,7 +9,6 @@
 }
 
 
-// For each breakpoint, define the maximum width of the container in a media query
 @mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
   @each $breakpoint, $container-max-width in $max-widths {
     @include media-breakpoint-up($breakpoint, $breakpoints) {
@@ -29,38 +26,27 @@
 
 @mixin make-col-ready($gutter: $grid-gutter-width) {
   position: relative;
-  // Prevent columns from becoming too narrow when at smaller grid tiers by
-  // always setting `width: 100%;`. This works because we use `flex` values
-  // later on to override this initial width.
-  width: 100%;
+        width: 100%;
   padding-right: $gutter / 2;
   padding-left: $gutter / 2;
 }
 
 @mixin make-col($size, $columns: $grid-columns) {
   flex: 0 0 percentage($size / $columns);
-  // Add a `max-width` to ensure content within each column does not blow out
-  // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
-  // do not appear to require this.
-  max-width: percentage($size / $columns);
+        max-width: percentage($size / $columns);
 }
 
 @mixin make-col-auto() {
   flex: 0 0 auto;
   width: auto;
-  max-width: 100%; // Reset earlier grid tiers
-}
+  max-width: 100%; }
 
 @mixin make-col-offset($size, $columns: $grid-columns) {
   $num: $size / $columns;
   margin-left: if($num == 0, 0, percentage($num));
 }
 
-// Row columns
 //
-// Specify on a parent element(e.g., .row) to force immediate children into NN
-// numberof columns. Supports wrapping to new lines, but does not do a Masonry
-// style grid.
 @mixin row-cols($count) {
   & > * {
     flex: 0 0 100% / $count;
diff --git a/files/assets/css/bootstrap/mixins/_hover.scss b/files/assets/css/bootstrap/mixins/_hover.scss
index 409f8244e..aa4c4c05c 100644
--- a/files/assets/css/bootstrap/mixins/_hover.scss
+++ b/files/assets/css/bootstrap/mixins/_hover.scss
@@ -1,13 +1,6 @@
-// Hover mixin and `$enable-hover-media-query` are deprecated.
 //
-// Originally added during our alphas and maintained during betas, this mixin was
-// designed to prevent `:hover` stickiness on iOS-an issue where hover styles
-// would persist after initial touch.
 //
-// For backward compatibility, we've kept these mixins and updated them to
-// always return their regular pseudo-classes instead of a shimmed media query.
 //
-// Issue: https://github.com/twbs/bootstrap/issues/25195
 
 @mixin hover() {
   &:hover { @content; }
diff --git a/files/assets/css/bootstrap/mixins/_image.scss b/files/assets/css/bootstrap/mixins/_image.scss
index c971e038b..68389e25a 100644
--- a/files/assets/css/bootstrap/mixins/_image.scss
+++ b/files/assets/css/bootstrap/mixins/_image.scss
@@ -1,35 +1,19 @@
-// Image Mixins
-// - Responsive image
-// - Retina image
 
 
-// Responsive image
 //
-// Keep images from scaling beyond the width of their parents.
 
 @mixin img-fluid() {
-  // Part 1: Set a maximum relative to the parent
-  max-width: 100%;
-  // Part 2: Override the height to auto, otherwise images will be stretched
-  // when setting a width and height attribute on the img element.
-  height: auto;
+    max-width: 100%;
+      height: auto;
 }
 
 
-// Retina image
 //
-// Short retina mixin for setting background-image and -size.
 
 @mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
   background-image: url($file-1x);
 
-  // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
-  // but doesn't convert dppx=>dpi.
-  // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
-  // Compatibility info: https://caniuse.com/#feat=css-media-resolution
-  @media only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
-    only screen and (min-resolution: 2dppx) { // Standardized
-    background-image: url($file-2x);
+          @media only screen and (min-resolution: 192dpi),     only screen and (min-resolution: 2dppx) {     background-image: url($file-2x);
     background-size: $width-1x $height-1x;
   }
   @include deprecate("`img-retina()`", "v4.3.0", "v5");
diff --git a/files/assets/css/bootstrap/mixins/_list-group.scss b/files/assets/css/bootstrap/mixins/_list-group.scss
index 0da353156..efcdc1ad2 100644
--- a/files/assets/css/bootstrap/mixins/_list-group.scss
+++ b/files/assets/css/bootstrap/mixins/_list-group.scss
@@ -1,4 +1,3 @@
-// List Groups
 
 @mixin list-group-item-variant($state, $background, $color) {
   .list-group-item-#{$state} {
diff --git a/files/assets/css/bootstrap/mixins/_lists.scss b/files/assets/css/bootstrap/mixins/_lists.scss
index 251cb0733..6b07fbe94 100644
--- a/files/assets/css/bootstrap/mixins/_lists.scss
+++ b/files/assets/css/bootstrap/mixins/_lists.scss
@@ -1,6 +1,4 @@
-// Lists
 
-// Unstyled keeps list items block level, just removes default browser padding and list-style
 @mixin list-unstyled() {
   padding-left: 0;
   list-style: none;
diff --git a/files/assets/css/bootstrap/mixins/_nav-divider.scss b/files/assets/css/bootstrap/mixins/_nav-divider.scss
index 3e0cceafe..1a6c0b81c 100644
--- a/files/assets/css/bootstrap/mixins/_nav-divider.scss
+++ b/files/assets/css/bootstrap/mixins/_nav-divider.scss
@@ -1,6 +1,4 @@
-// Horizontal dividers
 //
-// Dividers (basically an hr) within dropdowns and nav lists
 
 @mixin nav-divider($color: $nav-divider-color, $margin-y: $nav-divider-margin-y, $ignore-warning: false) {
   height: 0;
diff --git a/files/assets/css/bootstrap/mixins/_pagination.scss b/files/assets/css/bootstrap/mixins/_pagination.scss
index af8e16d6a..8a32051b2 100644
--- a/files/assets/css/bootstrap/mixins/_pagination.scss
+++ b/files/assets/css/bootstrap/mixins/_pagination.scss
@@ -1,4 +1,3 @@
-// Pagination
 
 @mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
   .page-link {
diff --git a/files/assets/css/bootstrap/mixins/_reset-text.scss b/files/assets/css/bootstrap/mixins/_reset-text.scss
index 15b4407a0..62b66802b 100644
--- a/files/assets/css/bootstrap/mixins/_reset-text.scss
+++ b/files/assets/css/bootstrap/mixins/_reset-text.scss
@@ -1,11 +1,9 @@
 @mixin reset-text() {
   font-family: $font-family-base;
-  // We deliberately do NOT reset font-size or word-wrap.
-  font-style: normal;
+    font-style: normal;
   font-weight: $font-weight-normal;
   line-height: $line-height-base;
-  text-align: left; // Fallback for where `start` is not supported
-  text-align: start;
+  text-align: left;   text-align: start;
   text-decoration: none;
   text-shadow: none;
   text-transform: none;
diff --git a/files/assets/css/bootstrap/mixins/_resize.scss b/files/assets/css/bootstrap/mixins/_resize.scss
index 66f233a63..accfe6b83 100644
--- a/files/assets/css/bootstrap/mixins/_resize.scss
+++ b/files/assets/css/bootstrap/mixins/_resize.scss
@@ -1,6 +1,3 @@
-// Resize anything
 
 @mixin resizable($direction) {
-  overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`
-  resize: $direction; // Options: horizontal, vertical, both
-}
+  overflow: auto;   resize: $direction; }
diff --git a/files/assets/css/bootstrap/mixins/_screen-reader.scss b/files/assets/css/bootstrap/mixins/_screen-reader.scss
index 21230390e..cb8e9a500 100644
--- a/files/assets/css/bootstrap/mixins/_screen-reader.scss
+++ b/files/assets/css/bootstrap/mixins/_screen-reader.scss
@@ -1,25 +1,18 @@
-// Only display content to screen readers
 //
-// See: https://a11yproject.com/posts/how-to-hide-content/
-// See: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
 
 @mixin sr-only() {
   position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
-  margin: -1px; // Fix for https://github.com/twbs/bootstrap/issues/25686
-  overflow: hidden;
+  margin: -1px;   overflow: hidden;
   clip: rect(0, 0, 0, 0);
   white-space: nowrap;
   border: 0;
 }
 
-// Use in conjunction with .sr-only to only display content when it's focused.
 //
-// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
 //
-// Credit: HTML5 Boilerplate
 
 @mixin sr-only-focusable() {
   &:active,
diff --git a/files/assets/css/bootstrap/mixins/_size.scss b/files/assets/css/bootstrap/mixins/_size.scss
index 69e056d2c..c36728f04 100644
--- a/files/assets/css/bootstrap/mixins/_size.scss
+++ b/files/assets/css/bootstrap/mixins/_size.scss
@@ -1,4 +1,3 @@
-// Sizing shortcuts
 
 @mixin size($width, $height: $width) {
   width: $width;
diff --git a/files/assets/css/bootstrap/mixins/_table-row.scss b/files/assets/css/bootstrap/mixins/_table-row.scss
index 1ccde6b6c..f581e4b4b 100644
--- a/files/assets/css/bootstrap/mixins/_table-row.scss
+++ b/files/assets/css/bootstrap/mixins/_table-row.scss
@@ -1,9 +1,6 @@
-// Tables
 
 @mixin table-row-variant($state, $background, $border: null) {
-  // Exact selectors below required to override `.table-striped` and prevent
-  // inheritance to nested tables.
-  .table-#{$state} {
+      .table-#{$state} {
     &,
     > th,
     > td {
@@ -20,9 +17,7 @@
     }
   }
 
-  // Hover states for `.table-hover`
-  // Note: this is not available for cells or rows within `thead` or `tfoot`.
-  .table-hover {
+      .table-hover {
     $hover-background: darken($background, 5%);
 
     .table-#{$state} {
diff --git a/files/assets/css/bootstrap/mixins/_text-emphasis.scss b/files/assets/css/bootstrap/mixins/_text-emphasis.scss
index 5eb8a5515..8ce4a584d 100644
--- a/files/assets/css/bootstrap/mixins/_text-emphasis.scss
+++ b/files/assets/css/bootstrap/mixins/_text-emphasis.scss
@@ -1,6 +1,4 @@
-// stylelint-disable declaration-no-important
 
-// Typography
 
 @mixin text-emphasis-variant($parent, $color, $ignore-warning: false) {
   #{$parent} {
diff --git a/files/assets/css/bootstrap/mixins/_text-hide.scss b/files/assets/css/bootstrap/mixins/_text-hide.scss
index 3a923011e..a694dbbde 100644
--- a/files/assets/css/bootstrap/mixins/_text-hide.scss
+++ b/files/assets/css/bootstrap/mixins/_text-hide.scss
@@ -1,7 +1,5 @@
-// CSS image replacement
 @mixin text-hide($ignore-warning: false) {
-  // stylelint-disable-next-line font-family-no-missing-generic-family-keyword
-  font: 0/0 a;
+    font: 0/0 a;
   color: transparent;
   text-shadow: none;
   background-color: transparent;
diff --git a/files/assets/css/bootstrap/mixins/_text-truncate.scss b/files/assets/css/bootstrap/mixins/_text-truncate.scss
index 3504bb1aa..e6046b799 100644
--- a/files/assets/css/bootstrap/mixins/_text-truncate.scss
+++ b/files/assets/css/bootstrap/mixins/_text-truncate.scss
@@ -1,5 +1,3 @@
-// Text truncate
-// Requires inline-block or block for proper styling
 
 @mixin text-truncate() {
   overflow: hidden;
diff --git a/files/assets/css/bootstrap/mixins/_transition.scss b/files/assets/css/bootstrap/mixins/_transition.scss
index 8ce35a6b8..4e27dbf19 100644
--- a/files/assets/css/bootstrap/mixins/_transition.scss
+++ b/files/assets/css/bootstrap/mixins/_transition.scss
@@ -1,4 +1,3 @@
-// stylelint-disable property-blacklist
 @mixin transition($transition...) {
   @if $enable-transitions {
     @if length($transition) == 0 {
diff --git a/files/assets/css/bootstrap/mixins/_visibility.scss b/files/assets/css/bootstrap/mixins/_visibility.scss
index f17467311..f689b0137 100644
--- a/files/assets/css/bootstrap/mixins/_visibility.scss
+++ b/files/assets/css/bootstrap/mixins/_visibility.scss
@@ -1,6 +1,4 @@
-// stylelint-disable declaration-no-important
 
-// Visibility
 
 @mixin invisible($visibility) {
   visibility: $visibility !important;
diff --git a/files/assets/css/bootstrap/utilities/_align.scss b/files/assets/css/bootstrap/utilities/_align.scss
index 8b7df9f76..81136a769 100644
--- a/files/assets/css/bootstrap/utilities/_align.scss
+++ b/files/assets/css/bootstrap/utilities/_align.scss
@@ -1,7 +1,5 @@
-// stylelint-disable declaration-no-important
 
-.align-baseline    { vertical-align: baseline !important; } // Browser default
-.align-top         { vertical-align: top !important; }
+.align-baseline    { vertical-align: baseline !important; } .align-top         { vertical-align: top !important; }
 .align-middle      { vertical-align: middle !important; }
 .align-bottom      { vertical-align: bottom !important; }
 .align-text-bottom { vertical-align: text-bottom !important; }
diff --git a/files/assets/css/bootstrap/utilities/_background.scss b/files/assets/css/bootstrap/utilities/_background.scss
index a997b1bdd..cef9dd7b0 100644
--- a/files/assets/css/bootstrap/utilities/_background.scss
+++ b/files/assets/css/bootstrap/utilities/_background.scss
@@ -1,4 +1,3 @@
-// stylelint-disable declaration-no-important
 
 @each $color, $value in $theme-colors {
   @include bg-variant(".bg-#{$color}", $value, true);
diff --git a/files/assets/css/bootstrap/utilities/_borders.scss b/files/assets/css/bootstrap/utilities/_borders.scss
index 302f6bf84..1d8767497 100644
--- a/files/assets/css/bootstrap/utilities/_borders.scss
+++ b/files/assets/css/bootstrap/utilities/_borders.scss
@@ -1,7 +1,5 @@
-// stylelint-disable property-blacklist, declaration-no-important
 
 //
-// Border
 //
 
 .border         { border: $border-width solid $border-color !important; }
@@ -27,7 +25,6 @@
 }
 
 //
-// Border-radius
 //
 
 .rounded-sm {
diff --git a/files/assets/css/bootstrap/utilities/_display.scss b/files/assets/css/bootstrap/utilities/_display.scss
index 130367998..02c85e7c8 100644
--- a/files/assets/css/bootstrap/utilities/_display.scss
+++ b/files/assets/css/bootstrap/utilities/_display.scss
@@ -1,7 +1,5 @@
-// stylelint-disable declaration-no-important
 
 //
-// Utilities for common `display` values
 //
 
 @each $breakpoint in map-keys($grid-breakpoints) {
@@ -16,7 +14,6 @@
 
 
 //
-// Utilities for toggling `display` in print
 //
 
 @media print {
diff --git a/files/assets/css/bootstrap/utilities/_embed.scss b/files/assets/css/bootstrap/utilities/_embed.scss
index 4497ac040..320908d93 100644
--- a/files/assets/css/bootstrap/utilities/_embed.scss
+++ b/files/assets/css/bootstrap/utilities/_embed.scss
@@ -1,4 +1,3 @@
-// Credit: Nicolas Gallagher and SUIT CSS.
 
 .embed-responsive {
   position: relative;
diff --git a/files/assets/css/bootstrap/utilities/_flex.scss b/files/assets/css/bootstrap/utilities/_flex.scss
index 3d4266e0d..ceb304615 100644
--- a/files/assets/css/bootstrap/utilities/_flex.scss
+++ b/files/assets/css/bootstrap/utilities/_flex.scss
@@ -1,8 +1,5 @@
-// stylelint-disable declaration-no-important
 
-// Flex variation
 //
-// Custom styles for additional flex alignment options.
 
 @each $breakpoint in map-keys($grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
diff --git a/files/assets/css/bootstrap/utilities/_float.scss b/files/assets/css/bootstrap/utilities/_float.scss
index 54250844f..19cac185d 100644
--- a/files/assets/css/bootstrap/utilities/_float.scss
+++ b/files/assets/css/bootstrap/utilities/_float.scss
@@ -1,4 +1,3 @@
-// stylelint-disable declaration-no-important
 
 @each $breakpoint in map-keys($grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
diff --git a/files/assets/css/bootstrap/utilities/_overflow.scss b/files/assets/css/bootstrap/utilities/_overflow.scss
index 8326c3064..ba25b85b8 100644
--- a/files/assets/css/bootstrap/utilities/_overflow.scss
+++ b/files/assets/css/bootstrap/utilities/_overflow.scss
@@ -1,4 +1,3 @@
-// stylelint-disable declaration-no-important
 
 @each $value in $overflows {
   .overflow-#{$value} { overflow: $value !important; }
diff --git a/files/assets/css/bootstrap/utilities/_position.scss b/files/assets/css/bootstrap/utilities/_position.scss
index cdf6c115f..1bd848837 100644
--- a/files/assets/css/bootstrap/utilities/_position.scss
+++ b/files/assets/css/bootstrap/utilities/_position.scss
@@ -1,11 +1,8 @@
-// stylelint-disable declaration-no-important
 
-// Common values
 @each $position in $positions {
   .position-#{$position} { position: $position !important; }
 }
 
-// Shorthand
 
 .fixed-top {
   position: fixed;
diff --git a/files/assets/css/bootstrap/utilities/_screenreaders.scss b/files/assets/css/bootstrap/utilities/_screenreaders.scss
index 9f26fde03..67d05dc10 100644
--- a/files/assets/css/bootstrap/utilities/_screenreaders.scss
+++ b/files/assets/css/bootstrap/utilities/_screenreaders.scss
@@ -1,5 +1,4 @@
 //
-// Screenreaders
 //
 
 .sr-only {
diff --git a/files/assets/css/bootstrap/utilities/_shadows.scss b/files/assets/css/bootstrap/utilities/_shadows.scss
index f5d03fcd5..584d3c466 100644
--- a/files/assets/css/bootstrap/utilities/_shadows.scss
+++ b/files/assets/css/bootstrap/utilities/_shadows.scss
@@ -1,4 +1,3 @@
-// stylelint-disable declaration-no-important
 
 .shadow-sm { box-shadow: $box-shadow-sm !important; }
 .shadow { box-shadow: $box-shadow !important; }
diff --git a/files/assets/css/bootstrap/utilities/_sizing.scss b/files/assets/css/bootstrap/utilities/_sizing.scss
index f37648802..51d5861a1 100644
--- a/files/assets/css/bootstrap/utilities/_sizing.scss
+++ b/files/assets/css/bootstrap/utilities/_sizing.scss
@@ -1,6 +1,4 @@
-// stylelint-disable declaration-no-important
 
-// Width and height
 
 @each $prop, $abbrev in (width: w, height: h) {
   @each $size, $length in $sizes {
@@ -11,7 +9,6 @@
 .mw-100 { max-width: 100% !important; }
 .mh-100 { max-height: 100% !important; }
 
-// Viewport additional helpers
 
 .min-vw-100 { min-width: 100vw !important; }
 .min-vh-100 { min-height: 100vh !important; }
diff --git a/files/assets/css/bootstrap/utilities/_spacing.scss b/files/assets/css/bootstrap/utilities/_spacing.scss
index 351136790..617378ff7 100644
--- a/files/assets/css/bootstrap/utilities/_spacing.scss
+++ b/files/assets/css/bootstrap/utilities/_spacing.scss
@@ -1,6 +1,4 @@
-// stylelint-disable declaration-no-important
 
-// Margin and Padding
 
 @each $breakpoint in map-keys($grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
@@ -28,8 +26,7 @@
       }
     }
 
-    // Negative margins (e.g., where `.mb-n1` is negative version of `.mb-1`)
-    @each $size, $length in $spacers {
+        @each $size, $length in $spacers {
       @if $size != 0 {
         .m#{$infix}-n#{$size} { margin: -$length !important; }
         .mt#{$infix}-n#{$size},
@@ -51,8 +48,7 @@
       }
     }
 
-    // Some special margin utils
-    .m#{$infix}-auto { margin: auto !important; }
+        .m#{$infix}-auto { margin: auto !important; }
     .mt#{$infix}-auto,
     .my#{$infix}-auto {
       margin-top: auto !important;
diff --git a/files/assets/css/bootstrap/utilities/_stretched-link.scss b/files/assets/css/bootstrap/utilities/_stretched-link.scss
index fb5066bf5..243594160 100644
--- a/files/assets/css/bootstrap/utilities/_stretched-link.scss
+++ b/files/assets/css/bootstrap/utilities/_stretched-link.scss
@@ -1,5 +1,4 @@
 //
-// Stretched link
 //
 
 .stretched-link {
@@ -10,10 +9,8 @@
     bottom: 0;
     left: 0;
     z-index: 1;
-    // Just in case `pointer-events: none` is set on a parent
-    pointer-events: auto;
+        pointer-events: auto;
     content: "";
-    // IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color
-    background-color: rgba(0, 0, 0, 0);
+        background-color: rgba(0, 0, 0, 0);
   }
 }
diff --git a/files/assets/css/bootstrap/utilities/_text.scss b/files/assets/css/bootstrap/utilities/_text.scss
index 5d0f1c845..d90756255 100644
--- a/files/assets/css/bootstrap/utilities/_text.scss
+++ b/files/assets/css/bootstrap/utilities/_text.scss
@@ -1,19 +1,15 @@
-// stylelint-disable declaration-no-important
 
 //
-// Text
 //
 
 .text-monospace { font-family: $font-family-monospace !important; }
 
-// Alignment
 
 .text-justify  { text-align: justify !important; }
 .text-wrap     { white-space: normal !important; }
 .text-nowrap   { white-space: nowrap !important; }
 .text-truncate { @include text-truncate(); }
 
-// Responsive alignment
 
 @each $breakpoint in map-keys($grid-breakpoints) {
   @include media-breakpoint-up($breakpoint) {
@@ -25,13 +21,11 @@
   }
 }
 
-// Transformation
 
 .text-lowercase  { text-transform: lowercase !important; }
 .text-uppercase  { text-transform: uppercase !important; }
 .text-capitalize { text-transform: capitalize !important; }
 
-// Weight and italics
 
 .font-weight-light   { font-weight: $font-weight-light !important; }
 .font-weight-lighter { font-weight: $font-weight-lighter !important; }
@@ -40,7 +34,6 @@
 .font-weight-bolder  { font-weight: $font-weight-bolder !important; }
 .font-italic         { font-style: italic !important; }
 
-// Contextual colors
 
 .text-white { color: $white !important; }
 
@@ -54,7 +47,6 @@
 .text-black-50 { color: rgba($black, .5) !important; }
 .text-white-50 { color: rgba($white, .5) !important; }
 
-// Misc
 
 .text-hide {
   @include text-hide($ignore-warning: true);
@@ -63,10 +55,8 @@
 .text-decoration-none { text-decoration: none !important; }
 
 .text-break {
-  word-break: break-word !important; // IE & < Edge 18
-  overflow-wrap: break-word !important;
+  word-break: break-word !important;   overflow-wrap: break-word !important;
 }
 
-// Reset
 
 .text-reset { color: inherit !important; }
diff --git a/files/assets/css/bootstrap/utilities/_visibility.scss b/files/assets/css/bootstrap/utilities/_visibility.scss
index 7756c3bfa..79c9c7d68 100644
--- a/files/assets/css/bootstrap/utilities/_visibility.scss
+++ b/files/assets/css/bootstrap/utilities/_visibility.scss
@@ -1,7 +1,5 @@
-// stylelint-disable declaration-no-important
 
 //
-// Visibility utilities
 //
 
 .visible {
diff --git a/files/assets/css/bootstrap/vendor/_rfs.scss b/files/assets/css/bootstrap/vendor/_rfs.scss
index 497e07eda..3c2ad96b7 100644
--- a/files/assets/css/bootstrap/vendor/_rfs.scss
+++ b/files/assets/css/bootstrap/vendor/_rfs.scss
@@ -1,47 +1,32 @@
-// stylelint-disable property-blacklist, scss/dollar-variable-default
 
-// SCSS RFS mixin
 //
-// Automated font-resizing
 //
-// See https://github.com/twbs/rfs
 
-// Configuration
 
-// Base font size
 $rfs-base-font-size: 1.25rem !default;
 $rfs-font-size-unit: rem !default;
 
-// Breakpoint at where font-size starts decreasing if screen width is smaller
 $rfs-breakpoint: 1200px !default;
 $rfs-breakpoint-unit: px !default;
 
-// Resize font-size based on screen height and width
 $rfs-two-dimensional: false !default;
 
-// Factor of decrease
 $rfs-factor: 10 !default;
 
 @if type-of($rfs-factor) != "number" or $rfs-factor <= 1 {
   @error "`#{$rfs-factor}` is not a valid  $rfs-factor, it must be greater than 1.";
 }
 
-// Generate enable or disable classes. Possibilities: false, "enable" or "disable"
 $rfs-class: false !default;
 
-// 1 rem = $rfs-rem-value px
 $rfs-rem-value: 16 !default;
 
-// Safari iframe resize bug: https://github.com/twbs/rfs/issues/14
 $rfs-safari-iframe-resize-bug-fix: false !default;
 
-// Disable RFS by setting $enable-responsive-font-sizes to false
 $enable-responsive-font-sizes: true !default;
 
-// Cache $rfs-base-font-size unit
 $rfs-base-font-size-unit: unit($rfs-base-font-size);
 
-// Remove px-unit from $rfs-base-font-size for calculations
 @if $rfs-base-font-size-unit == "px" {
   $rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1);
 }
@@ -49,10 +34,8 @@ $rfs-base-font-size-unit: unit($rfs-base-font-size);
   $rfs-base-font-size: $rfs-base-font-size / ($rfs-base-font-size * 0 + 1 / $rfs-rem-value);
 }
 
-// Cache $rfs-breakpoint unit to prevent multiple calls
 $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
 
-// Remove unit from $rfs-breakpoint for calculations
 @if $rfs-breakpoint-unit-cache == "px" {
   $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1);
 }
@@ -60,33 +43,26 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
   $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1 / $rfs-rem-value);
 }
 
-// Responsive font-size mixin
 @mixin rfs($fs, $important: false) {
-  // Cache $fs unit
-  $fs-unit: if(type-of($fs) == "number", unit($fs), false);
+    $fs-unit: if(type-of($fs) == "number", unit($fs), false);
 
-  // Add !important suffix if needed
-  $rfs-suffix: if($important, " !important", "");
+    $rfs-suffix: if($important, " !important", "");
 
-  // If $fs isn't a number (like inherit) or $fs has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
-  @if not $fs-unit or $fs-unit != "" and $fs-unit != "px" and $fs-unit != "rem" or $fs == 0 {
+    @if not $fs-unit or $fs-unit != "" and $fs-unit != "px" and $fs-unit != "rem" or $fs == 0 {
     font-size: #{$fs}#{$rfs-suffix};
   }
   @else {
-    // Variables for storing static and fluid rescaling
-    $rfs-static: null;
+        $rfs-static: null;
     $rfs-fluid: null;
 
-    // Remove px-unit from $fs for calculations
-    @if $fs-unit == "px" {
+        @if $fs-unit == "px" {
       $fs: $fs / ($fs * 0 + 1);
     }
     @else if $fs-unit == "rem" {
       $fs: $fs / ($fs * 0 + 1 / $rfs-rem-value);
     }
 
-    // Set default font-size
-    @if $rfs-font-size-unit == rem {
+        @if $rfs-font-size-unit == rem {
       $rfs-static: #{$fs / $rfs-rem-value}rem#{$rfs-suffix};
     }
     @else if $rfs-font-size-unit == px {
@@ -96,42 +72,30 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
       @error "`#{$rfs-font-size-unit}` is not a valid unit for $rfs-font-size-unit. Use `px` or `rem`.";
     }
 
-    // Only add media query if font-size is bigger as the minimum font-size
-    // If $rfs-factor == 1, no rescaling will take place
-    @if $fs > $rfs-base-font-size and $enable-responsive-font-sizes {
+            @if $fs > $rfs-base-font-size and $enable-responsive-font-sizes {
       $min-width: null;
       $variable-unit: null;
 
-      // Calculate minimum font-size for given font-size
-      $fs-min: $rfs-base-font-size + ($fs - $rfs-base-font-size) / $rfs-factor;
+            $fs-min: $rfs-base-font-size + ($fs - $rfs-base-font-size) / $rfs-factor;
 
-      // Calculate difference between given font-size and minimum font-size for given font-size
-      $fs-diff: $fs - $fs-min;
+            $fs-diff: $fs - $fs-min;
 
-      // Base font-size formatting
-      // No need to check if the unit is valid, because we did that before
-      $min-width: if($rfs-font-size-unit == rem, #{$fs-min / $rfs-rem-value}rem, #{$fs-min}px);
+                  $min-width: if($rfs-font-size-unit == rem, #{$fs-min / $rfs-rem-value}rem, #{$fs-min}px);
 
-      // If two-dimensional, use smallest of screen width and height
-      $variable-unit: if($rfs-two-dimensional, vmin, vw);
+            $variable-unit: if($rfs-two-dimensional, vmin, vw);
 
-      // Calculate the variable width between 0 and $rfs-breakpoint
-      $variable-width: #{$fs-diff * 100 / $rfs-breakpoint}#{$variable-unit};
+            $variable-width: #{$fs-diff * 100 / $rfs-breakpoint}#{$variable-unit};
 
-      // Set the calculated font-size.
-      $rfs-fluid: calc(#{$min-width} + #{$variable-width}) #{$rfs-suffix};
+            $rfs-fluid: calc(#{$min-width} + #{$variable-width}) #{$rfs-suffix};
     }
 
-    // Rendering
-    @if $rfs-fluid == null {
-      // Only render static font-size if no fluid font-size is available
-      font-size: $rfs-static;
+        @if $rfs-fluid == null {
+            font-size: $rfs-static;
     }
     @else {
       $mq-value: null;
 
-      // RFS breakpoint formatting
-      @if $rfs-breakpoint-unit == em or $rfs-breakpoint-unit == rem {
+            @if $rfs-breakpoint-unit == em or $rfs-breakpoint-unit == rem {
         $mq-value: #{$rfs-breakpoint / $rfs-rem-value}#{$rfs-breakpoint-unit};
       }
       @else if $rfs-breakpoint-unit == px {
@@ -142,9 +106,7 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
       }
 
       @if $rfs-class == "disable" {
-        // Adding an extra class increases specificity,
-        // which prevents the media query to override the font size
-        &,
+                        &,
         .disable-responsive-font-size &,
         &.disable-responsive-font-size {
           font-size: $rfs-static;
@@ -167,8 +129,7 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
           }
 
           @if $rfs-safari-iframe-resize-bug-fix {
-            // stylelint-disable-next-line length-zero-no-unit
-            min-width: 0vw;
+                        min-width: 0vw;
           }
         }
       }
@@ -185,8 +146,7 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
           }
 
           @if $rfs-safari-iframe-resize-bug-fix {
-            // stylelint-disable-next-line length-zero-no-unit
-            min-width: 0vw;
+                        min-width: 0vw;
           }
         }
       }
@@ -194,7 +154,6 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
   }
 }
 
-// The font-size & responsive-font-size mixin uses RFS to rescale font sizes
 @mixin font-size($fs, $important: false) {
   @include rfs($fs, $important);
 }
diff --git a/files/assets/css/coffee.scss b/files/assets/css/coffee.scss
index ade2fcdf5..3a914fff5 100644
--- a/files/assets/css/coffee.scss
+++ b/files/assets/css/coffee.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #3E2C18;
diff --git a/files/assets/css/coffee_2a96f3.css b/files/assets/css/coffee_2a96f3.css
index 8b302d204..7603ac77f 100644
--- a/files/assets/css/coffee_2a96f3.css
+++ b/files/assets/css/coffee_2a96f3.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_30409f.css b/files/assets/css/coffee_30409f.css
index e49e9c0dc..462007ba1 100644
--- a/files/assets/css/coffee_30409f.css
+++ b/files/assets/css/coffee_30409f.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_38a169.css b/files/assets/css/coffee_38a169.css
index 98f2a9435..ef4f91b75 100644
--- a/files/assets/css/coffee_38a169.css
+++ b/files/assets/css/coffee_38a169.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_3e98a7.css b/files/assets/css/coffee_3e98a7.css
index 9ac474711..91e799683 100644
--- a/files/assets/css/coffee_3e98a7.css
+++ b/files/assets/css/coffee_3e98a7.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_62ca56.css b/files/assets/css/coffee_62ca56.css
index 90584e8cb..28ff99f8b 100644
--- a/files/assets/css/coffee_62ca56.css
+++ b/files/assets/css/coffee_62ca56.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_7b9ae4.css b/files/assets/css/coffee_7b9ae4.css
index d6e3ed733..67af68e51 100644
--- a/files/assets/css/coffee_7b9ae4.css
+++ b/files/assets/css/coffee_7b9ae4.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_7f8fa6.css b/files/assets/css/coffee_7f8fa6.css
index ea222ecf9..75ac93659 100644
--- a/files/assets/css/coffee_7f8fa6.css
+++ b/files/assets/css/coffee_7f8fa6.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_805ad5.css b/files/assets/css/coffee_805ad5.css
index 804d156e5..3c73e20e4 100644
--- a/files/assets/css/coffee_805ad5.css
+++ b/files/assets/css/coffee_805ad5.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_80ffff.css b/files/assets/css/coffee_80ffff.css
index d145a5593..94b6f010f 100644
--- a/files/assets/css/coffee_80ffff.css
+++ b/files/assets/css/coffee_80ffff.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_e4432d.css b/files/assets/css/coffee_e4432d.css
index 3360f9335..a3c162fe7 100644
--- a/files/assets/css/coffee_e4432d.css
+++ b/files/assets/css/coffee_e4432d.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_eb4963.css b/files/assets/css/coffee_eb4963.css
index b1866a1ad..c7422e54b 100644
--- a/files/assets/css/coffee_eb4963.css
+++ b/files/assets/css/coffee_eb4963.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_ec72de.css b/files/assets/css/coffee_ec72de.css
index b11d5eca6..34d4c5afd 100644
--- a/files/assets/css/coffee_ec72de.css
+++ b/files/assets/css/coffee_ec72de.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_f39731.css b/files/assets/css/coffee_f39731.css
index d1393c525..dc2a4a1c9 100644
--- a/files/assets/css/coffee_f39731.css
+++ b/files/assets/css/coffee_f39731.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_f8db58.css b/files/assets/css/coffee_f8db58.css
index d975c0c63..1862d3875 100644
--- a/files/assets/css/coffee_f8db58.css
+++ b/files/assets/css/coffee_f8db58.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_ff0000.css b/files/assets/css/coffee_ff0000.css
index 803d9f36d..10d6aa8a5 100644
--- a/files/assets/css/coffee_ff0000.css
+++ b/files/assets/css/coffee_ff0000.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/coffee_ff66ac.css b/files/assets/css/coffee_ff66ac.css
index d83edd51f..59cd1dde1 100644
--- a/files/assets/css/coffee_ff66ac.css
+++ b/files/assets/css/coffee_ff66ac.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark.scss b/files/assets/css/dark.scss
index ba48c9b3e..019d89a7f 100644
--- a/files/assets/css/dark.scss
+++ b/files/assets/css/dark.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #383838;
diff --git a/files/assets/css/dark_2a96f3.css b/files/assets/css/dark_2a96f3.css
index 0843bd549..1135a4972 100644
--- a/files/assets/css/dark_2a96f3.css
+++ b/files/assets/css/dark_2a96f3.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_30409f.css b/files/assets/css/dark_30409f.css
index de56cab41..37d5926ef 100644
--- a/files/assets/css/dark_30409f.css
+++ b/files/assets/css/dark_30409f.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_38a169.css b/files/assets/css/dark_38a169.css
index a8db94d9d..06f29b422 100644
--- a/files/assets/css/dark_38a169.css
+++ b/files/assets/css/dark_38a169.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_3e98a7.css b/files/assets/css/dark_3e98a7.css
index 7d8a5ae87..cb8b785de 100644
--- a/files/assets/css/dark_3e98a7.css
+++ b/files/assets/css/dark_3e98a7.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_62ca56.css b/files/assets/css/dark_62ca56.css
index e8ebc9b4f..7167d9abb 100644
--- a/files/assets/css/dark_62ca56.css
+++ b/files/assets/css/dark_62ca56.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_7b9ae4.css b/files/assets/css/dark_7b9ae4.css
index 51cf09f3f..76367db17 100644
--- a/files/assets/css/dark_7b9ae4.css
+++ b/files/assets/css/dark_7b9ae4.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_7f8fa6.css b/files/assets/css/dark_7f8fa6.css
index 5f77c3adc..20503a909 100644
--- a/files/assets/css/dark_7f8fa6.css
+++ b/files/assets/css/dark_7f8fa6.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_805ad5.css b/files/assets/css/dark_805ad5.css
index c12b972b2..4c65ef9ef 100644
--- a/files/assets/css/dark_805ad5.css
+++ b/files/assets/css/dark_805ad5.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_80ffff.css b/files/assets/css/dark_80ffff.css
index b31b6c7df..585950597 100644
--- a/files/assets/css/dark_80ffff.css
+++ b/files/assets/css/dark_80ffff.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_e4432d.css b/files/assets/css/dark_e4432d.css
index e23b2fd99..f6b799766 100644
--- a/files/assets/css/dark_e4432d.css
+++ b/files/assets/css/dark_e4432d.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_eb4963.css b/files/assets/css/dark_eb4963.css
index c33c1efad..4056640c4 100644
--- a/files/assets/css/dark_eb4963.css
+++ b/files/assets/css/dark_eb4963.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_ec72de.css b/files/assets/css/dark_ec72de.css
index b8b02acf7..45be12869 100644
--- a/files/assets/css/dark_ec72de.css
+++ b/files/assets/css/dark_ec72de.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_f39731.css b/files/assets/css/dark_f39731.css
index f9bc822c9..981447ff5 100644
--- a/files/assets/css/dark_f39731.css
+++ b/files/assets/css/dark_f39731.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_f8db58.css b/files/assets/css/dark_f8db58.css
index 0c40a8bab..5755960c5 100644
--- a/files/assets/css/dark_f8db58.css
+++ b/files/assets/css/dark_f8db58.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_ff0000.css b/files/assets/css/dark_ff0000.css
index 6c953c113..b5e1ae8bb 100644
--- a/files/assets/css/dark_ff0000.css
+++ b/files/assets/css/dark_ff0000.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/dark_ff66ac.css b/files/assets/css/dark_ff66ac.css
index e4590f936..279888c23 100644
--- a/files/assets/css/dark_ff66ac.css
+++ b/files/assets/css/dark_ff66ac.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/light.scss b/files/assets/css/light.scss
index 466df0c99..6b8600c17 100644
--- a/files/assets/css/light.scss
+++ b/files/assets/css/light.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #23183E;
@@ -60,7 +59,6 @@ $theme-colors: (
 	"reddit": $reddit
 );
 
-// Borders
 
 $input-border-color: $gray-300;
 $border-color: $gray-300;
@@ -68,12 +66,10 @@ $border-color: $gray-300;
 $border-radius: .35rem;
 $border-radius-sm: .25rem;
 
-// Fonts
 
 $font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
 
 
-// Font size
 
 $font-size-base: 1rem;
 
@@ -89,13 +85,11 @@ $display5-weight: 400;
 
 $lead-font-size: $font-size-base * 1.325 !default;
 
-// Font weight
 
 $font-weight-bold: 600;
 $font-weight-bolder: 700;
 $headings-font-weight: $font-weight-bold;
 
-// Spacing
 
 $spacer: 1rem;
 $spacers: (
@@ -104,11 +98,8 @@ $spacers: (
 	8: ($spacer * 10)
 );
 
-// Sizing
 
-// This variable affects the `.h-*` and `.w-*` classes.
 $sizes: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $sizes: map-merge(
 	(
 	25: 25%,
@@ -121,7 +112,6 @@ $sizes: map-merge(
 	$sizes
 );
 
-// Box Shadow
 
 $box-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
 
@@ -129,15 +119,12 @@ $box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.05);
 
 $box-shadow-lg: 0 8px 20px 0 rgba( $black, .1 );
 
-// Tool Tips
 
 $tooltip-opacity: 1;
 
-// Color contrast
 
 $yiq-contrasted-threshold:	160 !default;
 
-// Callouts
 
 @each $color, $value in $theme-colors {
 	.bd-callout-#{$color} {
@@ -204,7 +191,6 @@ body.using-mouse :focus {
 	background-color: $gray-100;
 }
 
-// Docs
 
 #article .navbar-light .navbar-nav .nav-link {
 	color: $black;
@@ -227,7 +213,6 @@ body.using-mouse :focus {
 	margin-top: 2rem;
 }
 
-// Padding and Margins
 
 #thread .custom-gutters {
 	padding: 0 15px;
@@ -239,7 +224,6 @@ body.using-mouse :focus {
 	padding-right: 15px;
 }
 
-// Positioning
 
 .sticky {
 	position: -webkit-sticky;
@@ -268,7 +252,6 @@ body.using-mouse :focus {
 	z-index: 4;
 }
 
-// Type
 
 .text-lg {
 	font-size: $font-size-lg!important;
@@ -300,13 +283,11 @@ body.using-mouse :focus {
 	font-size: 16px;
 }
 
-// Links
 
 a.dropdown-toggle:hover {
 	text-decoration: none;
 }
 
-// list items
 
 .comment-text ul li ul {
 	padding-left: 0;
@@ -335,12 +316,10 @@ ol > li::before {
 [data-bs-toggle="collapse"] .fa:before {	 
 	content: "\f139";
 	}
-	
 [data-bs-toggle="collapse"].collapsed .fa:before {
 	content: "\f13a";
 }
 
-// Buttons
 
 .btn {
 	font-weight: $font-weight-bold;
@@ -400,7 +379,6 @@ ol > li::before {
 	vertical-align: middle;
 }
 
-// Tooltips
 
 .tooltip {
 	font-weight: $font-weight-bold;
@@ -426,7 +404,6 @@ ol > li::before {
 	border-top-color: $black !important;
 }
 
-// Callouts
 
 .bd-callout {
 	padding: 1.25rem;
@@ -437,7 +414,6 @@ ol > li::before {
 	border-radius: .25rem;
 }
 
-// Alerts
 
 .alert {
 	padding: .5rem 1rem;
@@ -456,7 +432,6 @@ ol > li::before {
 	margin-right: 0.5rem;
 }
 
-// Toasts
 
 .toast {
 	font-size: $font-size-base;
@@ -475,7 +450,6 @@ ol > li::before {
 	border-radius: $border-radius;
 }
 
-// Navbar and tab Bar
 
 .navbar-light {
 	background-color: $white;
@@ -522,7 +496,6 @@ ol > li::before {
 	z-index: 5;
 }
 
-// Nav links
 
 .navbar-nav .nav-link {
 	padding: 0.25rem 0.5rem;
@@ -629,7 +602,6 @@ ol > li::before {
 
 .post-nav > .nav-item > .nav-link.active {
 	color: $primary;
-	//box-shadow: inset 0 -2px 0 $primary;
 }
 
 .settings-nav > .nav-item > .nav-link.active {
@@ -655,7 +627,6 @@ ol > li::before {
 	color: $gray-500;
 }
 
-// Settings navigation
 
 .settings-nav > .nav-item > .nav-link.active {
 	color: $primary;
@@ -672,7 +643,6 @@ ol > li::before {
 	color: $muted;
 }
 
-// Color Picker
 
 .color-picker input[type="radio"] {
 	display: none;
@@ -696,7 +666,6 @@ label.color-radio span {
 }
 
 
-// Nav pills
 
 #page .nav-pills .nav-link {
 	border-radius: 0;
@@ -725,7 +694,6 @@ label.color-radio span {
 	border-bottom: 2px solid $primary;
 }
 
-// Navbar icons and search box
 
 .form-inline.search .form-control:hover, .form-inline.search .form-control:active, .form-inline.search .form-control:focus {
 	border-color: $purple;
@@ -772,7 +740,6 @@ label.color-radio span {
 	color: $black;
 }
 
-// Jumbotron and Backgrounds
 
 .bg-svg {
 	background-color: $dark;
@@ -780,7 +747,6 @@ label.color-radio span {
 	background-size: cover;
 }
 
-// Inputs
 
 .form-control {
 	color: $muted;
@@ -876,19 +842,16 @@ label.terms {
 	color: $black;
 }
 
-// Typography
 
 small, .small {
 	font-size: $small-font-size;
 }
 
-// Tables
 
 th {
 	font-weight: $font-weight-bold;
 }
 
-// Font Awesome
 
 .fa-rotate-45 {
 	-webkit-transform: rotate(45deg);
@@ -933,7 +896,6 @@ th {
 	color: $gray;
 }
 
-// Voting
 
 .voting {
 	position: relative;
@@ -1044,7 +1006,6 @@ th {
 	color: $gray-300 !important;		
 }
 
-// Link Arrow Symbol
 
 a .link-arrow {
 position: relative;
@@ -1059,13 +1020,11 @@ right: -.5rem;
 color: $dark;
 }
 
-// Custom Box Shadows (behaves like borders)
 
 .box-shadow-bottom {
 	box-shadow: inset 0 -1px 0 $border-color;
 }
 
-// Custom Borders
 
 .border-1 {
 	border-width: 1px;
@@ -1092,7 +1051,6 @@ color: $dark;
 	border-style: solid;
 }
 
-// Opacity
 
 .opacity-25 {
 	opacity: .25;
@@ -1106,13 +1064,11 @@ color: $dark;
 	opacity: .8;
 }
 
-// Main Content
 
 #frontpage .pseudo-submit-form.card, #search .search-results.card {
 	background-color: $white;
 	border-radius: $border-radius;
 	border: 1px solid $border-color;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage .pseudo-submit-form.card .card-body, #search .search-results.card .card-body {
@@ -1166,7 +1122,6 @@ color: $dark;
 	color: $black;
 	background-color: $white;
 	border-radius: $border-radius;
-	//border: 1px solid $border-color;
 }
 
 .filter-list .filter-item .fa, .filter-list .filter-item .fas, .filter-list .filter-item .far, .filter-list .filter-item .fab, .filter-list .filter-item .fal {
@@ -1247,13 +1202,11 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	margin-bottom: .25rem;
 }
 
-// Progress Bar
 
 .progress {
 	border-radius: 50%;
 }
 
-// User and Profile
 
 .user-name {
 	color: inherit;
@@ -1414,7 +1367,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	margin-left: 0;
 }
 
-// Thread Card View
 
 /*
 
@@ -1432,7 +1384,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
@@ -1506,7 +1457,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: none;
 }
 
-// Thread
 
 .card-header:first-child {
 	border-radius: $border-radius $border-radius 0 0;
@@ -1591,7 +1541,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	overflow: hidden;
 }
 
-// Modals (post actions, delete confirmations, etc)
 
 .modal-backdrop.show {
 	opacity: 1;
@@ -1727,7 +1676,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	font-size: 1.25rem;
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 	.modal.modal.modal-sm-bottom .modal-dialog {
 		position: fixed;
@@ -1757,7 +1705,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	}
 } 
 
-// Dropdown actions
 
 .dropdown-actions {
 	position: relative;
@@ -1842,13 +1789,11 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	margin-right: 0;
 }
 
-// Pagination
 
 .page-link {
 	font-weight: $font-weight-bold;
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 	.post-actions .list-inline .list-inline-item {
 	margin-right: 1.5rem;
@@ -1932,7 +1877,6 @@ div:hover .thumb-img-link-overlay {
 	display: none;
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) { 
 	.post-img {
 	width: 80px;
@@ -1959,7 +1903,6 @@ div:hover .thumb-img-link-overlay {
 	color: $muted;
 }
 
-// Thread Comments
 
 .comments-count {
 	display: flex;
@@ -2040,7 +1983,6 @@ blockquote p {
 	margin-bottom: 0;
 }
 
-// Modal Comment Actions
 
 .modal .comment-actions .list-group-item {
 	border: none;
@@ -2061,7 +2003,6 @@ blockquote p {
 	font-size: $font-size-base;
 }
 
-// Comments
 
 .comment-section {
 	background-color: $gray-100;
@@ -2264,7 +2205,6 @@ ul.comment-section {
 	padding-right: .25rem;
 }
 
-// Thread Reactions
 
 .reactions-count {
 	margin-bottom: 3rem;
@@ -2298,7 +2238,6 @@ ul.comment-section {
 	color: $purple
 }
 
-// Login Page
 
 #login {
 	padding-top: 0;
@@ -2341,13 +2280,11 @@ ul.comment-section {
 	font-weight: $font-weight-normal;
 }
 
-// Pagination
 
 .pagination {
 	padding: 1rem 0;
 }
 
-// Tables
 
 .table .thead-dark th {
 	color: $muted;
@@ -2357,13 +2294,11 @@ ul.comment-section {
 	border: none;
 }
 
-// Settings Page
 
 .settings .settings-section {
 	margin-bottom: 3rem;
 	background: $white;
 	border: 1px solid $border-color;
-	//box-shadow: $box-shadow-sm;
 	border-radius: 0.35rem;
 	overflow: hidden;
 }
@@ -2380,7 +2315,6 @@ ul.comment-section {
 	background-color: $gray-200;
 }
 
-// Modal Profile Actions
 
 .modal .profile-actions .list-group-item {
 	border: none;
@@ -2401,7 +2335,6 @@ ul.comment-section {
 	font-size: $font-size-base;
 }
 
-// Profile Page
 
 .profile-actions a {
 	color: $gray;
@@ -2438,7 +2371,6 @@ ul.comment-section {
 	color: $black;
 }
 
-// Footer
 
 #page .footer h1, #page .footer h2, #page .footer h3, #page .footer h4, #page .footer h5, #page .footer h6,
 #article .footer h1, #article .footer h2, #article .footer h3, #article .footer h4, #article .footer h5, #article .footer h6 {
@@ -2471,7 +2403,6 @@ ul.comment-section {
 	color: $white;
 }
 
-// Empty States
 
 .empty-state-img {
 	width: 200px;
@@ -2479,7 +2410,6 @@ ul.comment-section {
 	filter: brightness(0);
 }
 
-// Animate FA Icons
 
 .ghost {
 	-webkit-animation: ghost 2s infinite	alternate;
@@ -2498,7 +2428,6 @@ ul.comment-section {
 	100% { transform: translateY(-20px); }
 };
 
-// Responsive Borders
 
 @each $breakpoint in map-keys($grid-breakpoints) {
 	@include media-breakpoint-up($breakpoint) {
@@ -2532,7 +2461,6 @@ ul.comment-section {
 		border: none !important;
 	}
 
-// Responsive Border Radius
  
 	.rounded#{$infix}		{ @include border-radius($border-radius); }
 	.rounded#{$infix}-top	{ @include border-top-radius($border-radius); @include border-bottom-radius(0); }
@@ -2545,7 +2473,6 @@ ul.comment-section {
 	}
 }
 
-// Responsive Shadow
 
 @media (min-width: 768px) {
 	.shadow-md {
@@ -2553,7 +2480,6 @@ ul.comment-section {
 	}
 	}
 
-// Responsive Sizing
 
 @media (min-width: 576px) {
 	.w-sm-25 {
@@ -2587,7 +2513,6 @@ ul.comment-section {
 		height: auto !important;
 	}
 	}
-	
 	@media (min-width: 768px) {
 	.w-md-25 {
 		width: 25% !important;
@@ -2620,7 +2545,6 @@ ul.comment-section {
 		height: auto !important;
 	}
 	}
-	
 	@media (min-width: 992px) {
 	.w-lg-25 {
 		width: 25% !important;
@@ -2653,7 +2577,6 @@ ul.comment-section {
 		height: auto !important;
 	}
 	}
-	
 	@media (min-width: 1200px) {
 	.w-xl-25 {
 		width: 25% !important;
@@ -2687,7 +2610,6 @@ ul.comment-section {
 	}
 	}
 
-// Submit Page
 
 .text-format {
 	display: flex;
@@ -2722,14 +2644,12 @@ ul.comment-section {
 	border-bottom-right-radius: .25rem;
 }
 
-// Transitions 
 
 .transition-15 {
 	-webkit-transition: width .15s;
 	transition: width .15s;
 }
 
-// Custom Checkboxes and Radio Buttons
 
 .custom-control-label {
 	text-transform: none;
@@ -2744,15 +2664,12 @@ ul.comment-section {
 	border: 1px solid $purple;
 }
 
-// Custom Switch (iOS-like toggle)
 
 .custom-switch {
 	padding-left: 2.25rem;
-	padding-bottom: 1rem; // added for positioning
-}
+	padding-bottom: 1rem; }
 
-.custom-switch .custom-control-label { // added for alignment with the switch
-	padding-top: 0.5rem;
+.custom-switch .custom-control-label { 	padding-top: 0.5rem;
 	padding-left: 2rem;
 	padding-bottom: 0.1rem;
 }
@@ -2771,8 +2688,7 @@ ul.comment-section {
 .custom-switch .custom-control-label::before {
 	left: -2.25rem;
 	height: 1.5rem;
-	width: 2.75rem;	// it was 1.75rem before. Sliding way is longer than before.
-	pointer-events: all;
+	width: 2.75rem;		pointer-events: all;
 	border-radius: 1rem;
 	background-color: $gray-500;
 	border: $gray-500 solid 1px;
@@ -2786,9 +2702,7 @@ ul.comment-section {
 .custom-switch .custom-control-label::after {
 	top: calc(0.25rem + 2px);
 	left: calc(-2.25rem + 2px);
-	width: calc(1.5rem - 4px);	 // it was calc(1rem - 4px) before. Oval is bigger than before.
-	height: calc(1.5rem - 4px);	// it was calc(1rem - 4px) before. Oval is bigger than before.
-	background-color: $white;
+	width: calc(1.5rem - 4px);	 	height: calc(1.5rem - 4px);		background-color: $white;
 	border-radius: 2rem; //	 it was 0.5rem before. Oval is bigger than before.
 	transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
 	transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@@ -2807,7 +2721,6 @@ ul.comment-section {
 	transform: translateX(1.25rem); //translateX(0.75rem);
 }
 
-// Code
 
 pre code {
 	word-break: break-word;
@@ -2815,7 +2728,6 @@ pre code {
 	color: $code;
 }
 
-// Code Prettify
 
 pre.prettyprint {
 	padding: 0;
@@ -2873,7 +2785,6 @@ pre .clo, pre .opn, pre .pun, code .clo, code .opn, code .pun {
 	color: #fff;
 }
 
-// GIF Keyboard
 
 .gif-categories .card {
 	overflow: hidden;
@@ -2915,16 +2826,13 @@ pre .clo, pre .opn, pre .pun, code .clo, code .opn, code .pun {
 	border-radius: $border-radius;
 }
 
-// Responsive media queries
 
-// Medium devices (tablets, less than 992px)
 @media (max-width: 991.98px) {
 	#frontpage, #search {
 		padding-top: 49px;
 	}
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 
 html {
@@ -3024,7 +2932,6 @@ body, #settings, #notifications, #submit{
 	padding-top: 2px;
 }
 
-// Toasts
 
 .toast {
 	bottom: 1.5rem;
@@ -3051,7 +2958,6 @@ body, #settings, #notifications, #submit{
 
 */
 
-// Posts and thread
 
 .posts, #thread #main-content-col {
 	box-shadow: none;
@@ -3121,7 +3027,6 @@ body, #settings, #notifications, #submit{
 	font-size: $font-size-lg;
 }
 
-// Voting Mobile
 
 .comment-actions .score {
 	color: $muted;
@@ -3158,7 +3063,6 @@ body, #settings, #notifications, #submit{
 	font-size: $small-font-size;
 }
 
-// Comments
 
 .comment-section {
 	background-color: $white;
@@ -3201,13 +3105,11 @@ body, #settings, #notifications, #submit{
 	color: $gray-400;
 }
 
-// User and Profile (mobile)
 
 .banner-pic-135 {
 	max-width: 100%
 }
 
-// Horizontal scroll
 
 .x-scroll-parent {
 	overflow: hidden;
@@ -3312,14 +3214,12 @@ textarea, input[type=text] {
 
 }
 
-// Scroll bar
 
 .hide-scrollbar::-webkit-scrollbar {
 	width: 0px;
 	background: transparent;
 }
 
-// Hides scroll bar in FF
 
 .hide-scrollbar {
 	scrollbar-width: none;
@@ -3344,11 +3244,9 @@ div.banned {
 div.deleted {
 	background-color: $deleted;
 }	
-	
 div.deleted.banned {
 	background-color: $deletedandbanned
 }
-			
 .distinguish-admin .user-name, .distinguish-mod	 .user-name {		
 	color: white;		
 	padding: 0px 3px 2px 3px;		
@@ -3412,13 +3310,11 @@ img.emoji {
 	padding-right: 20px;
 	cursor: pointer;
 	}
-	
 .comment .comment-collapse-desktop:hover {
 	border-left-color: $gray !important; }
 
 .comment.collapsed .comment-collapse-desktop:hover {
 	color: $gray !important; }
-	
 #frontpage .post-title a:visited {
 	color: $gray;
 }
diff --git a/files/assets/css/light_2a96f3.css b/files/assets/css/light_2a96f3.css
index ba2da3123..f23a4d392 100644
--- a/files/assets/css/light_2a96f3.css
+++ b/files/assets/css/light_2a96f3.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_30409f.css b/files/assets/css/light_30409f.css
index 3bd57144d..190d751e5 100644
--- a/files/assets/css/light_30409f.css
+++ b/files/assets/css/light_30409f.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_38a169.css b/files/assets/css/light_38a169.css
index faf63877a..731d18e73 100644
--- a/files/assets/css/light_38a169.css
+++ b/files/assets/css/light_38a169.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_3e98a7.css b/files/assets/css/light_3e98a7.css
index 82d6ff93a..20c8cda39 100644
--- a/files/assets/css/light_3e98a7.css
+++ b/files/assets/css/light_3e98a7.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_62ca56.css b/files/assets/css/light_62ca56.css
index 8df5c12d1..07d340f23 100644
--- a/files/assets/css/light_62ca56.css
+++ b/files/assets/css/light_62ca56.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_7b9ae4.css b/files/assets/css/light_7b9ae4.css
index beb24406d..88895f7a9 100644
--- a/files/assets/css/light_7b9ae4.css
+++ b/files/assets/css/light_7b9ae4.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_7f8fa6.css b/files/assets/css/light_7f8fa6.css
index a572dd869..30ee27f81 100644
--- a/files/assets/css/light_7f8fa6.css
+++ b/files/assets/css/light_7f8fa6.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_805ad5.css b/files/assets/css/light_805ad5.css
index b5560e388..c3161c0eb 100644
--- a/files/assets/css/light_805ad5.css
+++ b/files/assets/css/light_805ad5.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_80ffff.css b/files/assets/css/light_80ffff.css
index d75612627..965602d7e 100644
--- a/files/assets/css/light_80ffff.css
+++ b/files/assets/css/light_80ffff.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_e4432d.css b/files/assets/css/light_e4432d.css
index 8c2b72b23..8211a5e97 100644
--- a/files/assets/css/light_e4432d.css
+++ b/files/assets/css/light_e4432d.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_eb4963.css b/files/assets/css/light_eb4963.css
index e20d84056..4f1b5d2ef 100644
--- a/files/assets/css/light_eb4963.css
+++ b/files/assets/css/light_eb4963.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_ec72de.css b/files/assets/css/light_ec72de.css
index b0ebe6282..40323e9df 100644
--- a/files/assets/css/light_ec72de.css
+++ b/files/assets/css/light_ec72de.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_f39731.css b/files/assets/css/light_f39731.css
index 9bfeebad0..dd617c4d6 100644
--- a/files/assets/css/light_f39731.css
+++ b/files/assets/css/light_f39731.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_f8db58.css b/files/assets/css/light_f8db58.css
index 47041aea4..e2ae9cf45 100644
--- a/files/assets/css/light_f8db58.css
+++ b/files/assets/css/light_f8db58.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_ff0000.css b/files/assets/css/light_ff0000.css
index 83a652fce..8df678e79 100644
--- a/files/assets/css/light_ff0000.css
+++ b/files/assets/css/light_ff0000.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/light_ff66ac.css b/files/assets/css/light_ff66ac.css
index cb5e29827..426b6891f 100644
--- a/files/assets/css/light_ff66ac.css
+++ b/files/assets/css/light_ff66ac.css
@@ -14472,7 +14472,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
 	border-bottom-left-radius: $border-radius;
 	border-bottom-right-radius: $border-radius;
-	//border: 1px solid $border-color;
 	border-radius: $border-radius;
 }
 
diff --git a/files/assets/css/main.scss b/files/assets/css/main.scss
index 0f8f4c799..c72cfea61 100644
--- a/files/assets/css/main.scss
+++ b/files/assets/css/main.scss
@@ -26,7 +26,6 @@ $theme-colors: (
 	"reddit": $reddit
 );
 
-// Borders
 
 $input-border-color: $gray-400;
 $border-color: $gray-400;
@@ -35,11 +34,9 @@ $border-radius: .35rem;
 
 $text-white: $white;
 
-// Fonts
 
 $font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
 
-// Font size
 
 $font-size-base: 1rem;
 
@@ -55,13 +52,11 @@ $display5-weight: 400;
 
 $lead-font-size: $font-size-base * 1.325 !default;
 
-// Font weight
 
 $font-weight-bold: 600;
 $font-weight-bolder: 700;
 $headings-font-weight: $font-weight-bold;
 
-// Spacing
 
 $spacer: 1rem;
 $spacers: (
@@ -70,11 +65,8 @@ $spacers: (
 	8: ($spacer * 10)
 );
 
-// Sizing
 
-// This variable affects the `.h-*` and `.w-*` classes.
 $sizes: () !default;
-// stylelint-disable-next-line scss/dollar-variable-default
 $sizes: map-merge(
 	(
 	25: 25%,
@@ -87,21 +79,17 @@ $sizes: map-merge(
 	$sizes
 );
 
-// Box Shadow
 
 $box-shadow-sm: 0 0.1px 3px 0 rgba(0, 0, 0, 0.05), 0 0.1px 2px 0 rgba(0, 0, 0, 0.03);
 
 $box-shadow: 0 0.1px 3px rgba(0, 0, 0, 0.05), 0 0 0 0.1px rgba(0, 0, 0, 0.05);
 
-// Tool Tips
 
 $tooltip-opacity: 1;
 
-// Color contrast
 
 $yiq-contrasted-threshold:	160 !default;
 
-// Callouts
 
 @each $color, $value in $theme-colors {
 	.bd-callout-#{$color} {
@@ -168,7 +156,6 @@ body.using-mouse :focus {
 	background-color: $gray-700;
 }
 
-// Docs
 
 #article .navbar-light .navbar-nav .nav-link {
 	color: $black;
@@ -192,7 +179,6 @@ body.using-mouse :focus {
 }
 
 
-// Padding and Margins
 
 #thread .custom-gutters {
 	padding: 0 10px;
@@ -203,7 +189,6 @@ body.using-mouse :focus {
 	padding-right: 10px;
 }
 
-// Positioning
 
 .sticky {
 	position: -webkit-sticky;
@@ -232,7 +217,6 @@ body.using-mouse :focus {
 	z-index: 4;
 }
 
-// Type
 
 .text-lg {
 	font-size: $font-size-lg!important;
@@ -264,13 +248,11 @@ body.using-mouse :focus {
 	font-size: 16px;
 }
 
-// Links
 
 a.dropdown-toggle:hover {
 	text-decoration: none;
 }
 
-// list items
 
 .comment-text ul li ul {
 	padding-left: 0;
@@ -304,7 +286,6 @@ ol > li::before {
 	content: "\f13a";
 }
 
-// Buttons
 
 .btn {
 	font-weight: $font-weight-bold;
@@ -360,7 +341,6 @@ ol > li::before {
 	vertical-align: middle;
 }
 
-// Tooltips
 
 .tooltip {
 	font-weight: $font-weight-bold;
@@ -387,7 +367,6 @@ ol > li::before {
 	border-top-color: $white !important;
 }
 
-// Alerts
 
 .alert {
 	padding: .5rem 1rem;
@@ -406,7 +385,6 @@ ol > li::before {
 	margin-right: 0.5rem;
 }
 
-// Toasts
 
 .toast {
 	font-size: $font-size-base;
@@ -424,7 +402,6 @@ ol > li::before {
 	background-color: $dark;
 }
 
-// Navbar and tab Bar
 
 .navbar-light {
 	background-color: $gray-500!important;
@@ -480,7 +457,6 @@ ol > li::before {
 	z-index: 5;
 }
 
-// Nav links
 
 .navbar-nav .nav-link {
 	padding: 0.25rem 0.5rem;
@@ -586,7 +562,6 @@ ol > li::before {
 
 .post-nav > .nav-item > .nav-link.active {
 	color: $primary;
-	//box-shadow: inset 0 -2px 0 $primary;
 }
 
 .settings-nav > .nav-item > .nav-link.active {
@@ -612,7 +587,6 @@ ol > li::before {
 	color: $muted;
 }
 
-// Settings navigation
 
 .settings-nav > .nav-item > .nav-link.active {
 	color: $primary;
@@ -629,7 +603,6 @@ ol > li::before {
 	color: $muted;
 }
 
-// Color Picker
 
 .color-picker input[type="radio"] {
 	display: none;
@@ -652,7 +625,6 @@ label.color-radio span {
 	line-height: 2.25;
 }
 
-// Nav pills
 
 #page .nav-pills .nav-link {
 	border-radius: 0;
@@ -681,7 +653,6 @@ label.color-radio span {
 	border-bottom: 2px solid $primary;
 }
 
-// Navbar icons and search box
 
 .form-inline.search .form-control:hover, .form-inline.search .form-control:active, .form-inline.search .form-control:focus {
 	border-color: $purple;
@@ -701,22 +672,18 @@ label.color-radio span {
 
 .form-inline.search .input-group-append .input-group-text .fa.fa-search, .form-inline.search .input-group-append-focus .input-group-text .fa.fa-search {
 	color: $black;
-	//opacity: .25;
 }
 
 .form-inline.search .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
 	color: $black;
-	//opacity: .25; /* Firefox */
 }
 
 .form-inline.search .form-control::-ms-input-placeholder { /* Internet Explorer 10-11 */
 	color: $black;
-	//opacity: .25;
 }
 
 .form-inline.search .form-control::-ms-input-placeholder { /* Microsoft Edge */
 	color: $black;
-	//opacity: .25;
 }
 
 .form-inline.search .form-control:active::placeholder, .form-inline.search .form-control:focus::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
@@ -731,7 +698,6 @@ label.color-radio span {
 	color: $black;
 }
 
-// Jumbotron and Backgrounds
 
 .bg-svg {
 	background-color: $dark;
@@ -739,7 +705,6 @@ label.color-radio span {
 	background-size: cover;
 }
 
-// Inputs
 
 .form-control {
 	color: $muted;
@@ -784,17 +749,14 @@ label.color-radio span {
 
 .form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
 	color: $black;
-	//opacity: .25; /* Firefox */
 }
 
 .form-control::-ms-input-placeholder { /* Internet Explorer 10-11 */
 	color: $black;
-	//opacity: .25;
 }
 
 .form-control::-ms-input-placeholder { /* Microsoft Edge */
 	color: $black;
-	//opacity: .25;
 }
 
 .form-check-label {
@@ -857,19 +819,16 @@ label.terms {
 	color: $black;
 }
 
-// Typography
 
 small, .small {
 	font-size: $small-font-size;
 }
 
-// Tables
 
 th {
 	font-weight: $font-weight-bold;
 }
 
-// Font Awesome
 
 .fa-rotate-45 {
 	-webkit-transform: rotate(45deg);
@@ -914,7 +873,6 @@ th {
 	color: $black;
 }
 
-// Voting
 
 .voting {
 	position: relative;
@@ -1037,7 +995,6 @@ th {
 	color: $gray-300 !important;
 }
 
-// Link Arrow Symbol
 
 a .link-arrow {
 position: relative;
@@ -1052,13 +1009,11 @@ right: -.5rem;
 color: $dark;
 }
 
-// Custom Box Shadows (behaves like borders)
 
 .box-shadow-bottom {
 	box-shadow: inset 0 -0.1px 0 $border-color;
 }
 
-// Custom Borders
 
 .border-1 {
 	border-width: 0.1px;
@@ -1085,7 +1040,6 @@ color: $dark;
 	border-style: solid;
 }
 
-// Opacity
 
 .opacity-25 {
 	opacity: .25;
@@ -1099,7 +1053,6 @@ color: $dark;
 	opacity: .8;
 }
 
-// Main Content
 
 .pseudo-submit-form .card-header {
 	background-color: $gray-600!important;
@@ -1109,7 +1062,6 @@ color: $dark;
 	background-color: $gray-600;
 	border-radius: $border-radius;
 	border: none;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage .pseudo-submit-form.card .card-body, #search .search-results.card .card-body {
@@ -1164,7 +1116,6 @@ color: $dark;
 	color: $black;
 	background-color: $light;
 	border-radius: $border-radius;
-	//border: 0.1px solid $border-color;
 }
 
 .filter-list .filter-item .fa, .filter-list .filter-item .fas, .filter-list .filter-item .far, .filter-list .filter-item .fab, .filter-list .filter-item .fal {
@@ -1245,13 +1196,11 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	margin-bottom: .25rem;
 }
 
-// Progress Bar
 
 .progress {
 	border-radius: 50%;
 }
 
-// User and Profile
 
 .user-name {
 	color: inherit;
@@ -1413,7 +1362,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	margin-left: 0;
 }
 
-// Thread Card View
 
 /*
 
@@ -1425,7 +1373,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
@@ -1505,7 +1452,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: none;
 }
 
-// Thread
 
 .card-header:first-child {
 	border-radius: $border-radius $border-radius 0 0;
@@ -1598,7 +1544,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	overflow: hidden;
 }
 
-// Modals (post actions, delete confirmations, etc)
 
 .modal-backdrop.show {
 	opacity: 1;
@@ -1742,7 +1687,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	font-size: 1.25rem;
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 	.modal.modal.modal-sm-bottom .modal-dialog {
 		position: fixed;
@@ -1772,7 +1716,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	}
 }
 
-// Dropdown actions
 
 .dropdown-actions {
 	position: relative;
@@ -1875,7 +1818,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	opacity: 0.5;
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 	.post-actions .list-inline .list-inline-item {
 	margin-right: 1.5rem;
@@ -1958,7 +1900,6 @@ div:hover .thumb-img-link-overlay {
 	display: none;
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 	.post-img {
 	width: 80px;
@@ -1985,7 +1926,6 @@ div:hover .thumb-img-link-overlay {
 	color: $muted;
 }
 
-// Thread Comments
 
 .comments-count {
 	display: flex;
@@ -2067,7 +2007,6 @@ blockquote p {
 	margin-bottom: 0;
 }
 
-// Modal Comment Actions
 
 .modal .comment-actions .list-group-item {
 	border: none;
@@ -2089,7 +2028,6 @@ blockquote p {
 	font-size: $font-size-base;
 }
 
-// Comments
 
 .comment-section {
 	background-color: $gray-700;
@@ -2301,7 +2239,6 @@ ul.comment-section {
 	padding-right: .25rem;
 }
 
-// Thread Reactions
 
 .reactions-count {
 	margin-bottom: 3rem;
@@ -2335,7 +2272,6 @@ ul.comment-section {
 	color: $purple
 }
 
-// Login Page
 
 #login {
 	padding-top: 0;
@@ -2378,13 +2314,11 @@ ul.comment-section {
 	font-weight: $font-weight-normal;
 }
 
-// Pagination
 
 .pagination {
 	padding: 1rem 0;
 }
 
-// Tables
 
 .table .thead-dark th {
 	color: $muted;
@@ -2394,13 +2328,11 @@ ul.comment-section {
 	border: none;
 }
 
-// Settings Page
 
 .settings .settings-section {
 	margin-bottom: 3rem;
 	background: $gray-500;
 	border: 0.1px solid $border-color;
-	//box-shadow: $box-shadow-sm;
 	border-radius: $border-radius;
 	overflow: hidden;
 }
@@ -2421,7 +2353,6 @@ ul.comment-section {
 	background-color: $secondary;
 }
 
-// Modal Profile Actions
 
 .modal .profile-actions .list-group-item {
 	border: none;
@@ -2442,7 +2373,6 @@ ul.comment-section {
 	font-size: $font-size-base;
 }
 
-// Profile Page
 
 .profile-actions a {
 	color: $gray;
@@ -2479,7 +2409,6 @@ ul.comment-section {
 	color: $black;
 }
 
-// Footer
 
 #page .footer h1, #page .footer h2, #page .footer h3, #page .footer h4, #page .footer h5, #page .footer h6,
 #article .footer h1, #article .footer h2, #article .footer h3, #article .footer h4, #article .footer h5, #article .footer h6 {
@@ -2512,7 +2441,6 @@ ul.comment-section {
 	color: $white;
 }
 
-// Empty States
 
 .empty-state-img {
 	width: 200px;
@@ -2520,7 +2448,6 @@ ul.comment-section {
 	filter: brightness(0);
 }
 
-// Animate FA Icons
 
 .ghost {
 	-webkit-animation: ghost 2s infinite	alternate;
@@ -2539,7 +2466,6 @@ ul.comment-section {
 	100% { transform: translateY(-20px); }
 };
 
-// Responsive Borders
 
 @each $breakpoint in map-keys($grid-breakpoints) {
 	@include media-breakpoint-up($breakpoint) {
@@ -2573,7 +2499,6 @@ ul.comment-section {
 		border: none !important;
 	}
 
-// Responsive Border Radius
 
 	.rounded#{$infix}		{ @include border-radius($border-radius); }
 	.rounded#{$infix}-top	{ @include border-top-radius($border-radius); @include border-bottom-radius(0); }
@@ -2586,7 +2511,6 @@ ul.comment-section {
 	}
 }
 
-// Responsive Sizing
 
 @media (min-width: 576px) {
 	.w-sm-25 {
@@ -2720,7 +2644,6 @@ ul.comment-section {
 	}
 	}
 
-// Submit Page
 
 .text-format {
 	display: flex;
@@ -2755,14 +2678,12 @@ ul.comment-section {
 	border-bottom-right-radius: .25rem;
 }
 
-// Transitions
 
 .transition-15 {
 	-webkit-transition: width .15s;
 	transition: width .15s;
 }
 
-// Custom Checkboxes and Radio Buttons
 
 .custom-control-label {
 	text-transform: none;
@@ -2777,15 +2698,12 @@ ul.comment-section {
 	border: 0.1px solid $purple;
 }
 
-// Custom Switch (iOS-like toggle)
 
 .custom-switch {
 	padding-left: 2.25rem;
-	padding-bottom: 1rem; // added for positioning
-}
+	padding-bottom: 1rem; }
 
-.custom-switch .custom-control-label { // added for alignment with the switch
-	padding-top: 0.5rem;
+.custom-switch .custom-control-label { 	padding-top: 0.5rem;
 	padding-left: 2rem;
 	padding-bottom: 0.1rem;
 }
@@ -2804,8 +2722,7 @@ ul.comment-section {
 .custom-switch .custom-control-label::before {
 	left: -2.25rem;
 	height: 1.5rem;
-	width: 2.75rem;	// it was 1.75rem before. Sliding way is longer than before.
-	pointer-events: all;
+	width: 2.75rem;		pointer-events: all;
 	border-radius: 1rem;
 	background-color: $gray-100;
 	border: $gray-100 solid 0.1px;
@@ -2819,9 +2736,7 @@ ul.comment-section {
 .custom-switch .custom-control-label::after {
 	top: calc(0.25rem + 2px);
 	left: calc(-2.25rem + 2px);
-	width: calc(1.5rem - 4px);	 // it was calc(1rem - 4px) before. Oval is bigger than before.
-	height: calc(1.5rem - 4px);	// it was calc(1rem - 4px) before. Oval is bigger than before.
-	background-color: $light;
+	width: calc(1.5rem - 4px);	 	height: calc(1.5rem - 4px);		background-color: $light;
 	border-radius: 2rem; //	 it was 0.5rem before. Oval is bigger than before.
 	transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-transform 0.15s ease-in-out;
 	transition: transform 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
@@ -2840,7 +2755,6 @@ ul.comment-section {
 	transform: translateX(1.25rem); //translateX(0.75rem);
 }
 
-// Code
 
 pre code {
 	word-break: break-word;
@@ -2848,7 +2762,6 @@ pre code {
 	color: $code;
 }
 
-// Code Prettify
 
 pre.prettyprint {
 	padding: 0;
@@ -2906,7 +2819,6 @@ pre .clo, pre .opn, pre .pun, code .clo, code .opn, code .pun {
 	color: $white;
 }
 
-// GIF Keyboard
 
 .gif-categories .card {
 	overflow: hidden;
@@ -2948,16 +2860,13 @@ pre .clo, pre .opn, pre .pun, code .clo, code .opn, code .pun {
 	border-radius: $border-radius;
 }
 
-// Responsive media queries
 
-// Medium devices (tablets, less than 992px)
 @media (max-width: 991.98px) {
 	#frontpage, #search {
 		padding-top: 49px;
 	}
 }
 
-// Small devices (landscape phones, less than 768px)
 @media (max-width: 767.98px) {
 
 html {
@@ -3073,7 +2982,6 @@ body, #settings, #notifications, #submit {
 	padding-top: 2px;
 }
 
-// Toasts
 
 .toast {
 	bottom: 1.5rem;
@@ -3082,7 +2990,6 @@ body, #settings, #notifications, #submit {
 	right: 0;
 }
 
-// Posts and thread
 
 #thread .card {
 	background-color: $gray-600;
@@ -3157,7 +3064,6 @@ body, #settings, #notifications, #submit {
 	font-size: $font-size-lg;
 }
 
-// Voting Mobile
 
 .comment-actions .score {
 	color: $gray-200;
@@ -3193,7 +3099,6 @@ body, #settings, #notifications, #submit {
 	font-size: $small-font-size;
 }
 
-// Comments
 
 .comment-section {
 	background-color: $gray-600;
@@ -3232,13 +3137,11 @@ body, #settings, #notifications, #submit {
 	color: $gray-100;
 }
 
-// User and Profile (mobile)
 
 .banner-pic-135 {
 	max-width: 100%
 }
 
-// Horizontal scroll
 
 .x-scroll-parent {
 	overflow: hidden;
@@ -3344,7 +3247,6 @@ textarea, input[type=text] {
 
 }
 
-// Dark Mode
 
 .bg-white {
 	background-color: $gray-600!important;
@@ -3367,14 +3269,12 @@ textarea, input[type=text] {
 	background-image: linear-gradient(180deg, #ffffff00 25%, $gray-600 100%)!important;
 }
 
-// Scroll bar
 
 .hide-scrollbar::-webkit-scrollbar {
 	width: 0px;
 	background: transparent;
 }
 
-// Hides scroll bar in FF
 
 .hide-scrollbar {
 	scrollbar-width: none;
@@ -3466,14 +3366,12 @@ img.emoji {
 	padding-right: 20px;
 	cursor: pointer;
 	}
-	
 .comment .comment-collapse-desktop:hover {
 	border-left-color: $white !important;
 }
 
 .comment.collapsed .comment-collapse-desktop:hover {
 	color:$white !important; }
-	
 #frontpage .post-title a:visited {
 	color: $gray-200;
 }
diff --git a/files/assets/css/midnight.scss b/files/assets/css/midnight.scss
index f73a9f5b4..2bb81094a 100644
--- a/files/assets/css/midnight.scss
+++ b/files/assets/css/midnight.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #8b949e;
diff --git a/files/assets/css/midnight_2a96f3.css b/files/assets/css/midnight_2a96f3.css
index 16c67f265..ad6d2d68c 100644
--- a/files/assets/css/midnight_2a96f3.css
+++ b/files/assets/css/midnight_2a96f3.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_30409f.css b/files/assets/css/midnight_30409f.css
index 7c3fe68c7..c6abadd66 100644
--- a/files/assets/css/midnight_30409f.css
+++ b/files/assets/css/midnight_30409f.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_38a169.css b/files/assets/css/midnight_38a169.css
index afa1d0358..c54073017 100644
--- a/files/assets/css/midnight_38a169.css
+++ b/files/assets/css/midnight_38a169.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_3e98a7.css b/files/assets/css/midnight_3e98a7.css
index e16cdd0dd..0636d728f 100644
--- a/files/assets/css/midnight_3e98a7.css
+++ b/files/assets/css/midnight_3e98a7.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_62ca56.css b/files/assets/css/midnight_62ca56.css
index e857cad00..0fd4926dc 100644
--- a/files/assets/css/midnight_62ca56.css
+++ b/files/assets/css/midnight_62ca56.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_7b9ae4.css b/files/assets/css/midnight_7b9ae4.css
index ae0f4457b..d6f68b878 100644
--- a/files/assets/css/midnight_7b9ae4.css
+++ b/files/assets/css/midnight_7b9ae4.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_7f8fa6.css b/files/assets/css/midnight_7f8fa6.css
index b8979f41e..a9355893e 100644
--- a/files/assets/css/midnight_7f8fa6.css
+++ b/files/assets/css/midnight_7f8fa6.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_805ad5.css b/files/assets/css/midnight_805ad5.css
index 7ad527dcc..2140c2efa 100644
--- a/files/assets/css/midnight_805ad5.css
+++ b/files/assets/css/midnight_805ad5.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_80ffff.css b/files/assets/css/midnight_80ffff.css
index f97068e60..3c56e449f 100644
--- a/files/assets/css/midnight_80ffff.css
+++ b/files/assets/css/midnight_80ffff.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_e4432d.css b/files/assets/css/midnight_e4432d.css
index 7fcaed5d3..a4499c7e2 100644
--- a/files/assets/css/midnight_e4432d.css
+++ b/files/assets/css/midnight_e4432d.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_eb4963.css b/files/assets/css/midnight_eb4963.css
index 90681bd25..449a572af 100644
--- a/files/assets/css/midnight_eb4963.css
+++ b/files/assets/css/midnight_eb4963.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_ec72de.css b/files/assets/css/midnight_ec72de.css
index 6bd374f18..9c558be0f 100644
--- a/files/assets/css/midnight_ec72de.css
+++ b/files/assets/css/midnight_ec72de.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_f39731.css b/files/assets/css/midnight_f39731.css
index 56ddda86f..fe07ad21e 100644
--- a/files/assets/css/midnight_f39731.css
+++ b/files/assets/css/midnight_f39731.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_f8db58.css b/files/assets/css/midnight_f8db58.css
index dc1698104..3927b740f 100644
--- a/files/assets/css/midnight_f8db58.css
+++ b/files/assets/css/midnight_f8db58.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_ff0000.css b/files/assets/css/midnight_ff0000.css
index 8fa9663ec..fb79a6bec 100644
--- a/files/assets/css/midnight_ff0000.css
+++ b/files/assets/css/midnight_ff0000.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/midnight_ff66ac.css b/files/assets/css/midnight_ff66ac.css
index 38200397a..8b3ec0333 100644
--- a/files/assets/css/midnight_ff66ac.css
+++ b/files/assets/css/midnight_ff66ac.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent.scss b/files/assets/css/transparent.scss
index f445b0566..5c52bf2c5 100644
--- a/files/assets/css/transparent.scss
+++ b/files/assets/css/transparent.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #383838;
diff --git a/files/assets/css/transparent_2a96f3.css b/files/assets/css/transparent_2a96f3.css
index 876093a6c..0f67b3838 100644
--- a/files/assets/css/transparent_2a96f3.css
+++ b/files/assets/css/transparent_2a96f3.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_30409f.css b/files/assets/css/transparent_30409f.css
index 90cd463aa..69ce7c40e 100644
--- a/files/assets/css/transparent_30409f.css
+++ b/files/assets/css/transparent_30409f.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_38a169.css b/files/assets/css/transparent_38a169.css
index a8098a903..360e6d914 100644
--- a/files/assets/css/transparent_38a169.css
+++ b/files/assets/css/transparent_38a169.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_3e98a7.css b/files/assets/css/transparent_3e98a7.css
index 3cb4ef20d..ff8cc8b57 100644
--- a/files/assets/css/transparent_3e98a7.css
+++ b/files/assets/css/transparent_3e98a7.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_62ca56.css b/files/assets/css/transparent_62ca56.css
index 2ab01de46..8dd266415 100644
--- a/files/assets/css/transparent_62ca56.css
+++ b/files/assets/css/transparent_62ca56.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_7b9ae4.css b/files/assets/css/transparent_7b9ae4.css
index d5eae8135..96a18aa96 100644
--- a/files/assets/css/transparent_7b9ae4.css
+++ b/files/assets/css/transparent_7b9ae4.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_7f8fa6.css b/files/assets/css/transparent_7f8fa6.css
index 126922157..77160206d 100644
--- a/files/assets/css/transparent_7f8fa6.css
+++ b/files/assets/css/transparent_7f8fa6.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_805ad5.css b/files/assets/css/transparent_805ad5.css
index 7e79cdcae..d4191f41c 100644
--- a/files/assets/css/transparent_805ad5.css
+++ b/files/assets/css/transparent_805ad5.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_80ffff.css b/files/assets/css/transparent_80ffff.css
index 2f9ada39e..173700153 100644
--- a/files/assets/css/transparent_80ffff.css
+++ b/files/assets/css/transparent_80ffff.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_e4432d.css b/files/assets/css/transparent_e4432d.css
index 4d8dc275c..b57acc028 100644
--- a/files/assets/css/transparent_e4432d.css
+++ b/files/assets/css/transparent_e4432d.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_eb4963.css b/files/assets/css/transparent_eb4963.css
index 60a725678..8e6bd04fb 100644
--- a/files/assets/css/transparent_eb4963.css
+++ b/files/assets/css/transparent_eb4963.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_ec72de.css b/files/assets/css/transparent_ec72de.css
index 4bb673599..57635d990 100644
--- a/files/assets/css/transparent_ec72de.css
+++ b/files/assets/css/transparent_ec72de.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_f39731.css b/files/assets/css/transparent_f39731.css
index 098ab6ed8..041d9639a 100644
--- a/files/assets/css/transparent_f39731.css
+++ b/files/assets/css/transparent_f39731.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_f8db58.css b/files/assets/css/transparent_f8db58.css
index 373bf44e3..f6182a4e1 100644
--- a/files/assets/css/transparent_f8db58.css
+++ b/files/assets/css/transparent_f8db58.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_ff0000.css b/files/assets/css/transparent_ff0000.css
index ecbe8cf73..d82efcdc1 100644
--- a/files/assets/css/transparent_ff0000.css
+++ b/files/assets/css/transparent_ff0000.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/transparent_ff66ac.css b/files/assets/css/transparent_ff66ac.css
index 9a0c646f6..068c9cf1a 100644
--- a/files/assets/css/transparent_ff66ac.css
+++ b/files/assets/css/transparent_ff66ac.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron.scss b/files/assets/css/tron.scss
index 5af8b4204..cbd101d55 100644
--- a/files/assets/css/tron.scss
+++ b/files/assets/css/tron.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #00001f;
diff --git a/files/assets/css/tron_2a96f3.css b/files/assets/css/tron_2a96f3.css
index 0329f1c07..79bb432e5 100644
--- a/files/assets/css/tron_2a96f3.css
+++ b/files/assets/css/tron_2a96f3.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_30409f.css b/files/assets/css/tron_30409f.css
index 2366da5c0..cb6da5f4a 100644
--- a/files/assets/css/tron_30409f.css
+++ b/files/assets/css/tron_30409f.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_38a169.css b/files/assets/css/tron_38a169.css
index ae29f412b..f1af61733 100644
--- a/files/assets/css/tron_38a169.css
+++ b/files/assets/css/tron_38a169.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_3e98a7.css b/files/assets/css/tron_3e98a7.css
index 59c72df44..cab1062c3 100644
--- a/files/assets/css/tron_3e98a7.css
+++ b/files/assets/css/tron_3e98a7.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_62ca56.css b/files/assets/css/tron_62ca56.css
index d50a02e5e..d72f6375e 100644
--- a/files/assets/css/tron_62ca56.css
+++ b/files/assets/css/tron_62ca56.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_7b9ae4.css b/files/assets/css/tron_7b9ae4.css
index 38004547c..500102b6e 100644
--- a/files/assets/css/tron_7b9ae4.css
+++ b/files/assets/css/tron_7b9ae4.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_7f8fa6.css b/files/assets/css/tron_7f8fa6.css
index 20c794a7a..23b7332d8 100644
--- a/files/assets/css/tron_7f8fa6.css
+++ b/files/assets/css/tron_7f8fa6.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_805ad5.css b/files/assets/css/tron_805ad5.css
index 8eb024151..2e239c59b 100644
--- a/files/assets/css/tron_805ad5.css
+++ b/files/assets/css/tron_805ad5.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_80ffff.css b/files/assets/css/tron_80ffff.css
index 465800d07..32be8a36e 100644
--- a/files/assets/css/tron_80ffff.css
+++ b/files/assets/css/tron_80ffff.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_e4432d.css b/files/assets/css/tron_e4432d.css
index af6360039..f400d9ff6 100644
--- a/files/assets/css/tron_e4432d.css
+++ b/files/assets/css/tron_e4432d.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_eb4963.css b/files/assets/css/tron_eb4963.css
index 2ab6f1578..c90e75642 100644
--- a/files/assets/css/tron_eb4963.css
+++ b/files/assets/css/tron_eb4963.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_ec72de.css b/files/assets/css/tron_ec72de.css
index 547110e12..0cc490794 100644
--- a/files/assets/css/tron_ec72de.css
+++ b/files/assets/css/tron_ec72de.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_f39731.css b/files/assets/css/tron_f39731.css
index 256ce216e..6c20322cc 100644
--- a/files/assets/css/tron_f39731.css
+++ b/files/assets/css/tron_f39731.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_f8db58.css b/files/assets/css/tron_f8db58.css
index 0230babc4..cd0094eba 100644
--- a/files/assets/css/tron_f8db58.css
+++ b/files/assets/css/tron_f8db58.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_ff0000.css b/files/assets/css/tron_ff0000.css
index e8ea7a35d..c827cb146 100644
--- a/files/assets/css/tron_ff0000.css
+++ b/files/assets/css/tron_ff0000.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/tron_ff66ac.css b/files/assets/css/tron_ff66ac.css
index 5a4aed5b5..95f7fb87b 100644
--- a/files/assets/css/tron_ff66ac.css
+++ b/files/assets/css/tron_ff66ac.css
@@ -24810,7 +24810,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98.scss b/files/assets/css/win98.scss
index c265bceb6..baf012525 100644
--- a/files/assets/css/win98.scss
+++ b/files/assets/css/win98.scss
@@ -1,4 +1,3 @@
-// Colors
 
 $primary: #ff66ac;
 $dark: #fff;
diff --git a/files/assets/css/win98_2a96f3.css b/files/assets/css/win98_2a96f3.css
index d1575d825..8ed361366 100644
--- a/files/assets/css/win98_2a96f3.css
+++ b/files/assets/css/win98_2a96f3.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_30409f.css b/files/assets/css/win98_30409f.css
index 039b377e1..bd15ce6ac 100644
--- a/files/assets/css/win98_30409f.css
+++ b/files/assets/css/win98_30409f.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_38a169.css b/files/assets/css/win98_38a169.css
index ddc3ee7b4..474a5e633 100644
--- a/files/assets/css/win98_38a169.css
+++ b/files/assets/css/win98_38a169.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_3e98a7.css b/files/assets/css/win98_3e98a7.css
index 972c70e6d..cb8c56c76 100644
--- a/files/assets/css/win98_3e98a7.css
+++ b/files/assets/css/win98_3e98a7.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_62ca56.css b/files/assets/css/win98_62ca56.css
index b97bc05c6..f80a13739 100644
--- a/files/assets/css/win98_62ca56.css
+++ b/files/assets/css/win98_62ca56.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_7b9ae4.css b/files/assets/css/win98_7b9ae4.css
index 18d52ad96..c37aeeef7 100644
--- a/files/assets/css/win98_7b9ae4.css
+++ b/files/assets/css/win98_7b9ae4.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_7f8fa6.css b/files/assets/css/win98_7f8fa6.css
index 8e11b0802..84ae414cb 100644
--- a/files/assets/css/win98_7f8fa6.css
+++ b/files/assets/css/win98_7f8fa6.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_805ad5.css b/files/assets/css/win98_805ad5.css
index fcdaca3ae..74f0694d3 100644
--- a/files/assets/css/win98_805ad5.css
+++ b/files/assets/css/win98_805ad5.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_80ffff.css b/files/assets/css/win98_80ffff.css
index 42d253308..54fe7e2ad 100644
--- a/files/assets/css/win98_80ffff.css
+++ b/files/assets/css/win98_80ffff.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_e4432d.css b/files/assets/css/win98_e4432d.css
index 600050588..ce59e1349 100644
--- a/files/assets/css/win98_e4432d.css
+++ b/files/assets/css/win98_e4432d.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_eb4963.css b/files/assets/css/win98_eb4963.css
index 5aa71d5eb..29acd5f22 100644
--- a/files/assets/css/win98_eb4963.css
+++ b/files/assets/css/win98_eb4963.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_ec72de.css b/files/assets/css/win98_ec72de.css
index 2eee8eef3..0b5cc2651 100644
--- a/files/assets/css/win98_ec72de.css
+++ b/files/assets/css/win98_ec72de.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_f39731.css b/files/assets/css/win98_f39731.css
index 3e2acfb8b..dc803f60c 100644
--- a/files/assets/css/win98_f39731.css
+++ b/files/assets/css/win98_f39731.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_f8db58.css b/files/assets/css/win98_f8db58.css
index e5b7cc7ee..94b6dc8e4 100644
--- a/files/assets/css/win98_f8db58.css
+++ b/files/assets/css/win98_f8db58.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_ff0000.css b/files/assets/css/win98_ff0000.css
index dda1534d1..57e4274e4 100644
--- a/files/assets/css/win98_ff0000.css
+++ b/files/assets/css/win98_ff0000.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/css/win98_ff66ac.css b/files/assets/css/win98_ff66ac.css
index deb9fcba6..2446476b1 100644
--- a/files/assets/css/win98_ff66ac.css
+++ b/files/assets/css/win98_ff66ac.css
@@ -24809,7 +24809,6 @@ a.bg-dark:hover, a.bg-dark:focus, button.bg-dark:hover, button.bg-dark:focus {
 	border: 0.1px solid $border-color;
 	border-radius: $border-radius;
 	margin-top: 1rem;
-	//box-shadow: $box-shadow-sm;
 }
 
 #frontpage.toggle-card-view .posts .card:last-of-type, #userpage.toggle-card-view .posts .card:last-of-type, #search.toggle-card-view .posts .card:last-of-type {
diff --git a/files/assets/js/award_modal.js b/files/assets/js/award_modal.js
new file mode 100644
index 000000000..02cb94a32
--- /dev/null
+++ b/files/assets/js/award_modal.js
@@ -0,0 +1,143 @@
+function post_vote(url, callback) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+    xhr.send(form);
+}
+
+var upvote = function(event) {
+
+    var type = event.target.dataset.bsContentType;
+    var id = event.target.dataset.bsIdUp;
+
+    var downvoteButton = document.getElementsByClassName(type + '-' + id + '-down');
+    var upvoteButton = document.getElementsByClassName(type + '-' + id + '-up');
+    var scoreText = document.getElementsByClassName(type + '-score-' + id);
+
+    for (var j = 0; j < upvoteButton.length && j < downvoteButton.length && j < scoreText.length; j++) {
+
+        var thisUpvoteButton = upvoteButton[j];
+        var thisDownvoteButton = downvoteButton[j];
+        var thisScoreText = scoreText[j];
+        var thisScore = Number(thisScoreText.textContent);
+
+        if (thisUpvoteButton.classList.contains('active')) {
+            thisUpvoteButton.classList.remove('active')
+            thisScoreText.textContent = thisScore - 1
+            voteDirection = "0"
+        } else if (thisDownvoteButton.classList.contains('active')) {
+            thisUpvoteButton.classList.add('active')
+            thisDownvoteButton.classList.remove('active')
+            thisScoreText.textContent = thisScore + 2
+            voteDirection = "1"
+        } else {
+            thisUpvoteButton.classList.add('active')
+            thisScoreText.textContent = thisScore + 1
+            voteDirection = "1"
+        }
+
+        if (thisUpvoteButton.classList.contains('active')) {
+            thisScoreText.classList.add('score-up')
+            thisScoreText.classList.remove('score-down')
+            thisScoreText.classList.remove('score')
+        } else if (thisDownvoteButton.classList.contains('active')) {
+            thisScoreText.classList.add('score-down')
+            thisScoreText.classList.remove('score-up')
+            thisScoreText.classList.remove('score')
+        } else {
+            thisScoreText.classList.add('score')
+            thisScoreText.classList.remove('score-up')
+            thisScoreText.classList.remove('score-down')
+        }
+    }
+
+    post_vote("/vote/" + type + "/" + id + "/" + voteDirection);
+}
+
+var downvote = function(event) {
+
+    var type = event.target.dataset.bsContentType;
+    var id = event.target.dataset.bsIdDown;
+
+    var downvoteButton = document.getElementsByClassName(type + '-' + id + '-down');
+    var upvoteButton = document.getElementsByClassName(type + '-' + id + '-up');
+    var scoreText = document.getElementsByClassName(type + '-score-' + id);
+
+    for (var j = 0; j < upvoteButton.length && j < downvoteButton.length && j < scoreText.length; j++) {
+
+        var thisUpvoteButton = upvoteButton[j];
+        var thisDownvoteButton = downvoteButton[j];
+        var thisScoreText = scoreText[j];
+        var thisScore = Number(thisScoreText.textContent);
+
+        if (thisDownvoteButton.classList.contains('active')) {
+            thisDownvoteButton.classList.remove('active')
+            thisScoreText.textContent = thisScore + 1
+            voteDirection = "0"
+        } else if (thisUpvoteButton.classList.contains('active')) {
+            thisDownvoteButton.classList.add('active')
+            thisUpvoteButton.classList.remove('active')
+            thisScoreText.textContent = thisScore - 2
+            voteDirection = "-1"
+        } else {
+            thisDownvoteButton.classList.add('active')
+            thisScoreText.textContent = thisScore - 1
+            voteDirection = "-1"
+        }
+
+        if (thisUpvoteButton.classList.contains('active')) {
+            thisScoreText.classList.add('score-up')
+            thisScoreText.classList.remove('score-down')
+            thisScoreText.classList.remove('score')
+        } else if (thisDownvoteButton.classList.contains('active')) {
+            thisScoreText.classList.add('score-down')
+            thisScoreText.classList.remove('score-up')
+            thisScoreText.classList.remove('score')
+        } else {
+            thisScoreText.classList.add('score')
+            thisScoreText.classList.remove('score-up')
+            thisScoreText.classList.remove('score-down')
+        }
+    }
+
+    post_vote("/vote/" + type + "/" + id + "/" + voteDirection);
+}
+
+
+var upvoteButtons = document.getElementsByClassName('upvote-button')
+
+var downvoteButtons = document.getElementsByClassName('downvote-button')
+
+var voteDirection = 0
+
+for (var i = 0; i < upvoteButtons.length; i++) {
+    upvoteButtons[i].addEventListener('click', upvote, false);
+    upvoteButtons[i].addEventListener('keydown', function(event) {
+        if (event.keyCode === 13) {
+            upvote(event)
+        }
+    }, false)
+};
+
+for (var i = 0; i < downvoteButtons.length; i++) {
+    downvoteButtons[i].addEventListener('click', downvote, false);
+    downvoteButtons[i].addEventListener('keydown', function(event) {
+        if (event.keyCode === 13) {
+            downvote(event)
+        }
+    }, false)
+};
+
+function awardModal(link) {
+    var target = document.getElementById("awardTarget");
+    target.action = link;
+}
+
+function bruh(kind) {
+    document.getElementById('giveaward').disabled=false;
+    document.getElementById('kind').value=kind;
+    try {document.getElementsByClassName('picked')[0].classList.toggle('picked');} catch(e) {}
+    document.getElementById(kind).classList.toggle('picked')
+}
\ No newline at end of file
diff --git a/files/assets/js/changelog.js b/files/assets/js/changelog.js
new file mode 100644
index 000000000..eeb32e87d
--- /dev/null
+++ b/files/assets/js/changelog.js
@@ -0,0 +1,52 @@
+function post_toast2(url, button1, button2) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+
+    if(typeof data === 'object' && data !== null) {
+        for(let k of Object.keys(data)) {
+                form.append(k, data[k]);
+        }
+    }
+
+
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+
+    xhr.onload = function() {
+        if (xhr.status >= 200 && xhr.status < 300) {
+            try {
+                document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
+            } catch(e) {
+                document.getElementById('toast-post-success-text').innerText = "Action successful!";
+            }
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+            return true
+
+        } else if (xhr.status >= 300 && xhr.status < 400) {
+            window.location.href = JSON.parse(xhr.response)["redirect"]
+        } else {
+            try {
+                data=JSON.parse(xhr.response);
+
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+                myToast.show();
+                document.getElementById('toast-post-error-text').innerText = data["error"];
+                return false
+            } catch(e) {
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+                myToast.hide();
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+                myToast.show();
+                document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
+                return false
+            }
+        }
+    };
+
+    xhr.send(form);
+
+    document.getElementById(button1).classList.toggle("d-none");
+    document.getElementById(button2).classList.toggle("d-none");
+}
\ No newline at end of file
diff --git a/files/assets/js/comments_admin.js b/files/assets/js/comments_admin.js
new file mode 100644
index 000000000..d70abbeda
--- /dev/null
+++ b/files/assets/js/comments_admin.js
@@ -0,0 +1,83 @@
+function removeComment(post_id,button1,button2) {
+    url="/ban_comment/"+post_id
+
+    callback=function(){
+
+        try {
+            document.getElementById("comment-"+post_id+"-only").classList.add("banned");
+        } catch(e) {
+            document.getElementById("context").classList.add("banned");
+        }
+
+        button=document.getElementById("remove-"+post_id);
+        button.onclick=function(){approveComment(post_id)};
+        button.innerHTML='<i class="fas fa-clipboard-check"></i>Approve'
+    }
+    post(url, callback, "Comment has been removed.")
+
+    if (typeof button1 !== 'undefined') {
+        document.getElementById(button1).classList.toggle("d-md-inline-block");
+        document.getElementById(button2).classList.toggle("d-md-inline-block");
+    }
+};
+
+function approveComment(post_id,button1,button2) {
+    url="/unban_comment/"+post_id
+
+    callback=function(){
+        try {
+            document.getElementById("comment-"+post_id+"-only").classList.remove("banned");
+        } catch(e) {
+            document.getElementById("context").classList.remove("banned");
+        }
+
+        button=document.getElementById("remove-"+post_id);
+        button.onclick=function(){removeComment(post_id)};
+        button.innerHTML='<i class="fas fa-trash-alt"></i>Remove'
+    }
+
+    post(url, callback, "Comment has been approved.")
+
+    if (typeof button1 !== 'undefined') {
+        document.getElementById(button1).classList.toggle("d-md-inline-block");
+        document.getElementById(button2).classList.toggle("d-md-inline-block");
+    }
+}
+
+
+function removeComment2(post_id,button1,button2) {
+    url="/ban_comment/"+post_id
+
+    callback=function(){
+        document.getElementById("comment-"+post_id+"-only").classList.add("banned");
+
+        button=document.getElementById("remove-"+post_id);
+        button.onclick=function(){approveComment(post_id)};
+        button.innerHTML='<i class="fas fa-clipboard-check"></i>Approve'
+    }
+    post(url, callback, "Comment has been removed.")
+
+    if (typeof button1 !== 'undefined') {
+        document.getElementById(button1).classList.toggle("d-none");
+        document.getElementById(button2).classList.toggle("d-none");
+    }
+};
+
+function approveComment2(post_id,button1,button2) {
+    url="/unban_comment/"+post_id
+
+    callback=function(){
+        document.getElementById("comment-"+post_id+"-only").classList.remove("banned");
+
+        button=document.getElementById("remove-"+post_id);
+        button.onclick=function(){removeComment(post_id)};
+        button.innerHTML='<i class="fas fa-trash-alt"></i>Remove'
+    }
+
+    post(url, callback, "Comment has been approved.")
+
+    if (typeof button1 !== 'undefined') {
+        document.getElementById(button1).classList.toggle("d-none");
+        document.getElementById(button2).classList.toggle("d-none");
+    }
+}
\ No newline at end of file
diff --git a/files/assets/js/comments_v.js b/files/assets/js/comments_v.js
new file mode 100644
index 000000000..65c54434c
--- /dev/null
+++ b/files/assets/js/comments_v.js
@@ -0,0 +1,287 @@
+function post(url, callback, errortext) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+    xhr.onerror=function() { alert(errortext); };
+    xhr.onload = function() {
+        if (xhr.status >= 200 && xhr.status < 300) {
+            callback();
+        } else {
+            xhr.onerror();
+        }
+    };
+    xhr.send(form);
+};
+
+function post_toast3(url, button1, button2) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+
+    if(typeof data === 'object' && data !== null) {
+        for(let k of Object.keys(data)) {
+                form.append(k, data[k]);
+        }
+    }
+
+
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+
+    xhr.onload = function() {
+        if (xhr.status >= 200 && xhr.status < 300) {
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+            try {
+                document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
+            } catch(e) {
+                document.getElementById('toast-post-success-text').innerText = "Action successful!";
+            }
+            return true
+
+        } else if (xhr.status >= 300 && xhr.status < 400) {
+            window.location.href = JSON.parse(xhr.response)["redirect"]
+        } else {
+
+            try {
+                data=JSON.parse(xhr.response);
+            } catch(e) {}
+
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.show();
+            document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
+            return false
+        }
+    };
+
+    xhr.send(form);
+
+    document.getElementById(button1).classList.toggle("d-md-inline-block");
+    document.getElementById(button2).classList.toggle("d-md-inline-block");
+}
+
+report_commentModal = function(id, author) {
+
+document.getElementById("comment-author").textContent = author;
+
+document.getElementById("reportCommentButton").onclick = function() {
+
+    this.innerHTML='<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span>Reporting comment';
+    this.disabled = true;
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", '/flag/comment/'+id, true);
+    var form = new FormData()
+    form.append("formkey", formkey());
+    form.append("reason", document.getElementById("reason-comment").value);
+
+    xhr.withCredentials=true;
+
+    xhr.onload=function() {
+        document.getElementById("reportCommentFormBefore").classList.add('d-none');
+        document.getElementById("reportCommentFormAfter").classList.remove('d-none');
+    };
+
+    xhr.onerror=function(){alert(errortext)};
+    xhr.send(form);
+}
+
+};
+
+document.getElementById('reportCommentModal').addEventListener('hidden.bs.modal', function () {
+
+var button = document.getElementById("reportCommentButton");
+
+var beforeModal = document.getElementById("reportCommentFormBefore");
+var afterModal = document.getElementById("reportCommentFormAfter");
+
+button.innerHTML='Report comment';
+button.disabled= false;
+afterModal.classList.add('d-none');
+
+if ( beforeModal.classList.contains('d-none') ) {
+    beforeModal.classList.remove('d-none');
+}
+
+});
+
+function openReplyBox(id) {
+    const element = document.getElementById(`reply-to-${id}`);
+    element.classList.remove('d-none')
+
+    element.getElementsByTagName('textarea')[0].focus()
+}
+
+toggleEdit=function(id){
+    comment=document.getElementById("comment-text-"+id);
+    form=document.getElementById("comment-edit-"+id);
+    box=document.getElementById('comment-edit-body-'+id);
+    actions = document.getElementById('comment-' + id +'-actions');
+
+    comment.classList.toggle("d-none");
+    form.classList.toggle("d-none");
+    actions.classList.toggle("d-none");
+    autoExpand(box);
+};
+
+
+function delete_commentModal(id) {
+
+    document.getElementById("deleteCommentButton").onclick = function() {	
+
+        this.innerHTML='<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span>Deleting comment';	
+        this.disabled = true; 
+        post('/delete/comment/' + id,
+            callback = function() {
+
+                location.reload();
+            }
+            )
+    }
+
+};
+
+
+post_comment=function(fullname){
+
+
+    var form = new FormData();
+
+    form.append('formkey', formkey());
+    form.append('parent_fullname', fullname);
+    form.append('submission', document.getElementById('reply-form-submission-'+fullname).value);
+    form.append('body', document.getElementById('reply-form-body-'+fullname).value);
+    form.append('file', document.getElementById('file-upload-reply-'+fullname).files[0]);
+    var xhr = new XMLHttpRequest();
+    xhr.open("post", "/comment");
+    xhr.withCredentials=true;
+    xhr.onload=function(){
+        if (xhr.status==200) {
+            commentForm=document.getElementById('comment-form-space-'+fullname);
+            commentForm.innerHTML=JSON.parse(xhr.response)["html"];
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+        }
+        else {
+            var commentError = document.getElementById("comment-error-text");
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.show();
+            commentError.textContent = JSON.parse(xhr.response)["error"];
+        }
+    }
+    xhr.send(form)
+
+    document.getElementById('save-reply-to-'+fullname).classList.add('disabled');
+
+}
+
+post_reply=function(id){
+
+    var form = new FormData();
+
+    form.append('formkey', formkey());
+    form.append('parent_id', id);
+    form.append('body', document.getElementById('reply-form-body-'+id).value);
+    var xhr = new XMLHttpRequest();
+    xhr.open("post", "/reply");
+    xhr.withCredentials=true;
+    xhr.onload=function(){
+        if (xhr.status==200) {
+            commentForm=document.getElementById('comment-form-space-'+id);
+            commentForm.innerHTML=JSON.parse(xhr.response)["html"];
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+        }
+        else {
+            var commentError = document.getElementById("comment-error-text");
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.show();
+        }
+    }
+    xhr.send(form)
+
+    document.getElementById('save-reply-to-'+id).classList.add('disabled');
+
+}
+
+comment_edit=function(id){
+
+    var commentError = document.getElementById("comment-error-text");
+
+    var form = new FormData();
+
+    form.append('formkey', formkey());
+    form.append('body', document.getElementById('comment-edit-body-'+id).value);
+    form.append('file', document.getElementById('file-edit-reply-'+id).files[0]);
+
+    var xhr = new XMLHttpRequest();
+    xhr.open("post", "/edit_comment/"+id);
+    xhr.withCredentials=true;
+    xhr.onload=function(){
+        if (xhr.status==200) {
+            commentForm=document.getElementById('comment-text-'+id);
+            commentForm.innerHTML=JSON.parse(xhr.response)["html"];
+            document.getElementById('cancel-edit-'+id).click()
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+        }
+        else {
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.show();
+            commentError.textContent = JSON.parse(xhr.response)["error"];
+        }
+    }
+    xhr.send(form)
+
+    }
+
+post_comment=function(fullname){
+
+    var form = new FormData();
+
+    form.append('formkey', formkey());
+    form.append('parent_fullname', fullname);
+    form.append('submission', document.getElementById('reply-form-submission-'+fullname).value);
+    form.append('body', document.getElementById('reply-form-body-'+fullname).value);
+    form.append('file', document.getElementById('file-upload-reply-'+fullname).files[0]);
+    var xhr = new XMLHttpRequest();
+    xhr.open("post", "/comment");
+    xhr.withCredentials=true;
+    xhr.onload=function(){
+        if (xhr.status==200) {
+            commentForm=document.getElementById('comment-form-space-'+fullname);
+            commentForm.innerHTML=JSON.parse(xhr.response)["html"];
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+        }
+        else {
+            var commentError = document.getElementById("comment-error-text");
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.hide();
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.show();
+            commentError.textContent = JSON.parse(xhr.response)["error"];
+        }
+    }
+    xhr.send(form)
+
+    document.getElementById('save-reply-to-'+fullname).classList.add('disabled');
+
+}
\ No newline at end of file
diff --git a/files/assets/js/default.js b/files/assets/js/default.js
new file mode 100644
index 000000000..8fac77c3f
--- /dev/null
+++ b/files/assets/js/default.js
@@ -0,0 +1,152 @@
+makeBold = function (form) {
+    var text = document.getElementById(form);
+    var startIndex = text.selectionStart,
+    endIndex = text.selectionEnd;
+    var selectedText = text.value.substring(startIndex, endIndex);
+
+    var format = '**'
+
+    if (selectedText.includes('**')) {
+        text.value = selectedText.replace(/\*/g, '');
+    }
+    else if (selectedText.length == 0) {
+        text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
+    }
+    else {
+        text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
+    }
+}
+
+makeItalics = function (form) {
+    var text = document.getElementById(form);
+    var startIndex = text.selectionStart,
+    endIndex = text.selectionEnd;
+    var selectedText = text.value.substring(startIndex, endIndex);
+
+    var format = '*'
+
+    if (selectedText.includes('*')) {
+        text.value = selectedText.replace(/\*/g, '');
+    }
+    else if (selectedText.length == 0) {
+        text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
+    }
+    else {
+        text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
+    }
+}
+
+makeQuote = function (form) {
+    var text = document.getElementById(form);
+    var startIndex = text.selectionStart,
+    endIndex = text.selectionEnd;
+    var selectedText = text.value.substring(startIndex, endIndex);
+
+    var format = '>'
+
+    if (selectedText.includes('>')) {
+        text.value = text.value.substring(0, startIndex) + selectedText.replace(/\>/g, '') + text.value.substring(endIndex);
+    }
+    else if (selectedText.length == 0) {
+        text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
+    }
+    else {
+        text.value = text.value.substring(0, startIndex) + format + selectedText + text.value.substring(endIndex);
+    }
+}
+
+function autoExpand (field) {
+
+                xpos=window.scrollX;
+    ypos=window.scrollY;
+
+                    field.style.height = 'inherit';
+
+                    var computed = window.getComputedStyle(field);
+
+                    var height = parseInt(computed.getPropertyValue('border-top-width'), 10)
+    + parseInt(computed.getPropertyValue('padding-top'), 10)
+    + field.scrollHeight
+    + parseInt(computed.getPropertyValue('padding-bottom'), 10)
+    + parseInt(computed.getPropertyValue('border-bottom-width'), 10)
+    + 32;
+
+    field.style.height = height + 'px';
+
+                window.scrollTo(xpos,ypos);
+
+};
+
+
+document.addEventListener('input', function (event) {
+    if (event.target.tagName.toLowerCase() !== 'textarea') return;
+    autoExpand(event.target);
+}, false);
+
+for(let el of document.getElementsByClassName('text-expand')) {
+    el.onclick = function(event){
+        if (event.which != 1) {
+            return
+        };
+        id=this.data('id');
+
+
+        document.getElementById('post-text-'+id).toggleClass('d-none');
+        document.getElementsByClassName('text-expand-icon-'+id)[0].toggleClass('fa-expand-alt');
+        document.getElementsByClassName('text-expand-icon-'+id)[0].toggleClass('fa-compress-alt');
+
+    }
+}
+
+function post_toast2(url, button1, button2) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+
+    if(typeof data === 'object' && data !== null) {
+        for(let k of Object.keys(data)) {
+                form.append(k, data[k]);
+        }
+    }
+
+
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+
+    xhr.onload = function() {
+        if (xhr.status >= 200 && xhr.status < 300) {
+            try {
+                document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
+            } catch(e) {
+                document.getElementById('toast-post-success-text').innerText = "Action successful!";
+            }
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+            return true
+
+        } else if (xhr.status >= 300 && xhr.status < 400) {
+            window.location.href = JSON.parse(xhr.response)["redirect"]
+        } else {
+            try {
+                data=JSON.parse(xhr.response);
+
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+                myToast.show();
+                document.getElementById('toast-post-error-text').innerText = data["error"];
+                return false
+            } catch(e) {
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+                myToast.hide();
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+                myToast.show();
+                document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
+                return false
+            }
+        }
+    };
+
+    xhr.send(form);
+
+    document.getElementById(button1).classList.toggle("d-none");
+    document.getElementById(button2).classList.toggle("d-none");
+}
\ No newline at end of file
diff --git a/files/assets/js/emoji_modal.js b/files/assets/js/emoji_modal.js
new file mode 100644
index 000000000..70d359245
--- /dev/null
+++ b/files/assets/js/emoji_modal.js
@@ -0,0 +1,105 @@
+var commentFormID;
+function commentForm(form) {
+        commentFormID = form;
+};
+
+const TEXTAREA_POS_ATTR = 'data-curr-pos'
+
+function getEmoji(searchTerm, form) {
+    const commentBox = document.getElementById(form);
+    const old = commentBox.value;
+    const curPos = parseInt(commentBox.getAttribute(TEXTAREA_POS_ATTR));
+
+    const firstHalf = old.slice(0, curPos)
+    const lastHalf = old.slice(curPos)
+
+    let emoji = ':' + searchTerm + ':'
+    const previousChar = firstHalf.slice(-1)
+    if (firstHalf.length > 0 && previousChar !== " " && previousChar !== "\n") {
+        emoji = " " + emoji
+    }
+    if (lastHalf.length > 0 && lastHalf[0] !== " ") {
+        emoji = emoji + " "
+    }
+
+    commentBox.value = firstHalf + emoji + lastHalf;
+
+    const newPos = curPos + emoji.length
+
+    commentBox.setAttribute(TEXTAREA_POS_ATTR, newPos);
+}
+
+function loadEmojis(form) {
+
+    const emojis = [
+    {
+        type:'marsey',
+        emojis: ['marseywhirlyhat','marsey173','marseycthulhu','marseycuck','marseyemperor','marseyface','marseyjohnson','marseykneel','marseymummy','marseymummy2','marseypanda','marseypumpkin','marseyskeletor','marseystein','marseyvampire','marseyvengeance','marseywitch3','marseylong1','marseylong2','marseylong3','marseypop','marseyqueenlizard','marseyagree','marseybane','marseybog','marseybux','marseycommitted','marseydisagree','marseydizzy','marseyfunko','marseyhealthy','marseykaiser','marseykyle','marseymask','marseymeds','marseykvlt','marseyn8','marseynietzsche','marseyobey','marseypatriot','marseypedo','marseypony','marseypuke','marseyqueen','marseyrage','marseysnek','marseytinfoil','marseywitch2','marseycenter','marseyauthleft','marseyauthright','marseylibleft','marseylibright','marseybinladen','marseycool','marseyjanny2','marseyjones','marseynapoleon','marseysanders','marseyshrug','marseysnoo','marseysoypoint','marseybiting','marseyblush','marseybountyhunter','marseycoonass','marseyfinger','marseyglancing','marseyhappy','marseyhearts','marseyluther','marseypizzashill','marseypokerface','marseypopcorn','marseyrasta','marseysad2','marseysmirk','marseysurprised','marseythomas','marseywitch','marseyyawn','marcusfootball','marje','marmsey','marsey1984','marsey420','marsey4chan','marsey69','marseyakshually','marseyandmarcus','marseyangel','marseyasian','marseybattered','marseybiden','marseybingus','marseyblm','marseyblowkiss','marseybluecheck','marseybong','marseybooba','marseyboomer','marseybrainlet','marseybride','marseyburger','marseybush','marseycamus','marseycanned','marseycarp','marseycatgirl','marseychef','marseychonker','marseychu','marseyclown','marseycomrade','marseyconfused','marseycoomer','marseycop','marseycope','marseycorn','marseycowboy','marseycry','marseycumjar1','marseycumjar2','marseycumjar3','marseycwc','marseydead','marseydepressed','marseydespair','marseydeux','marseydildo','marseydoomer','marseydrunk','marseydynamite','marseyexcited','marseyeyeroll','marseyfacepalm','marseyfamily','marseyfbi','marseyfeet','marseyfeminist','marseyflamethrower','marseyflamewar','marseyfloyd','marseyfug','marseygasp','marseyghost','marseygift','marseygigaretard','marseygigavaxxer','marseyglam','marseyglow','marseygodfather','marseygoodnight','marseygrass','marseygrilling','marseyhacker','marseyhmm','marseyhmmm','marseyilluminati','marseyinabox','marseyira','marseyisis','marseyjam','marseyjamming','marseyjanny','marseyjunkie','marseyking','marseykkk','marseylaugh','marseylawlz','marseylifting','marseylizard','marseylolcow','marseylove','marseymad','marseymanlet','marseymaoist','marseymcarthur','marseymerchant','marseymermaid','marseymommy','marseymouse','marseymyeisha','marseyneckbeard','marseyniqab','marseynpc','marseynun','marseynut','marseyorthodox','marseyowow','marseypainter','marseypanties','marseyparty','marseypat','marseypeacekeeper','marseypharaoh','marseypickle','marseypinochet','marseypipe','marseypirate','marseypoggers','marseypope','marseyproctologist','marseypsycho','marseyqoomer','marseyradioactive','marseyrain','marseyrat','marseyreading','marseyready','marseyrealwork','marseyreich','marseyrentfree','marseyretard','marseyrick','marseyrope','marseyrowling','marseysad','marseysadcat','marseyscarf','marseyschizo','marseyseethe','marseyshisha','marseyshook','marseysick','marseysleep','marseysmug','marseysneed','marseysociety','marseyspider','marseysrdine','marseystroke','marseysus','marseytaliban','marseytank','marseytankushanka','marseytea','marseythonk','marseythumbsup','marseytrain','marseysipping','marseytrans','marseytrans2','marseytroll','marseytrump','marseytwerking','marseyunabomber','marseyuwuw','marseyvan','marseyvaxmaxx','marseywave','marseyworried','marseyxd','marseyyeezus','marseyzoomer','marseyzwei','marsoy','marsoyhype']
+    },
+    {
+        type:'platy',
+        emojis: ['platyabused','platyblizzard','platyboxer','platydevil','platyfear','platygirlmagic','platygolong','platyhaes','platyking','platylove','platyneet','platyold','platypatience','platypopcorn','platyrich','platysarcasm','platysilly','platysleeping','platythink','platytired','platytuxedomask','platyblush','platybruh','platycaveman','platycheer','platydown','platyeyes','platyheart','platylol','platymicdrop','platynooo','platysalute','platyseethe','platythumbsup','platywave']
+    },
+    {
+        type:'tay',
+        emojis: ['tayaaa','tayadmire','taycat','taycelebrate','taychefkiss','taychristmas','tayclap','taycold','taycrown','tayflex','tayflirt','taygrimacing','tayhappy','tayheart','tayhmm','tayhuh','tayhyperdab','tayjammin','taylaugh','taymindblown','tayno','taynod','taypeace','taypray','tayrun','tayscrunch','tayshake','tayshrug','taysilly','tayslide','taysmart','taystop','taytantrum','taytea','taythink','tayvibin','taywhat','taywine','taywine2','taywink','tayyes']
+    },
+    {
+        type:'classic',
+        emojis: ['2thumbsup','aliendj','ambulance','angry','angrywhip','argue','aroused','ashamed','badass','banana','band','banghead','batman','bigeyes','bite','blind','blowkiss','blush','bong','bounce','bow','breakheart','bs','cartwheel','cat','celebrate','chainsaw','cheers','clap','cold','confused','crazyeyes','cry','cthulhu','cute','D','daydream','ddr','deadpool','devilsmile','diddle','die','distress','disturbing','dizzy','domo','doughboy','drink','drool','dudeweedlmao','edward','electro','elephant','embarrassed','emo','emo2','evil','evilclown','evilgrin','facepalm','fap','flamethrower','flipbird','flirt','frown','gasp','glomp','go','gooby','grr','gtfo','guitar','haha','handshake','happydance','headbang','heart','heartbeat','hearts','highfive','hmm','hmph','holdhands','horny','hug','hugging','hugs','hump','humpbed','hysterical','ily','inlove','jason','jawdrop','jedi','jester','kaboom','kick','kiss','kitty','laughchair','lick','link','lol','lolbeat','loving','makeout','medal','megaman','megamanguitar','meow','metime','mooning','mummy','na','nauseous','nervous','ninja','nod','nono','omg','onfire','ooo','orly','p','paddle','panda','pandabutt','paranoid','party','pat','peek','pikachu','pimp','plzdie','poke','popcorn','pout','probe','puke','punch','quote','raccoon','roar','rofl','roflmao','rolleyes','sad','sadeyes','sadhug','samurai','sarcasm','scoot','scream','shmoopy','shrug','skull','slap','slapfight','sleepy','smackfish','smackhead','smh','smile','smoke','sonic','spank','sparta','sperm','spiderman','stab','star','stare','stfu','suicide','surprisehug','suspicious','sweat','swordfight','taco','talk2hand','tantrum','teehee','thinking','threesome','throw','throwaway','tickle','typing','uhuh','vampbat','viking','violin','vulgar','wah','wat','whip','whipping','wink','witch','wizard','woah','worm','woo','work','worship','wow','XD','yay','zzz']
+    },
+    {
+        type:'rage',
+        emojis: ['troll','bitchplease','spit','challengeaccepted','contentiouscereal','cryingatcuteness','derp','derpcornsyrup','derpcrying','derpcute','derpdumb','derpeuphoria','derpinahd','derpinapokerface','derpinasnickering','derpprocessing','derprealization','derpsnickering','derptalking','derpthinking','derpthumbsup','derpunimpressed','derpwhy','donotwant','epicfacefeatures','fancywithwine','fffffffuuuuuuuuuuuu','flipthetable','foreveralone','foreveralonehappy','hewillnever','idontknow','interuptedreading','iseewhatyoudidthere','killherkillher','ledesire','leexcited','legenius','lelolidk','lemiddlefinger','lemindblown','leokay','lepanicrunning','lepokerface','lepokerface2','lerageface','leseriousface','likeaboss','lolface','longwhiskers','manymiddlefingers','megusta','motherfucker','motherofgod','mysides','ohgodwhy','pervertedspiderman','picard','ragestrangle','rukiddingme','tfwyougettrolled','trollolol','truestorybro','xallthey','yuno']
+    },
+    {
+        type:'wojak',
+        emojis: ['gigachad','gigachad2','chadyes','chadno','abusivewife','ancap','bardfinn','bloomer','boomer','boomermonster','brainletbush','brainletcaved','brainletchair','brainletchest','brainletmaga','brainletpit','chad','chadarab','chadasian','chadblack','chadjesus','chadjew','chadjihadi','chadlatino','chadlibleft','chadnordic','chadsikh','chadusa','coomer','doomer','doomerfront','doomergirl','ethot','fatbrain','fatpriest','femboy','gogetter','grug','monke','nazijak','npc','npcfront','npcmaga','psychojak','ragejak','ragemask','ramonajak','soyjackwow','soyjak','soyjakfront','soyjakhipster','soyjakmaga','soyjakyell','tomboy','zoomer','zoomersoy']
+    },
+    {
+        type:'flags',
+        emojis: ['niger', 'lgbt', 'saudi', 'animesexual','blacknation','blm','blueline','dreamgender','fatpride','incelpride','israel','kazakhstan','landlordlove','scalperpride','superstraight','trans','translord','transracial','usa']
+    }
+    ]
+
+    let search_bar = document.getElementById("emoji_search");
+    let search_container = document.getElementById('emoji-tab-search')
+
+    if(search_bar.value == ""){
+        let container = document.getElementById(`EMOJIS_favorite`)
+        container.innerHTML = container.innerHTML.replace(/@form@/g, form)
+
+        const commentBox = document.getElementById(form);
+        commentBox.setAttribute(TEXTAREA_POS_ATTR, commentBox.selectionStart);
+
+        for (i=0; i < emojis.length; i++) {
+
+            let container = document.getElementById(`EMOJIS_${emojis[i].type}`)
+            let str = ''
+            let arr = emojis[i].emojis
+
+            for (j=0; j < arr.length; j++) {
+                if(arr[j].match(search_bar.value)){
+                    str += `<button class="btn m-1 px-0 emoji" onclick="getEmoji(\'${arr[j]}\', \'${form}\')" style="background: None!important; width:60px; overflow: hidden; border: none;" data-bs-toggle="tooltip" title=":${arr[j]}:" delay:="0"><img loading="lazy" width=50 src="/assets/images/emojis/${arr[j]}.webp" alt="${arr[j]}-emoji"/></button>`;
+                }
+            }
+
+            container.innerHTML = str
+            search_container.innerHTML = ""
+        }
+    }else{
+        let str = ''
+        for (i=0; i < emojis.length; i++) {
+            let arr = emojis[i].emojis
+            let container = document.getElementById(`EMOJIS_${emojis[i].type}`)
+            for (j=0; j < arr.length; j++) {
+                if(arr[j].match(search_bar.value.toLowerCase())){
+                str += `<button class="btn m-1 px-0 emoji" onclick="getEmoji(\'${arr[j]}\', \'${form}\')" style="background: None!important; width:60px; overflow: hidden; border: none;" data-bs-toggle="tooltip" title=":${arr[j]}:" delay:="0"><img loading="lazy" width=50 src="/assets/images/emojis/${arr[j]}.webp" alt="${arr[j]}-emoji"/></button>`;
+                }
+            }
+            container.innerHTML = ""
+        }
+        search_container.innerHTML = str
+    }
+    search_bar.oninput = function(){loadEmojis(form);};
+}
diff --git a/files/assets/js/general41.js b/files/assets/js/general41.js
deleted file mode 100644
index 90fd79864..000000000
--- a/files/assets/js/general41.js
+++ /dev/null
@@ -1,130 +0,0 @@
-document.addEventListener("DOMContentLoaded", function(){
-    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
-    tooltipTriggerList.map(function(element){
-        return new bootstrap.Tooltip(element);
-    });
-});
-
-function post(url, callback, errortext) {
-	var xhr = new XMLHttpRequest();
-	xhr.open("POST", url, true);
-	var form = new FormData()
-	form.append("formkey", formkey());
-	xhr.withCredentials=true;
-	xhr.onerror=function() { alert(errortext); };
-	xhr.onload = function() {
-		if (xhr.status >= 200 && xhr.status < 300) {
-			callback();
-		} else {
-			xhr.onerror();
-		}
-	};
-	xhr.send(form);
-};
-
-function post_toast(url, reload, data) {
-	var xhr = new XMLHttpRequest();
-	xhr.open("POST", url, true);
-	var form = new FormData()
-
-	if(typeof data === 'object' && data !== null) {
-		for(let k of Object.keys(data)) {
-			form.append(k, data[k]);
-		}
-	}
-
-
-	form.append("formkey", formkey());
-	xhr.withCredentials=true;
-
-	xhr.onload = function() {
-		if (xhr.status >= 200 && xhr.status < 300) {
-			var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-			myToast.show();
-			try {
-				document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
-			} catch(e) {
-				document.getElementById('toast-post-success-text').innerText = "Action successful!";
-			}
-
-			if (reload == 1) {window.location.reload(true)}
-			return true
-
-		} else if (xhr.status >= 300 && xhr.status < 400) {
-			window.location.href = JSON.parse(xhr.response)["redirect"]
-		} else {
-			try {
-				data=JSON.parse(xhr.response);
-
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.show();
-				document.getElementById('toast-post-error-text').innerText = data["error"];
-				return false
-			} catch(e) {
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-				myToast.hide();
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.show();
-				document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
-				return false
-			}
-		}
-	};
-
-	xhr.send(form);
-
-}
-
-
-function post_toast2(url, button1, button2) {
-	var xhr = new XMLHttpRequest();
-	xhr.open("POST", url, true);
-	var form = new FormData()
-
-	if(typeof data === 'object' && data !== null) {
-		for(let k of Object.keys(data)) {
-				form.append(k, data[k]);
-		}
-	}
-
-
-	form.append("formkey", formkey());
-	xhr.withCredentials=true;
-
-	xhr.onload = function() {
-		if (xhr.status >= 200 && xhr.status < 300) {
-			try {
-				document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
-			} catch(e) {
-				document.getElementById('toast-post-success-text').innerText = "Action successful!";
-			}
-			var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-			myToast.show();
-			return true
-
-		} else if (xhr.status >= 300 && xhr.status < 400) {
-			window.location.href = JSON.parse(xhr.response)["redirect"]
-		} else {
-			try {
-				data=JSON.parse(xhr.response);
-
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.show();
-				document.getElementById('toast-post-error-text').innerText = data["error"];
-				return false
-			} catch(e) {
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-				myToast.hide();
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.show();
-				document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
-				return false
-			}
-		}
-	};
-
-	xhr.send(form);
-
-	document.getElementById(button1).classList.toggle("d-none");
-	document.getElementById(button2).classList.toggle("d-none");
-}
\ No newline at end of file
diff --git a/files/assets/js/gif_modal.js b/files/assets/js/gif_modal.js
new file mode 100644
index 000000000..56ad8e812
--- /dev/null
+++ b/files/assets/js/gif_modal.js
@@ -0,0 +1,104 @@
+async function getGif(searchTerm) {
+
+    if (searchTerm !== undefined) {
+        document.getElementById('gifSearch').value = searchTerm;
+    }
+    else {
+        document.getElementById('gifSearch').value = null;
+    }
+
+    var loadGIFs = document.getElementById('gifs-load-more');
+
+    var noGIFs = document.getElementById('no-gifs-found');
+
+    var cats = document.getElementById('GIFcats');
+
+    var container = document.getElementById('GIFs');
+
+    var modalBody = document.getElementById('gif-modal-body')
+
+    var backBtn = document.getElementById('gifs-back-btn');
+
+    var cancelBtn = document.getElementById('gifs-cancel-btn');
+
+    container.innerHTML = '';
+
+    if (searchTerm == undefined) {
+        container.innerHTML = '<div class="card" onclick="getGif(\'agree\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Agree</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/wGhYz3FHaRJgk/200w_d.webp"> </div> <div class="card" onclick="getGif(\'laugh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Laugh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/O5NyCibf93upy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'confused\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Confused</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o7btPCcdNniyf0ArS/200w_d.webp"> </div> <div class="card" onclick="getGif(\'sad\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Sad</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/ISOckXUybVfQ4/200w_d.webp"> </div> <div class="card" onclick="getGif(\'happy\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Happy</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/XR9Dp54ZC4dji/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awesome\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awesome</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3ohzdIuqJoo8QdKlnW/200w_d.webp"> </div> <div class="card" onclick="getGif(\'yes\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Yes</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/J336VCs1JC42zGRhjH/200w_d.webp"> </div> <div class="card" onclick="getGif(\'no\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">No</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1zSz5MVw4zKg0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'love\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Love</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/4N1wOi78ZGzSB6H7vK/200w_d.webp"> </div> <div class="card" onclick="getGif(\'please\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Please</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/qUIm5wu6LAAog/200w_d.webp"> </div> <div class="card" onclick="getGif(\'scared\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Scared</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/bEVKYB487Lqxy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'angry\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Angry</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/12Pb87uq0Vwq2c/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awkward\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awkward</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/unFLKoAV3TkXe/200w_d.webp"> </div> <div class="card" onclick="getGif(\'cringe\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Cringe</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1jDvQyhGd3L2g/200w_d.webp"> </div> <div class="card" onclick="getGif(\'omg\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">OMG</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o72F8t9TDi2xVnxOE/200w_d.webp"> </div> <div class="card" onclick="getGif(\'why\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Why</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1M9fmo1WAFVK0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'gross\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Gross</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/pVAMI8QYM42n6/200w_d.webp"> </div> <div class="card" onclick="getGif(\'meh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Meh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/xT77XTpyEzJ4OJO06c/200w_d.webp"> </div>'
+
+        backBtn.innerHTML = null;
+
+        cancelBtn.innerHTML = null;
+
+        noGIFs.innerHTML = null;
+
+        loadGIFs.innerHTML = null;
+    }
+    else {
+        backBtn.innerHTML = '<button class="btn btn-link pl-0 pr-3" id="gifs-back-btn" onclick="getGif();"><i class="fas fa-long-arrow-left text-muted ml-3"></i></button>';
+
+        cancelBtn.innerHTML = '<button class="btn btn-link pl-3 pr-0" id="gifs-cancel-btn" onclick="getGif();"><i class="fas fa-times text-muted"></i></button>';
+
+        let response = await fetch("/giphy?searchTerm=" + searchTerm + "&limit=48");
+        let data = await response.json()
+        var max = data.length - 1 //length of response, minus 1 (cuz array starts at index 0)
+        data = data.data
+                    var gifURL = [];
+
+        if (max <= 0) {
+            noGIFs.innerHTML = '<div class="text-center py-3 mt-3"><div class="mb-3"><i class="fad fa-frown text-gray-500" style="font-size: 3.5rem;"></i></div><p class="font-weight-bold text-gray-500 mb-0">Aw shucks. No GIFs found...</p></div>';
+            container.innerHTML = null;
+            loadGIFs.innerHTML = null;
+        }
+        else {
+            for (var i = 0; i < 48; i++) {
+            gifURL[i] = "https://media.giphy.com/media/" + data[i].id + "/200w_d.webp";
+            if (data[i].username==''){
+                container.innerHTML += ('<div class="card bg-white" style="overflow: hidden" data-bs-dismiss="modal" aria-label="Close" onclick="insertGIF(\'' + 'https://media.giphy.com/media/' + data[i].id + '/200w_d.webp' + '\',\'' + commentFormID + '\')"><div class="gif-cat-overlay"></div><img loading="lazy" class="img-fluid" src="' + gifURL[i] + '"></div>');
+            }
+            else {
+                container.innerHTML += ('<div class="card bg-white" style="overflow: hidden" data-bs-dismiss="modal" aria-label="Close" title="by '+data[i].username+' on GIPHY" onclick="insertGIF(\'' + 'https://media.giphy.com/media/' + data[i].id + '/200w_d.webp' + '\',\'' + commentFormID + '\')"><div class="gif-cat-overlay"></div><img loading="lazy" class="img-fluid" src="' + gifURL[i] + '"></div>');
+            }
+            noGIFs.innerHTML = null;
+            loadGIFs.innerHTML = '<div class="text-center py-3"><div class="mb-3"><i class="fad fa-grin-beam-sweat text-gray-500" style="font-size: 3.5rem;"></i></div><p class="font-weight-bold text-gray-500 mb-0">Thou&#39;ve reached the end of the list!</p></div>';
+            }
+        }
+    }
+}
+
+function insertGIF(url,form) {
+
+    var gif = "![](" + url +")";
+
+    var commentBox = document.getElementById(form);
+
+    var old	= commentBox.value;
+
+    commentBox.value = old + gif;
+
+    }
+
+    document.getElementById('gifModal').addEventListener('hidden.bs.modal', function (e) {
+
+    document.getElementById('gifSearch').value = null;
+
+    var loadGIFs = document.getElementById('gifs-load-more');
+
+    var noGIFs = document.getElementById('no-gifs-found');
+
+    var container = document.getElementById('GIFs');
+
+    var backBtn = document.getElementById('gifs-back-btn');
+
+    var cancelBtn = document.getElementById('gifs-cancel-btn');
+
+    container.innerHTML = '<div class="card" onclick="getGif(\'agree\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Agree</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/wGhYz3FHaRJgk/200w_d.webp"> </div> <div class="card" onclick="getGif(\'laugh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Laugh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/O5NyCibf93upy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'confused\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Confused</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o7btPCcdNniyf0ArS/200w_d.webp"> </div> <div class="card" onclick="getGif(\'sad\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Sad</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/ISOckXUybVfQ4/200w_d.webp"> </div> <div class="card" onclick="getGif(\'happy\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Happy</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/XR9Dp54ZC4dji/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awesome\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awesome</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3ohzdIuqJoo8QdKlnW/200w_d.webp"> </div> <div class="card" onclick="getGif(\'yes\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Yes</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/J336VCs1JC42zGRhjH/200w_d.webp"> </div> <div class="card" onclick="getGif(\'no\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">No</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1zSz5MVw4zKg0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'love\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Love</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/4N1wOi78ZGzSB6H7vK/200w_d.webp"> </div> <div class="card" onclick="getGif(\'please\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Please</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/qUIm5wu6LAAog/200w_d.webp"> </div> <div class="card" onclick="getGif(\'scared\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Scared</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/bEVKYB487Lqxy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'angry\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Angry</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/12Pb87uq0Vwq2c/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awkward\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awkward</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/unFLKoAV3TkXe/200w_d.webp"> </div> <div class="card" onclick="getGif(\'cringe\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Cringe</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1jDvQyhGd3L2g/200w_d.webp"> </div> <div class="card" onclick="getGif(\'omg\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">OMG</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o72F8t9TDi2xVnxOE/200w_d.webp"> </div> <div class="card" onclick="getGif(\'why\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Why</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1M9fmo1WAFVK0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'gross\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Gross</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/pVAMI8QYM42n6/200w_d.webp"> </div> <div class="card" onclick="getGif(\'meh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Meh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/xT77XTpyEzJ4OJO06c/200w_d.webp"> </div>'
+
+    backBtn.innerHTML = null;
+
+    cancelBtn.innerHTML = null;
+
+    noGIFs.innerHTML = null;
+
+    loadGIFs.innerHTML = null;
+});
\ No newline at end of file
diff --git a/files/assets/js/header.js b/files/assets/js/header.js
new file mode 100644
index 000000000..63b72e8d4
--- /dev/null
+++ b/files/assets/js/header.js
@@ -0,0 +1,59 @@
+document.addEventListener("DOMContentLoaded", function(){
+    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+    tooltipTriggerList.map(function(element){
+        return new bootstrap.Tooltip(element);
+    });
+});
+
+function post_toast(url, reload, data) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+
+    if(typeof data === 'object' && data !== null) {
+        for(let k of Object.keys(data)) {
+            form.append(k, data[k]);
+        }
+    }
+
+
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+
+    xhr.onload = function() {
+        if (xhr.status >= 200 && xhr.status < 300) {
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+            try {
+                document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
+            } catch(e) {
+                document.getElementById('toast-post-success-text').innerText = "Action successful!";
+            }
+
+            if (reload == 1) {window.location.reload(true)}
+            return true
+
+        } else if (xhr.status >= 300 && xhr.status < 400) {
+            window.location.href = JSON.parse(xhr.response)["redirect"]
+        } else {
+            try {
+                data=JSON.parse(xhr.response);
+
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+                myToast.show();
+                document.getElementById('toast-post-error-text').innerText = data["error"];
+                return false
+            } catch(e) {
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+                myToast.hide();
+                var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+                myToast.show();
+                document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
+                return false
+            }
+        }
+    };
+
+    xhr.send(form);
+
+}
\ No newline at end of file
diff --git a/files/assets/js/mobile_navigation_bar.js b/files/assets/js/mobile_navigation_bar.js
new file mode 100644
index 000000000..797ade2f7
--- /dev/null
+++ b/files/assets/js/mobile_navigation_bar.js
@@ -0,0 +1,46 @@
+window.onload = function () {
+    var prevScrollpos = window.pageYOffset;
+    window.onscroll = function () {
+        var currentScrollPos = window.pageYOffset;
+
+        var topBar = document.getElementById("fixed-bar-mobile");
+
+        var bottomBar = document.getElementById("mobile-bottom-navigation-bar");
+
+        var dropdown = document.getElementById("mobileSortDropdown");
+
+        var navbar = document.getElementById("navbar");
+
+        if (bottomBar != null) {
+            if (prevScrollpos > currentScrollPos && (window.innerHeight + currentScrollPos) < (document.body.offsetHeight - 65)) {
+                bottomBar.style.bottom = "0px";
+            } 
+            else if (currentScrollPos <= 125 && (window.innerHeight + currentScrollPos) < (document.body.offsetHeight - 65)) {
+                bottomBar.style.bottom = "0px";
+            }
+            else if (prevScrollpos > currentScrollPos && (window.innerHeight + currentScrollPos) >= (document.body.offsetHeight - 65)) {
+                bottomBar.style.bottom = "-50px";
+            }
+            else {
+                bottomBar.style.bottom = "-50px";
+            }
+        }
+
+        if (topBar != null && dropdown != null) {
+            if (prevScrollpos > currentScrollPos) {
+                topBar.style.top = "48px";
+                navbar.classList.remove("shadow");
+            } 
+            else if (currentScrollPos <= 125) {
+                topBar.style.top = "48px";
+                navbar.classList.remove("shadow");
+            }
+            else {
+                topBar.style.top = "-48px";
+                dropdown.classList.remove('show');
+                navbar.classList.add("shadow");
+            }
+        }
+        prevScrollpos = currentScrollPos;
+    }
+}
\ No newline at end of file
diff --git a/files/assets/js/report_post_modal.js b/files/assets/js/report_post_modal.js
new file mode 100644
index 000000000..3de4c75f3
--- /dev/null
+++ b/files/assets/js/report_post_modal.js
@@ -0,0 +1,47 @@
+report_postModal = function(id, author) {
+
+    document.getElementById("post-author").textContent = author;
+
+    submitbutton=document.getElementById("reportPostButton");
+
+    submitbutton.onclick = function() {
+
+        this.innerHTML='<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span>Reporting post';
+        this.disabled = true;
+
+        var xhr = new XMLHttpRequest();
+        xhr.open("POST", '/flag/post/'+id, true);
+        var form = new FormData()
+        form.append("formkey", formkey());
+        form.append("reason", document.getElementById("reason").value);
+
+        xhr.withCredentials=true;
+
+        xhr.onload=function() {
+            document.getElementById("reportPostFormBefore").classList.add('d-none');
+            document.getElementById("reportPostFormAfter").classList.remove('d-none');
+        };
+
+        xhr.onerror=function(){alert(errortext)};
+        xhr.send(form);
+
+    }
+};
+
+document.getElementById('reportPostModal').addEventListener('hidden.bs.modal', function () {
+
+    var button = document.getElementById("reportPostButton");
+
+    var beforeModal = document.getElementById("reportPostFormBefore");
+    var afterModal = document.getElementById("reportPostFormAfter");
+
+    button.innerHTML='Report post';
+    button.disabled= false;
+
+    afterModal.classList.add('d-none');
+
+    if ( beforeModal.classList.contains('d-none') ) {
+        beforeModal.classList.remove('d-none');
+    }
+
+});
diff --git a/files/assets/js/settings_profile.js b/files/assets/js/settings_profile.js
new file mode 100644
index 000000000..205d66d40
--- /dev/null
+++ b/files/assets/js/settings_profile.js
@@ -0,0 +1,81 @@
+function post(url, callback, errortext) {
+	var xhr = new XMLHttpRequest();
+	xhr.open("POST", url, true);
+	var form = new FormData()
+	form.append("formkey", formkey());
+	xhr.withCredentials=true;
+	xhr.onerror=function() { alert(errortext); };
+	xhr.onload = function() {
+		if (xhr.status >= 200 && xhr.status < 300) {
+			callback();
+		} else {
+			xhr.onerror();
+		}
+	};
+	xhr.send(form);
+};
+
+function updatebgselection(){
+    var bgselector = document.getElementById("backgroundSelector");
+    var selection = bgselector.options[bgselector.selectedIndex].text;
+    const backgrounds = [
+        {
+            folder: "fantasy",
+            backgrounds: 
+            [
+                "1.webp",
+                "2.webp",
+                "3.webp",
+                "4.webp",
+                "5.webp",
+                "6.webp",
+            ]
+        },
+        {
+            folder: "solarpunk",
+            backgrounds: 
+            [
+                "1.webp",
+                "2.webp",
+                "3.webp",
+                "4.webp",
+                "5.webp",
+                "6.webp",
+                "7.webp",
+                "8.webp",
+                "9.webp",
+                "10.webp",
+                "11.webp",
+                "12.webp",
+                "13.webp",
+                "14.webp",
+                "15.webp",
+                "16.webp",
+                "17.webp",
+                "18.webp",
+                "19.webp",
+            ]
+        },
+        {
+        folder: "pixelart",
+        backgrounds:
+        [
+            "1.webp",
+            "2.webp",
+            "3.webp",
+            "4.webp",
+            "5.webp",
+        ]
+        }
+    ]
+        let bgContainer = document.getElementById(`bgcontainer`);
+        let str = '';
+        let bgsToDisplay = backgrounds[bgselector.selectedIndex].backgrounds;
+        let bgsDir = backgrounds[bgselector.selectedIndex].folder;
+        for (i=0; i < bgsToDisplay.length; i++) {
+            let onclickPost = bgsDir + "/" + bgsToDisplay[i];
+            str += `<button class="btn btn-secondary m-1 p-0" style="width:15rem; overflow: hidden;"><img loading="lazy" style="padding:0.25rem; width: 15rem" src="/assets/images/backgrounds/${bgsDir}/${bgsToDisplay[i]}" alt="${bgsToDisplay[i]}-background" onclick="post('/settings/profile?background=${onclickPost}', function(){window.location.reload(true);})"/></button>`;
+        }
+        bgContainer.innerHTML = str;
+    }
+    updatebgselection();
\ No newline at end of file
diff --git a/files/assets/js/submit.js b/files/assets/js/submit.js
new file mode 100644
index 000000000..8b9b7b5df
--- /dev/null
+++ b/files/assets/js/submit.js
@@ -0,0 +1,222 @@
+makeBold = function (form) {
+    var text = document.getElementById(form);
+    var startIndex = text.selectionStart,
+    endIndex = text.selectionEnd;
+    var selectedText = text.value.substring(startIndex, endIndex);
+
+    var format = '**'
+
+    if (selectedText.includes('**')) {
+        text.value = selectedText.replace(/\*/g, '');
+    }
+    else if (selectedText.length == 0) {
+        text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
+    }
+    else {
+        text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
+    }
+}
+
+makeItalics = function (form) {
+    var text = document.getElementById(form);
+    var startIndex = text.selectionStart,
+    endIndex = text.selectionEnd;
+    var selectedText = text.value.substring(startIndex, endIndex);
+
+    var format = '*'
+
+    if (selectedText.includes('*')) {
+        text.value = selectedText.replace(/\*/g, '');
+    }
+    else if (selectedText.length == 0) {
+        text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
+    }
+    else {
+        text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
+    }
+}
+
+makeQuote = function (form) {
+    var text = document.getElementById(form);
+    var startIndex = text.selectionStart,
+    endIndex = text.selectionEnd;
+    var selectedText = text.value.substring(startIndex, endIndex);
+
+    var format = '>'
+
+    if (selectedText.includes('>')) {
+        text.value = text.value.substring(0, startIndex) + selectedText.replace(/\>/g, '') + text.value.substring(endIndex);
+    }
+    else if (selectedText.length == 0) {
+        text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
+    }
+    else {
+        text.value = text.value.substring(0, startIndex) + format + selectedText + text.value.substring(endIndex);
+    }
+}
+function charLimit(form, text) {
+
+    var input = document.getElementById(form);
+
+    var text = document.getElementById(text);
+
+    var length = input.value.length;
+
+    var maxLength = input.getAttribute("maxlength");
+
+    if (length >= maxLength) {
+        text.style.color = "#E53E3E";
+    }
+    else if (length >= maxLength * .72){
+        text.style.color = "#FFC107";
+    }
+    else {
+        text.style.color = "#A0AEC0";
+    }
+
+    text.innerText = maxLength - length;
+
+}
+
+hide_image=function(){
+    x=document.getElementById('image-upload-block');
+    url=document.getElementById('post-URL').value;
+    if (url.length>=1){
+        x.classList.add('d-none');
+    }
+    else {
+        x.classList.remove('d-none');
+    }
+}
+
+function autoSuggestTitle()	{
+
+    var urlField = document.getElementById("post-URL");
+
+    var titleField = document.getElementById("post-title");
+
+    var isValidURL = urlField.checkValidity();
+
+    if (isValidURL && urlField.value.length > 0 && titleField.value === "") {
+
+        var x = new XMLHttpRequest();
+        x.withCredentials=true;
+        x.onreadystatechange = function() {
+            if (x.readyState == 4 && x.status == 200) {
+
+                title=JSON.parse(x.responseText)["title"];
+                titleField.value=title;
+
+                checkForRequired()
+            }
+        }
+        x.open('get','/submit/title?url=' + urlField.value);
+        x.send(null);
+
+    };
+
+};
+
+if (window.location.pathname=='/submit') {
+    window.onload = autoSuggestTitle();
+}
+
+document.addEventListener('paste', function (event) {
+
+    var nothingFocused = document.activeElement === document.body;
+
+    if (nothingFocused) {
+
+        var clipText = event.clipboardData.getData('Text');
+
+        var url = new RegExp('^(?:[a-z]+:)?//', 'i');
+
+        if (url.test(clipText) && window.location.pathname !== '/submit') {
+            window.location.href = '/submit?url=' + clipText;
+        }
+        else if (url.test(clipText) && window.location.pathname == '/submit') {
+
+            document.getElementById("post-URL").value = clipText;
+
+            autoSuggestTitle()
+
+        }
+    }
+});
+
+function checkForRequired() {
+
+    var title = document.getElementById("post-title");
+
+    var url = document.getElementById("post-URL");
+
+    var text = document.getElementById("post-text");
+
+    var button = document.getElementById("create_button");
+
+    var image = document.getElementById("file-upload");
+
+    if (url.value.length > 0 || image.value.length > 0) {
+        text.required = false;
+        url.required=false;
+    } else if (text.value.length > 0 || image.value.length > 0) {
+        url.required = false;
+    } else {
+        text.required = true;
+        url.required = true;
+    }
+
+    var isValidTitle = title.checkValidity();
+
+    var isValidURL = url.checkValidity();
+
+    var isValidText = text.checkValidity();
+
+    if (isValidTitle && (isValidURL || image.value.length>0)) {
+        button.disabled = false;
+    } else if (isValidTitle && isValidText) {
+        button.disabled = false;
+    } else {
+        button.disabled = true;
+    }
+}
+
+
+function markdown() {
+    var input = document.getElementById('post-text').value;
+
+    var emojis = Array.from(input.matchAll(/:(.{1,30}?):/gi))
+        if(emojis != null){
+                for(i = 0; i < emojis.length; i++){
+                    input = input.replace(emojis[i][0], "<img height=30 src='/assets/images/emojis/" + emojis[i][1] + ".webp'>")
+                }
+        }
+    document.getElementById('preview').innerHTML = marked(input)
+}
+
+document.onpaste = function(event) {
+    f=document.getElementById('file-upload');
+    files = event.clipboardData.files
+    filename = files[0].name.toLowerCase()
+    if (filename.endsWith(".jpg") || filename.endsWith(".jpeg") || filename.endsWith(".png") || filename.endsWith(".webp"))
+    {
+        f.files = files;
+        document.getElementById('filename-show').textContent = filename;
+        document.getElementById('urlblock').classList.add('d-none');
+        var fileReader = new FileReader();
+        fileReader.readAsDataURL(f.files[0]);
+        fileReader.addEventListener("load", function () {document.getElementById('image-preview').setAttribute('src', this.result);});  
+        document.getElementById('file-upload').setAttribute('required', 'false');
+        checkForRequired();
+    }
+}
+
+document.getElementById('file-upload').addEventListener('change', function(e){
+    f=document.getElementById('file-upload');
+    document.getElementById('urlblock').classList.add('d-none');
+    document.getElementById('filename-show').textContent = document.getElementById('file-upload').files[0].name;
+    var fileReader = new FileReader();
+    fileReader.readAsDataURL(f.files[0]);
+    fileReader.addEventListener("load", function () {document.getElementById('image-preview').setAttribute('src', this.result);});  
+    checkForRequired();
+})
\ No newline at end of file
diff --git a/files/assets/js/userpage.js b/files/assets/js/userpage.js
new file mode 100644
index 000000000..6384f348b
--- /dev/null
+++ b/files/assets/js/userpage.js
@@ -0,0 +1,114 @@
+function post_toast_callback(url, data, callback) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url, true);
+    var form = new FormData()
+
+    if(typeof data === 'object' && data !== null) {
+        for(let k of Object.keys(data)) {
+            form.append(k, data[k]);
+        }
+    }
+
+    form.append("formkey", formkey());
+    xhr.withCredentials=true;
+
+    xhr.onload = function() {
+        let result = callback(xhr);
+        if (xhr.status >= 200 && xhr.status < 300) {
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.hide();
+
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.show();
+
+            try {
+                if(typeof result == "string") {
+                    document.getElementById('toast-post-success-text').innerText = result;
+                } else {
+                    document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
+                }
+            } catch(e) {
+                document.getElementById('toast-post-success-text').innerText = "Action successful!";
+            }
+
+            return true;
+        } else {
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
+            myToast.hide();
+
+            var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
+            myToast.show();
+
+            try {
+                if(typeof result == "string") {
+                    document.getElementById('toast-post-error-text').innerText = result;
+                } else {
+                    document.getElementById('toast-post-error-text').innerText = JSON.parse(xhr.response)["error"];
+                }
+                return false
+            } catch(e) {
+                document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
+            }
+
+            return false;
+        }
+    };
+
+    xhr.send(form);
+
+}
+
+const TRANSFER_TAX = 0.01;
+
+window.addEventListener( 'load', function() {
+    var userid = document.getElementById("userid").value;
+    if (userid != "nosong")
+    {
+        var audio = new Audio(`/songs/${userid}`);
+        audio.loop=true;
+        audio.play();
+        document.getElementById('userpage').addEventListener('click', () => {
+            if (audio.paused) audio.play(); 
+        }, {once : true});
+    }
+}, false );
+
+function transferCoins(mobile=false) {
+    let t = event.target;
+    t.disabled = true;
+
+    let amount = parseInt(document.getElementById("coins-transfer-amount").value);
+    let transferred = amount - Math.ceil(amount*TRANSFER_TAX);
+
+    post_toast_callback("/@{{u.username}}/transfer_coins",
+        {"amount": document.getElementById(mobile ? "coins-transfer-amount-mobile" : "coins-transfer-amount").value},
+        (xhr) => {
+        if(xhr.status == 200) {
+            document.getElementById("user-coins-amount").innerText = parseInt(document.getElementById("user-coins-amount").innerText) - amount;
+            document.getElementById("profile-coins-amount-mobile").innerText = parseInt(document.getElementById("profile-coins-amount-mobile").innerText) + transferred;
+            document.getElementById("profile-coins-amount").innerText = parseInt(document.getElementById("profile-coins-amount").innerText) + transferred;
+        }
+        }
+    );
+
+    setTimeout(_ => t.disabled = false, 2000);
+}
+
+function updateTax(mobile=false) {
+    let suf = mobile ? "-mobile" : "";
+    let amount = parseInt(document.getElementById("coins-transfer-amount" + suf).value);
+    if(isNaN(amount) || amount < 0) {
+    amount = 0;
+    }
+    document.getElementById("coins-transfer-taxed" + suf).innerText = amount - Math.ceil(amount*TRANSFER_TAX);
+}
+
+function toggleElement(group, id) {
+    for(let el of document.getElementsByClassName(group)) {
+        if(el.id != id) {
+            el.classList.add('d-none');
+        }
+    }
+
+    document.getElementById(id).classList.toggle('d-none');
+}
\ No newline at end of file
diff --git a/files/templates/authforms.html b/files/templates/authforms.html
index 8aa70bc7a..eaf2ab29b 100644
--- a/files/templates/authforms.html
+++ b/files/templates/authforms.html
@@ -106,7 +106,6 @@
 
 
 </pre>
-				
 </body>
 
 </html>
\ No newline at end of file
diff --git a/files/templates/award_modal.html b/files/templates/award_modal.html
index 6ff25e185..df1bd2600 100644
--- a/files/templates/award_modal.html
+++ b/files/templates/award_modal.html
@@ -1,154 +1,4 @@
-<script>
-	// Voting
-
-	function post_vote(url, callback) {
-		var xhr = new XMLHttpRequest();
-		xhr.open("POST", url, true);
-		var form = new FormData()
-		form.append("formkey", formkey());
-		xhr.withCredentials=true;
-		xhr.send(form);
-	}
-
-	var upvote = function(event) {
-
-		var type = event.target.dataset.bsContentType;
-		var id = event.target.dataset.bsIdUp;
-
-		var downvoteButton = document.getElementsByClassName(type + '-' + id + '-down');
-		var upvoteButton = document.getElementsByClassName(type + '-' + id + '-up');
-		var scoreText = document.getElementsByClassName(type + '-score-' + id);
-
-		for (var j = 0; j < upvoteButton.length && j < downvoteButton.length && j < scoreText.length; j++) {
-
-			var thisUpvoteButton = upvoteButton[j];
-			var thisDownvoteButton = downvoteButton[j];
-			var thisScoreText = scoreText[j];
-			var thisScore = Number(thisScoreText.textContent);
-
-			if (thisUpvoteButton.classList.contains('active')) {
-				thisUpvoteButton.classList.remove('active')
-				thisScoreText.textContent = thisScore - 1
-				voteDirection = "0"
-			} else if (thisDownvoteButton.classList.contains('active')) {
-				thisUpvoteButton.classList.add('active')
-				thisDownvoteButton.classList.remove('active')
-				thisScoreText.textContent = thisScore + 2
-				voteDirection = "1"
-			} else {
-				thisUpvoteButton.classList.add('active')
-				thisScoreText.textContent = thisScore + 1
-				voteDirection = "1"
-			}
-
-			if (thisUpvoteButton.classList.contains('active')) {
-				thisScoreText.classList.add('score-up')
-				thisScoreText.classList.remove('score-down')
-				thisScoreText.classList.remove('score')
-			} else if (thisDownvoteButton.classList.contains('active')) {
-				thisScoreText.classList.add('score-down')
-				thisScoreText.classList.remove('score-up')
-				thisScoreText.classList.remove('score')
-			} else {
-				thisScoreText.classList.add('score')
-				thisScoreText.classList.remove('score-up')
-				thisScoreText.classList.remove('score-down')
-			}
-		}
-
-		post_vote("/vote/" + type + "/" + id + "/" + voteDirection);
-		
-	}
-
-	var downvote = function(event) {
-
-		var type = event.target.dataset.bsContentType;
-		var id = event.target.dataset.bsIdDown;
-
-		var downvoteButton = document.getElementsByClassName(type + '-' + id + '-down');
-		var upvoteButton = document.getElementsByClassName(type + '-' + id + '-up');
-		var scoreText = document.getElementsByClassName(type + '-score-' + id);
-
-		for (var j = 0; j < upvoteButton.length && j < downvoteButton.length && j < scoreText.length; j++) {
-
-			var thisUpvoteButton = upvoteButton[j];
-			var thisDownvoteButton = downvoteButton[j];
-			var thisScoreText = scoreText[j];
-			var thisScore = Number(thisScoreText.textContent);
-
-			if (thisDownvoteButton.classList.contains('active')) {
-				thisDownvoteButton.classList.remove('active')
-				thisScoreText.textContent = thisScore + 1
-				voteDirection = "0"
-			} else if (thisUpvoteButton.classList.contains('active')) {
-				thisDownvoteButton.classList.add('active')
-				thisUpvoteButton.classList.remove('active')
-				thisScoreText.textContent = thisScore - 2
-				voteDirection = "-1"
-			} else {
-				thisDownvoteButton.classList.add('active')
-				thisScoreText.textContent = thisScore - 1
-				voteDirection = "-1"
-			}
-
-			if (thisUpvoteButton.classList.contains('active')) {
-				thisScoreText.classList.add('score-up')
-				thisScoreText.classList.remove('score-down')
-				thisScoreText.classList.remove('score')
-			} else if (thisDownvoteButton.classList.contains('active')) {
-				thisScoreText.classList.add('score-down')
-				thisScoreText.classList.remove('score-up')
-				thisScoreText.classList.remove('score')
-			} else {
-				thisScoreText.classList.add('score')
-				thisScoreText.classList.remove('score-up')
-				thisScoreText.classList.remove('score-down')
-			}
-		}
-
-		post_vote("/vote/" + type + "/" + id + "/" + voteDirection);
-		
-	}
-
-
-	var upvoteButtons = document.getElementsByClassName('upvote-button')
-
-	var downvoteButtons = document.getElementsByClassName('downvote-button')
-
-	var voteDirection = 0
-
-	for (var i = 0; i < upvoteButtons.length; i++) {
-		upvoteButtons[i].addEventListener('click', upvote, false);
-		upvoteButtons[i].addEventListener('keydown', function(event) {
-			if (event.keyCode === 13) {
-				upvote(event)
-			}
-		}, false)
-	};
-
-	for (var i = 0; i < downvoteButtons.length; i++) {
-		downvoteButtons[i].addEventListener('click', downvote, false);
-		downvoteButtons[i].addEventListener('keydown', function(event) {
-			if (event.keyCode === 13) {
-				downvote(event)
-			}
-		}, false)
-	};
-
-	// award modal
-
-	function awardModal(link) {
-		var target = document.getElementById("awardTarget");
-		target.action = link;
-	}
-
-	function bruh(kind) {
-		document.getElementById('giveaward').disabled=false;
-		document.getElementById('kind').value=kind;
-		try {document.getElementsByClassName('picked')[0].classList.toggle('picked');} catch(e) {}
-		document.getElementById(kind).classList.toggle('picked')
-	}
-</script>
+<script src="/assets/js/award_modal.js"></script>
 
 <div class="modal fade" id="awardModal" tabindex="-1" role="dialog" aria-labelledby="awardModalTitle" aria-hidden="true">
 	<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" role="document">
diff --git a/files/templates/changelog.html b/files/templates/changelog.html
index cbc079a2f..37c3436cb 100644
--- a/files/templates/changelog.html
+++ b/files/templates/changelog.html
@@ -3,6 +3,7 @@
 {% block pagetitle %}Changelog{% endblock %}
 
 {% block desktopBanner %}
+<script src="/assets/js/changelog.js"></script>
 
 <div class="row d-block" style="overflow: visible;padding-top:5px;">
 	<div class="col">
diff --git a/files/templates/comments.html b/files/templates/comments.html
index 006372919..cde688b77 100644
--- a/files/templates/comments.html
+++ b/files/templates/comments.html
@@ -1,359 +1,16 @@
 <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script>
 
 {% if v %}
-	<script>
-		function post_toast3(url, button1, button2) {
-			var xhr = new XMLHttpRequest();
-			xhr.open("POST", url, true);
-			var form = new FormData()
-
-			if(typeof data === 'object' && data !== null) {
-				for(let k of Object.keys(data)) {
-						form.append(k, data[k]);
-				}
-			}
-
-
-			form.append("formkey", formkey());
-			xhr.withCredentials=true;
-
-			xhr.onload = function() {
-				if (xhr.status >= 200 && xhr.status < 300) {
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-					myToast.show();
-					try {
-						document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
-					} catch(e) {
-						document.getElementById('toast-post-success-text').innerText = "Action successful!";
-					}
-					return true
-
-				} else if (xhr.status >= 300 && xhr.status < 400) {
-					window.location.href = JSON.parse(xhr.response)["redirect"]
-				} else {
-
-					try {
-						data=JSON.parse(xhr.response);
-					} catch(e) {}
-
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-					myToast.hide();
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-					myToast.show();
-					document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
-					return false
-				}
-			};
-
-			xhr.send(form);
-
-			document.getElementById(button1).classList.toggle("d-md-inline-block");
-			document.getElementById(button2).classList.toggle("d-md-inline-block");
-		}
-
-		//reporting
-		// Report Comment
-
-		report_commentModal = function(id, author) {
-
-		document.getElementById("comment-author").textContent = author;
-
-		//offtopic.disabled=true;
-
-		document.getElementById("reportCommentButton").onclick = function() {
-
-			this.innerHTML='<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span>Reporting comment';
-			this.disabled = true;
-			var xhr = new XMLHttpRequest();
-			xhr.open("POST", '/flag/comment/'+id, true);
-			var form = new FormData()
-			form.append("formkey", formkey());
-			form.append("reason", document.getElementById("reason-comment").value);
-
-			xhr.withCredentials=true;
-
-			xhr.onload=function() {
-				document.getElementById("reportCommentFormBefore").classList.add('d-none');
-				document.getElementById("reportCommentFormAfter").classList.remove('d-none');
-			};
-
-			xhr.onerror=function(){alert(errortext)};
-			xhr.send(form);
-		}
-
-		};
-
-		document.getElementById('reportCommentModal').addEventListener('hidden.bs.modal', function () {
-
-		var button = document.getElementById("reportCommentButton");
-
-		var beforeModal = document.getElementById("reportCommentFormBefore");
-		var afterModal = document.getElementById("reportCommentFormAfter");
-
-		button.innerHTML='Report comment';
-		button.disabled= false;
-		afterModal.classList.add('d-none');
-
-		if ( beforeModal.classList.contains('d-none') ) {
-			beforeModal.classList.remove('d-none');
-		}
-
-		});
-
-		//Commenting form
-
-		// Open comment reply box
-
-		function openReplyBox(id) {
-			const element = document.getElementById(`reply-to-${id}`);
-			element.classList.remove('d-none')
-
-			element.getElementsByTagName('textarea')[0].focus()
-		}
-
-		// Comment edit form
-
-		toggleEdit=function(id){
-			comment=document.getElementById("comment-text-"+id);
-			form=document.getElementById("comment-edit-"+id);
-			box=document.getElementById('comment-edit-body-'+id);
-			actions = document.getElementById('comment-' + id +'-actions');
-
-			comment.classList.toggle("d-none");
-			form.classList.toggle("d-none");
-			actions.classList.toggle("d-none");
-			autoExpand(box);
-		};
-
-
-		// Delete Comment
-
-		function delete_commentModal(id) {
-
-			// Passed data for modal
-
-			document.getElementById("deleteCommentButton").onclick = function() {	
-
-				this.innerHTML='<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span>Deleting comment';	
-				this.disabled = true; 
-				post('/delete/comment/' + id,
-					callback = function() {
-
-						location.reload();
-					}
-					)
-			}
-
-		};
-
-
-		post_comment=function(fullname){
-
-
-			var form = new FormData();
-
-			form.append('formkey', formkey());
-			form.append('parent_fullname', fullname);
-			form.append('submission', document.getElementById('reply-form-submission-'+fullname).value);
-			form.append('body', document.getElementById('reply-form-body-'+fullname).value);
-			form.append('file', document.getElementById('file-upload-reply-'+fullname).files[0]);
-			var xhr = new XMLHttpRequest();
-			xhr.open("post", "/comment");
-			xhr.withCredentials=true;
-			xhr.onload=function(){
-				if (xhr.status==200) {
-					commentForm=document.getElementById('comment-form-space-'+fullname);
-					commentForm.innerHTML=JSON.parse(xhr.response)["html"];
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-					myToast.hide();
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-					myToast.show();
-				}
-				else {
-					var commentError = document.getElementById("comment-error-text");
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-					myToast.hide();
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-					myToast.show();
-					commentError.textContent = JSON.parse(xhr.response)["error"];
-				}
-			}
-			xhr.send(form)
-
-			document.getElementById('save-reply-to-'+fullname).classList.add('disabled');
-
-		}
-
-		post_reply=function(id){
-
-			var form = new FormData();
-
-			form.append('formkey', formkey());
-			form.append('parent_id', id);
-			form.append('body', document.getElementById('reply-form-body-'+id).value);
-			var xhr = new XMLHttpRequest();
-			xhr.open("post", "/reply");
-			xhr.withCredentials=true;
-			xhr.onload=function(){
-				if (xhr.status==200) {
-					commentForm=document.getElementById('comment-form-space-'+id);
-					commentForm.innerHTML=JSON.parse(xhr.response)["html"];
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-					myToast.hide();
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-					myToast.show();
-				}
-				else {
-					var commentError = document.getElementById("comment-error-text");
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-					myToast.hide();
-					var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-					myToast.show();
-					
-				}
-			}
-			xhr.send(form)
-
-			document.getElementById('save-reply-to-'+id).classList.add('disabled');
-
-			}
-
-			comment_edit=function(id){
-
-				var commentError = document.getElementById("comment-error-text");
-
-				var form = new FormData();
-
-				form.append('formkey', formkey());
-				form.append('body', document.getElementById('comment-edit-body-'+id).value);
-				form.append('file', document.getElementById('file-edit-reply-'+id).files[0]);
-
-				var xhr = new XMLHttpRequest();
-				xhr.open("post", "/edit_comment/"+id);
-				xhr.withCredentials=true;
-				xhr.onload=function(){
-					if (xhr.status==200) {
-						commentForm=document.getElementById('comment-text-'+id);
-						commentForm.innerHTML=JSON.parse(xhr.response)["html"];
-						document.getElementById('cancel-edit-'+id).click()
-						var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-						myToast.hide();
-						var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-						myToast.show();
-					}
-					else {
-						var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-						myToast.hide();
-						var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-						myToast.show();
-					
-						commentError.textContent = JSON.parse(xhr.response)["error"];
-					}
-				}
-				xhr.send(form)
-
-			}
-	</script>
+	<script src="/assets/js/comments_v.js"></script>
 {% endif %}
 
 
 {% if v and v.admin_level == 6 %}
-	<script>
-		//comment modding
-		function removeComment(post_id,button1,button2) {
-			url="/ban_comment/"+post_id
-
-			callback=function(){
-
-				try {
-					document.getElementById("comment-"+post_id+"-only").classList.add("banned");
-				} catch(e) {
-					document.getElementById("context").classList.add("banned");
-				}
-
-				button=document.getElementById("remove-"+post_id);
-				button.onclick=function(){approveComment(post_id)};
-				button.innerHTML='<i class="fas fa-clipboard-check"></i>Approve'
-			}
-			post(url, callback, "Comment has been removed.")
-			
-
-			if (typeof button1 !== 'undefined') {
-				document.getElementById(button1).classList.toggle("d-md-inline-block");
-				document.getElementById(button2).classList.toggle("d-md-inline-block");
-			}
-		};
-
-		function approveComment(post_id,button1,button2) {
-			url="/unban_comment/"+post_id
-
-			callback=function(){
-				try {
-					document.getElementById("comment-"+post_id+"-only").classList.remove("banned");
-				} catch(e) {
-					document.getElementById("context").classList.remove("banned");
-				}
-
-				button=document.getElementById("remove-"+post_id);
-				button.onclick=function(){removeComment(post_id)};
-				button.innerHTML='<i class="fas fa-trash-alt"></i>Remove'
-			}
-
-			post(url, callback, "Comment has been approved.")
-
-			if (typeof button1 !== 'undefined') {
-				document.getElementById(button1).classList.toggle("d-md-inline-block");
-				document.getElementById(button2).classList.toggle("d-md-inline-block");
-			}
-		}
-
-
-		function removeComment2(post_id,button1,button2) {
-			url="/ban_comment/"+post_id
-
-			callback=function(){
-				document.getElementById("comment-"+post_id+"-only").classList.add("banned");
-
-				button=document.getElementById("remove-"+post_id);
-				button.onclick=function(){approveComment(post_id)};
-				button.innerHTML='<i class="fas fa-clipboard-check"></i>Approve'
-			}
-			post(url, callback, "Comment has been removed.")
-			
-
-			if (typeof button1 !== 'undefined') {
-				document.getElementById(button1).classList.toggle("d-none");
-				document.getElementById(button2).classList.toggle("d-none");
-			}
-		};
-
-		function approveComment2(post_id,button1,button2) {
-			url="/unban_comment/"+post_id
-
-			callback=function(){
-				document.getElementById("comment-"+post_id+"-only").classList.remove("banned");
-
-				button=document.getElementById("remove-"+post_id);
-				button.onclick=function(){removeComment(post_id)};
-				button.innerHTML='<i class="fas fa-trash-alt"></i>Remove'
-			}
-
-			post(url, callback, "Comment has been approved.")
-
-			if (typeof button1 !== 'undefined') {
-				document.getElementById(button1).classList.toggle("d-none");
-				document.getElementById(button2).classList.toggle("d-none");
-			}
-		}
-	</script>
+	<script src="/assets/js/comments_admin.js"></script>
 {% endif %}
 
 <script>
 
-	// comment collapse
-
-	// Toggle comment collapse
-
 	function collapse_comment(comment_id) {
 		const comment = "comment-" + comment_id
 		const element = document.getElementById(comment)
@@ -488,7 +145,6 @@
 <div id="comment-{{c.id}}" class="{% if c.unread %}context{% endif %} comment {% if standalone and level==1 %} mt-0{% endif %}{% if c.collapse_for_user(v) or (standalone and c.over_18 and not (v and v.over_18)) %} collapsed{% endif %}" style="border-left: 2px solid #{{c.author.namecolor}}; {% if c.unread %}padding: 10px 10px 10px !important;{% endif %}">
 
 	<span class="comment-collapse-desktop d-none d-md-block" {% if not c.unread %}style="border-left: 2px solid #{{c.author.namecolor}};"{% endif %} onclick="collapse_comment('{{c.id}}')"></span>
-	
 	<div class="comment-body">
 
 		<div id="{% if comment_info and comment_info.id == c.id %}context{%else%}comment-{{c.id}}-only{% endif %}" class="{% if comment_info and comment_info.id == c.id %}context{%endif%}{% if c.is_banned %} banned{% endif %}{% if c.deleted_utc %} deleted{% endif %}">
@@ -507,7 +163,6 @@
 				{% if c.bannedfor and c.author.banned_by %}
 					<a href="javascript:void(0)"><i class="fad fa-gavel text-danger" data-bs-toggle="tooltip" data-bs-placement="bottom" title="User was banned for this comment by @{{c.author.banned_by.username}}"></i></a>
 				{% endif %}
-		
 				{% if c.active_flags %}<a class="btn btn-primary" style="padding:1px 5px; font-size:10px;" href="javascript:void(0)" onclick="document.getElementById('flaggers-{{c.id}}').classList.toggle('d-none')">{{c.active_flags}} Reports</a>{% endif %}
 				{% if c.over_18 %}<span class="badge badge-danger text-small-extra mr-1">+18</span>{% endif %}
 				{% if v and v.admin_level==6 and c.author.shadowbanned %}<i class="fas fa-user-times text-admin" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Shadowbanned user"></i>{% endif %}
@@ -528,7 +183,6 @@
 				<span class="time-edited"><span>&#183;</span> <span class="font-italic">Edited {{c.edited_string}}</span></span>
 				{% endif %}
 			</div>
-			
 			{% if c.active_flags %}
 			<div id="flaggers-{{c.id}}" class="flaggers d-none">
 				<strong><i class="far fa-fw fa-flag"></i> Reported by:</strong>
@@ -553,7 +207,6 @@
 				{% if not c.parent_submission and c.author_id!=NOTIFICATIONS_ACCOUNT and c.author_id!=AUTOJANNY_ACCOUNT and c.author_id!=v.id %}
 					<a class="btn btn-primary" href="javascript:void(0)" onclick="document.getElementById('reply-m-{{c.id}}').classList.toggle('d-none')">Reply</a>
 					<pre></pre>
-					
 					<div id="reply-m-{{c.id}}" class="d-none">
 						<div id="comment-form-space-{{c.id}}" class="comment-write collapsed child">		
 							<form id="reply-to-message-{{c.id}}" action="/reply" method="post" class="input-group" enctype="multipart/form-data">
@@ -578,7 +231,6 @@
 					</div>
 				{% endif %}
 			</div>
-			
 			{% if c.parent_submission %}
 
 				{% if v and v.id==c.author_id %}
@@ -591,7 +243,6 @@
 							&nbsp;
 							<small class="btn btn-secondary format d-inline-block m-0"><i class="fas fa-smile-beam" aria-hidden="true" onclick="loadEmojis('comment-edit-body-{{c.id}}')" data-bs-toggle="modal" data-bs-target="#emojiModal" data-bs-toggle="tooltip" data-bs-placement="bottom"  title="Add Emoji"></i></small>
 							&nbsp;
-							
 							<label class="btn btn-secondary format d-inline-block m-0" for="file-edit-reply-{{c.id}}">
 								<div id="filename-edit-reply-{{c.id}}"><i class="far fa-image"></i></div>
 								<input id="file-edit-reply-{{c.id}}" type="file" name="file" accept="image/*" onchange="document.getElementById('filename-edit-reply-{{c.id}}').innerHTML='image';" hidden>
@@ -605,16 +256,13 @@
 					</form>
 				</div>
 				{% endif %}
-		
 				<div id="comment-{{c.id}}-actions" class="comment-actions{% if voted==1 %} upvoted{% elif voted==-1 %} downvoted{% endif %}">
 					<ul class="list-inline text-right text-md-left">
 
 						{% if v and request.path.startswith('/@') and v.admin_level == 0%}
-						
 							{% if voted==1 %}
 							<li class="list-inline-item arrow-up d-none d-md-inline-block mr-2 comment-{{c.id}}-up active"></li>
 							{% endif %}
-						
 						{% elif v %}
 
 							<li id="comment-{{c.id}}-up" tabindex="0" class="list-inline-item arrow-up upvote-button d-none d-md-inline-block mr-2 comment-{{c.id}}-up {% if voted==1 %}active{% endif %}" data-bs-id-up="{{c.id}}" data-bs-content-type="comment"></li>
@@ -629,11 +277,9 @@
 						</li>
 
 						{% if v and request.path.startswith('/@') and v.admin_level == 0 %}
-						
 							{% if voted==-1 %}
 							<li class="list-inline-item arrow-down d-none d-md-inline-block mr-2 comment-{{c.id}}-down active"></li>
 							{% endif %}
-						
 						{% elif v %}
 							<li {% if environ.get('DISABLE_DOWNVOTES') == '1' %}style="display:None!important"{% endif %} id="comment-{{c.id}}-down" tabindex="0" class="list-inline-item arrow-down downvote-button d-none d-md-inline-block mr-2 comment-{{c.id}}-down {% if voted==-1 %}active{% endif %}" data-bs-id-down="{{c.id}}" data-bs-content-type="comment"></li>
 
@@ -659,7 +305,6 @@
 
 						<li class="list-inline-item text-muted d-none d-md-inline-block"><a {% if v %}href="{{c.permalink}}?context=5#context"{% else %}href="/logged_out{{c.permalink}}?context=5#context"{% endif %}><i class="fas fa-book-open"></i>Context</a></li>
 						<li class="list-inline-item text-muted d-none d-md-inline-block"><a href="javascript:void(0);" role="button" class="copy-link" data-clipboard-text="{% if 'rdrama' in request.host %}https://taytay.life{{c.permalink}}{% else %}{{c.permalink | full_link}}{% endif %}/?context=5#context"><i class="fas fa-copy"></i>Copy link</a></li>
-						
 						{% if v %}
 							<li class="list-inline-item text-muted d-none d-md-inline-block"><a href="javascript:void(0)" data-bs-toggle="modal" data-bs-target="#reportCommentModal" onclick="report_commentModal('{{c.id}}','{{c.author.username}}',)"><i class="fas fa-flag fa-fw"></i>Report</a></li>
 						{% endif %}
@@ -681,7 +326,6 @@
 							<li id="distinguish-{{c.id}}" class="list-inline-item d-none {% if not c.distinguish_level %}d-md-inline-block{% endif %}"><a class="text-info" href="javascript:void(0)" onclick="post_toast3('/distinguish_comment/{{c.id}}','distinguish-{{c.id}}','undistinguish-{{c.id}}','yes')"><i class="fas fa-id-badge text-info fa-fw"></i>Distinguish</a></li>
 						{% endif %}
 
-								
 						{% if v and not v.id==c.author_id and v.admin_level == 0 %}
 							<li id="unblock-{{c.id}}" class="{% if c.is_blocked %}d-md-inline-block{% endif %} list-inline-item text-muted d-none"><a href="javascript:void(0)" onclick="post_toast3('/settings/unblock?username={{c.author.username}}','block-{{c.id}}','unblock-{{c.id}}')"><i class="fas fa-eye-slash fa-fw"></i>Unblock user</a></li>
 							<li id="block-{{c.id}}" class="{% if not c.is_blocked %}d-md-inline-block{% endif %} list-inline-item text-muted d-none"><a href="javascript:void(0)" onclick="post_toast3('/settings/block?username={{c.author.username}}','block-{{c.id}}','unblock-{{c.id}}')"><i class="fas fa-eye-slash fa-fw"></i>Block user</a></li>
@@ -726,7 +370,6 @@
 						{% else %}
 							<li id="comment-{{c.id}}-up" tabindex="0" class="list-inline-item arrow-up d-inline-block d-md-none mr-2" onclick="location.href='/login';"></li>
 						{% endif %}
-						
 						<li class="list-inline-item d-inline-block d-md-none mr-2"><span class="points" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-original-title="+{{ups}} | -{{downs}}"><span id="comment-score-{{c.id}}" class="score comment-score-{{c.id}} {% if voted==1 %}score-up{% elif voted==-1%}score-down{% endif %}">{{score}}</span></span></li>
 						{% if v and request.path.startswith('/@') and v.admin_level == 0 %}
 							{% if voted==-1 %}
@@ -919,7 +562,6 @@
 						<span aria-hidden="true"><i class="far fa-times"></i></span>
 					</button>
 				</div>
-				
 				<div class="modal-body text-center">
 
 					<div class="py-4">
@@ -928,12 +570,10 @@
 
 					<p>Your comment will be removed everywhere on {{'SITE_NAME' | app_config}}. This action can be undone.</p>
 				</div>
-				
 				<div class="modal-footer">
 					<button type="button" class="btn btn-link text-muted" data-bs-dismiss="modal">Cancel</button>
 					<button id="deleteCommentButton" class="btn btn-danger">Delete comment</button>
 				</div>
-				
 			</div>
 		</div>
 	</div>
diff --git a/files/templates/contact.html b/files/templates/contact.html
index deb6efea5..78ce6c54c 100644
--- a/files/templates/contact.html
+++ b/files/templates/contact.html
@@ -5,7 +5,6 @@
 <meta name="description" content="Contact {{'SITE_NAME' | app_config}} Admins">
 {% endblock %}
 
-	
 {% block content %}
 
 		{% if request.values.get('error') or error %}
diff --git a/files/templates/default.html b/files/templates/default.html
index 211b2afd4..c9a47a38d 100644
--- a/files/templates/default.html
+++ b/files/templates/default.html
@@ -1,18 +1,10 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-	
-	
 	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
-	<script src="/assets/js/general41.js"></script>
 
 	{% if v and v.agendaposter %}
 		<script>
-			/*
-			Bug.js - https://github.com/Auz/Bug
-			Released under MIT-style license.
-			Original Screen Bug http://screen-bug.googlecode.com/git/index.html
-			*/
 			var BugDispatch={options:{minDelay:500,maxDelay:1E4,minBugs:2,maxBugs:20,minSpeed:5,maxSpeed:10,maxLargeTurnDeg:150,maxSmallTurnDeg:10,maxWiggleDeg:5,imageSprite:"fly-sprite.webp",bugWidth:13,bugHeight:14,num_frames:5,zoom:10,canFly:!0,canDie:!0,numDeathTypes:3,monitorMouseMovement:!1,eventDistanceToBug:40,minTimeBetweenMultipy:1E3,mouseOver:"random"},initialize:function(a){this.options=mergeOptions(this.options,a);this.options.minBugs>this.options.maxBugs&&(this.options.minBugs=this.options.maxBugs);
 			this.modes=["multiply","nothing"];this.options.canFly&&this.modes.push("fly","flyoff");this.options.canDie&&this.modes.push("die");-1==this.modes.indexOf(this.options.mouseOver)&&(this.options.mouseOver="random");this.transform=null;this.transforms={Moz:function(a){this.bug.style.MozTransform=a},webkit:function(a){this.bug.style.webkitTransform=a},O:function(a){this.bug.style.OTransform=a},ms:function(a){this.bug.style.msTransform=a},Khtml:function(a){this.bug.style.KhtmlTransform=a},w3c:function(a){this.bug.style.transform=
 			a}};if("transform"in document.documentElement.style)this.transform=this.transforms.w3c;else{var b=["Moz","webkit","O","ms","Khtml"],c=0;for(c=0;c<b.length;c++)if(b[c]+"Transform"in document.documentElement.style){this.transform=this.transforms[b[c]];break}}if(this.transform){this.bugs=[];b="multiply"===this.options.mouseOver?this.options.minBugs:this.random(this.options.minBugs,this.options.maxBugs,!0);c=0;var d=this;for(c=0;c<b;c++){a=JSON.parse(JSON.stringify(this.options));var e=SpawnBug();a.wingsOpen=
@@ -46,8 +38,6 @@
 			this.random(50,300)},bug_near_window_edge:function(){this.near_edge=0;this.bug.top<this.options.edge_resistance?this.near_edge|=this.NEAR_TOP_EDGE:this.bug.top>document.documentElement.clientHeight-this.options.edge_resistance&&(this.near_edge|=this.NEAR_BOTTOM_EDGE);this.bug.left<this.options.edge_resistance?this.near_edge|=this.NEAR_LEFT_EDGE:this.bug.left>document.documentElement.clientWidth-this.options.edge_resistance&&(this.near_edge|=this.NEAR_RIGHT_EDGE);return this.near_edge},getPos:function(){return this.inserted&&
 			this.bug&&this.bug.style?{top:parseInt(this.bug.top,10),left:parseInt(this.bug.left,10)}:null}},SpawnBug=function(){var a={},b;for(b in Bug)Bug.hasOwnProperty(b)&&(a[b]=Bug[b]);return a},mergeOptions=function(a,b,c){"undefined"==typeof c&&(c=!0);a=c?cloneOf(a):a;for(var d in b)b.hasOwnProperty(d)&&(a[d]=b[d]);return a},cloneOf=function(a){if(null==a||"object"!=typeof a)return a;var b=a.constructor(),c;for(c in a)a.hasOwnProperty(c)&&(b[c]=cloneOf(a[c]));return b};
 			window.requestAnimFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a,b){window.setTimeout(a,1E3/60)}}();
-		</script>
-		<script>
 			new BugController({
 				imageSprite: "/assets/images/fly-sprite.webp",
 				canDie: false,
@@ -77,138 +67,7 @@
 
 	{% if v %}
 		<script src="https://js.pusher.com/beams/1.0/push-notifications-cdn.js"></script>
-			
-		<script>
-			const beamsClient = new PusherPushNotifications.Client({
-				instanceId: '02ddcc80-b8db-42be-9022-44c546b4dce6',
-			});		
-			
-			beamsClient
-			.start()
-			.then((beamsClient) => beamsClient.getDeviceId())
-			.then(() => beamsClient.addDeviceInterest('{{v.strid}}'))
-			.then(() => beamsClient.getDeviceInterests())
-			.catch(console.error);
-
-			// Text Formatting
-
-			// Bold Text
-
-			makeBold = function (form) {
-				var text = document.getElementById(form);
-				var startIndex = text.selectionStart,
-				endIndex = text.selectionEnd;
-				var selectedText = text.value.substring(startIndex, endIndex);
-
-				var format = '**'
-
-				if (selectedText.includes('**')) {
-					text.value = selectedText.replace(/\*/g, '');
-					
-				}
-				else if (selectedText.length == 0) {
-					text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
-				}
-				else {
-					text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
-				}
-			}
-
-			// Italicize Comment Text
-
-			makeItalics = function (form) {
-				var text = document.getElementById(form);
-				var startIndex = text.selectionStart,
-				endIndex = text.selectionEnd;
-				var selectedText = text.value.substring(startIndex, endIndex);
-
-				var format = '*'
-
-				if (selectedText.includes('*')) {
-					text.value = selectedText.replace(/\*/g, '');
-					
-				}
-				else if (selectedText.length == 0) {
-					text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
-				}
-				else {
-					text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
-				}
-			}
-
-			// Quote Comment Text
-
-			makeQuote = function (form) {
-				var text = document.getElementById(form);
-				var startIndex = text.selectionStart,
-				endIndex = text.selectionEnd;
-				var selectedText = text.value.substring(startIndex, endIndex);
-
-				var format = '>'
-
-				if (selectedText.includes('>')) {
-					text.value = text.value.substring(0, startIndex) + selectedText.replace(/\>/g, '') + text.value.substring(endIndex);
-					
-				}
-				else if (selectedText.length == 0) {
-					text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
-				}
-				else {
-					text.value = text.value.substring(0, startIndex) + format + selectedText + text.value.substring(endIndex);
-				}
-			}
-
-			function autoExpand (field) {
-
-				//get current scroll position
-				xpos=window.scrollX;
-				ypos=window.scrollY;
-
-				// Reset field height
-				field.style.height = 'inherit';
-
-				// Get the computed styles for the element
-				var computed = window.getComputedStyle(field);
-
-				// Calculate the height
-				var height = parseInt(computed.getPropertyValue('border-top-width'), 10)
-				+ parseInt(computed.getPropertyValue('padding-top'), 10)
-				+ field.scrollHeight
-				+ parseInt(computed.getPropertyValue('padding-bottom'), 10)
-				+ parseInt(computed.getPropertyValue('border-bottom-width'), 10)
-				+ 32;
-
-				field.style.height = height + 'px';
-
-				//keep window position from changing
-				window.scrollTo(xpos,ypos);
-
-			};
-
-
-			document.addEventListener('input', function (event) {
-				if (event.target.tagName.toLowerCase() !== 'textarea') return;
-				autoExpand(event.target);
-			}, false);
-		
-
-			for(let el of document.getElementsByClassName('text-expand')) {
-				el.onclick = function(event){
-					if (event.which != 1) {
-						return
-					};
-					id=this.data('id');
-
-
-					document.getElementById('post-text-'+id).toggleClass('d-none');
-					document.getElementsByClassName('text-expand-icon-'+id)[0].toggleClass('fa-expand-alt');
-					document.getElementsByClassName('text-expand-icon-'+id)[0].toggleClass('fa-compress-alt');
-
-				}
-			}
-
-		</script>
-
+		<script src="/assets/js/default.js"></script>
 	{% endif %}
 
 
@@ -218,7 +77,6 @@
 	<meta name="thumbnail" content="/assets/images/{{'SITE_NAME' | app_config}}/preview.webp">
 
 	<link rel="icon" type="image/png" href="/assets/images/{{'SITE_NAME' | app_config}}/icon.webp">
-	
 	{% block title %}
 	<title>{{'SITE_NAME' | app_config}}</title>
 
@@ -387,7 +245,6 @@
 		/>
 
 
-		
 		{% block stylesheets %}
 
 		{% if v %}
@@ -406,13 +263,10 @@
 		{% endblock %}
 
 		{% if v %}
-
-		<script>
-			function formkey() {
-			return '{{v.formkey}}';
-		}
-	</script>
-	{% endif %}
+			<script>
+				function formkey() {return '{{v.formkey}}';}
+			</script>
+		{% endif %}
 
  </head>
 
@@ -461,7 +315,6 @@
 			{% endblock %}
 
 		</div>
-		
 	</div>
 </div>
 
diff --git a/files/templates/delete_post_modal.html b/files/templates/delete_post_modal.html
index 547151120..2c6573796 100644
--- a/files/templates/delete_post_modal.html
+++ b/files/templates/delete_post_modal.html
@@ -1,7 +1,22 @@
 <script>
-	function delete_postModal(id) {
+	function post(url, callback, errortext) {
+		var xhr = new XMLHttpRequest();
+		xhr.open("POST", url, true);
+		var form = new FormData()
+		form.append("formkey", formkey());
+		xhr.withCredentials=true;
+		xhr.onerror=function() { alert(errortext); };
+		xhr.onload = function() {
+			if (xhr.status >= 200 && xhr.status < 300) {
+				callback();
+			} else {
+				xhr.onerror();
+			}
+		};
+		xhr.send(form);
+	};
 
-		// Passed data for modal
+	function delete_postModal(id) {
 
 		document.getElementById("deletePostButton-mobile").addEventListener("click", delete_post);
 
@@ -31,12 +46,10 @@
 					<span aria-hidden="true"><i class="far fa-times"></i></span>
 				</button>
 			</div>
-			
 			<div class="modal-body text-center">
 
 				<div class="py-4">
 					<i class="fad fa-trash-alt text-muted d-none d-md-block" style="font-size: 3.5rem;"></i>
-					
 					<span class="fa-stack fa-2x text-muted d-md-none">
 						<i class="fas fa-circle text-danger opacity-25 fa-stack-2x"></i>
 						<i class="fas text-danger fa-trash-alt fa-stack-1x"></i>
@@ -58,12 +71,10 @@
 				</div>
 
 			</div>
-			
 			<div class="modal-footer d-none d-md-flex">
 				<button type="button" class="btn btn-link text-muted" data-bs-dismiss="modal">Cancel</button>
 				<button type="button" id="deletePostButton" class="btn btn-danger">Delete post</button>
 			</div>
-			
 		</div>
 	</div>
 </div>
diff --git a/files/templates/email/default.html b/files/templates/email/default.html
index 6aef9ce38..1126e57e2 100644
--- a/files/templates/email/default.html
+++ b/files/templates/email/default.html
@@ -7,7 +7,6 @@
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 		<title></title>
 		<style type="text/css" rel="stylesheet" media="all">
-		/* Base ------------------------------ */
 		
 		@import url('https://fonts.googleapis.com/css?family=Roboto:400,500&display=swap');
 
@@ -21,19 +20,15 @@
 			margin: 0;
 			-webkit-text-size-adjust: none;
 		}
-		
 		a {
 			color: #FF66AC!important;
 		}
-		
 		a img {
 			border: none;
 		}
-		
 		td {
 			word-break: break-word;
 		}
-		
 		.preheader {
 			display: none !important;
 			visibility: hidden;
@@ -45,14 +40,12 @@
 			opacity: 0;
 			overflow: hidden;
 		}
-		/* Type ------------------------------ */
 		
 		body,
 		td,
 		th {
 			font-family: "Roboto", Helvetica, Arial, sans-serif;
 		}
-		
 		h1 {
 			margin-top: 0;
 			color: #121213;
@@ -60,7 +53,6 @@
 			font-weight: bold;
 			text-align: left;
 		}
-		
 		h2 {
 			margin-top: 0;
 			color: #121213;
@@ -68,7 +60,6 @@
 			font-weight: bold;
 			text-align: left;
 		}
-		
 		h3 {
 			margin-top: 0;
 			color: #121213;
@@ -76,12 +67,10 @@
 			font-weight: bold;
 			text-align: left;
 		}
-		
 		td,
 		th {
 			font-size: 1rem;
 		}
-		
 		p,
 		ul,
 		ol,
@@ -90,24 +79,19 @@
 			font-size: 1rem;
 			line-height: 1.625;
 		}
-		
 		p.sub {
 			font-size: 13px;
 		}
-		/* Utilities ------------------------------ */
 		
 		.align-right {
 			text-align: right;
 		}
-		
 		.align-left {
 			text-align: left;
 		}
-		
 		.align-center {
 			text-align: center;
 		}
-		/* Buttons ------------------------------ */
 		
 		.button {
 			background-color: #FF66AC;
@@ -122,7 +106,6 @@
 			-webkit-text-size-adjust: none;
 			box-sizing: border-box;
 		}
-		
 		.button--green {
 			background-color: #23CE6B;
 			border-top: 10px solid #23CE6B;
@@ -130,7 +113,6 @@
 			border-bottom: 10px solid #23CE6B;
 			border-left: 18px solid #23CE6B;
 		}
-		
 		.button--red {
 			background-color: #F05D5E;
 			border-top: 10px solid #F05D5E;
@@ -138,29 +120,24 @@
 			border-bottom: 10px solid #F05D5E;
 			border-left: 18px solid #F05D5E;
 		}
-		
 		@media only screen and (max-width: 500px) {
 			.button {
 				width: 100% !important;
 				text-align: center !important;
 			}
 		}
-		/* Attribute list ------------------------------ */
 		
 		.attributes {
 			margin: 0 0 21px;
 		}
-		
 		.attributes_content {
 			background-color: #EDF2F7;
 			padding: 1rem;
 			border-radius: 0.35rem;
 		}
-		
 		.attributes_item {
 			padding: 0;
 		}
-		/* Related Items ------------------------------ */
 		
 		.related {
 			width: 100%;
@@ -170,30 +147,25 @@
 			-premailer-cellpadding: 0;
 			-premailer-cellspacing: 0;
 		}
-		
 		.related_item {
 			padding: 10px 0;
 			color: #CBCCCF;
 			font-size: 15px;
 			line-height: 18px;
 		}
-		
 		.related_item-title {
 			display: block;
 			margin: .5em 0 0;
 		}
-		
 		.related_item-thumb {
 			display: block;
 			padding-bottom: 10px;
 		}
-		
 		.related_heading {
 			border-top: 1px solid #CBCCCF;
 			text-align: center;
 			padding: 25px 0 10px;
 		}
-		/* Discount Code ------------------------------ */
 		
 		.discount {
 			width: 100%;
@@ -205,32 +177,26 @@
 			background-color: #EDF2F7;
 			border: 2px dashed #CBCCCF;
 		}
-		
 		.discount_heading {
 			text-align: center;
 		}
-		
 		.discount_body {
 			text-align: center;
 			font-size: 15px;
 		}
-		/* Social Icons ------------------------------ */
 		
 		.social {
 			width: auto;
 		}
-		
 		.social td {
 			padding: 0;
 			width: auto;
 		}
-		
 		.social_icon {
 			height: 20px;
 			margin: 0 8px 10px 8px;
 			padding: 0;
 		}
-		/* Data table ------------------------------ */
 		
 		.purchase {
 			width: 100%;
@@ -240,7 +206,6 @@
 			-premailer-cellpadding: 0;
 			-premailer-cellspacing: 0;
 		}
-		
 		.purchase_content {
 			width: 100%;
 			margin: 0;
@@ -249,54 +214,44 @@
 			-premailer-cellpadding: 0;
 			-premailer-cellspacing: 0;
 		}
-		
 		.purchase_item {
 			padding: 10px 0;
 			color: #121213;
 			font-size: 15px;
 			line-height: 18px;
 		}
-		
 		.purchase_heading {
 			padding-bottom: 8px;
 			border-bottom: 1px solid #E6E6E6;
 		}
-		
 		.purchase_heading p {
 			margin: 0;
 			color: #85878E;
 			font-size: 12px;
 		}
-		
 		.purchase_footer {
 			padding-top: 15px;
 			border-top: 1px solid #E6E6E6;
 		}
-		
 		.purchase_total {
 			margin: 0;
 			text-align: right;
 			font-weight: bold;
 			color: #121213;
 		}
-		
 		.purchase_total--label {
 			padding: 0 15px 0 0;
 		}
-		
 		body {
 			background-color: #EDF2F7;
 			color: #121213;
 		}
-		
 		p {
 			color: #121213;
 		}
-		
 		p.sub {
 			color: #6B6E76;
 		}
-		
 		.email-wrapper {
 			width: 100%;
 			margin: 0;
@@ -306,7 +261,6 @@
 			-premailer-cellspacing: 0;
 			background-color: #EDF2F7;
 		}
-		
 		.email-content {
 			width: 100%;
 			margin: 0;
@@ -315,23 +269,19 @@
 			-premailer-cellpadding: 0;
 			-premailer-cellspacing: 0;
 		}
-		/* Masthead ----------------------- */
 		
 		.email-masthead {
 			display: none;
 		}
-		
 		.email-masthead_logo {
 			width: 94px;
 		}
-		
 		.email-masthead_name {
 			font-size: 1.25rem;
 			font-weight: bold;
 			color: #121213;
 			text-decoration: none;
 		}
-		/* Body ------------------------------ */
 		
 		.email-body {
 			width: 100%;
@@ -342,7 +292,6 @@
 			-premailer-cellspacing: 0;
 			background-color: #cfcfcf;
 		}
-		
 		.email-body_inner {
 			width: 570px;
 			margin: 0 auto;
@@ -352,7 +301,6 @@
 			-premailer-cellspacing: 0;
 			background-color: #cfcfcf;
 		}
-		
 		.email-footer {
 			width: 570px;
 			margin: 0 auto;
@@ -362,11 +310,9 @@
 			-premailer-cellspacing: 0;
 			text-align: center;
 		}
-		
 		.email-footer p {
 			color: #6B6E76;
 		}
-		
 		.body-action {
 			width: 100%;
 			margin: 30px auto;
@@ -376,17 +322,14 @@
 			-premailer-cellspacing: 0;
 			text-align: center;
 		}
-		
 		.body-sub {
 			margin-top: 25px;
 			padding-top: 25px;
 			border-top: 1px solid #E6E6E6;
 		}
-		
 		.content-cell {
 			padding: 35px;
 		}
-		/*Media Queries ------------------------------ */
 		
 		@media only screen and (max-width: 600px) {
 			.email-body_inner,
@@ -394,7 +337,6 @@
 				width: 100% !important;
 			}
 		}
-		
 		@media (prefers-color-scheme: dark) {
 			body,
 			.email-body,
diff --git a/files/templates/emoji_modal.html b/files/templates/emoji_modal.html
index 6b3ebe61f..ae3133018 100644
--- a/files/templates/emoji_modal.html
+++ b/files/templates/emoji_modal.html
@@ -11,121 +11,13 @@
 			margin: 1.75rem auto !important;
 		}
 	}
-	
 	.emoji:focus {
 		border: 1px solid var(--primary) !important;
 	}
 </style>
 
-<script>
-	var commentFormID;
-	function commentForm(form) {
-			commentFormID = form;
-	};
+<script src="/assets/js/emoji_modal.js"></script>
 
-	const TEXTAREA_POS_ATTR = 'data-curr-pos'
-
-	// Insert EMOJI markdown into comment box function
-
-	function getEmoji(searchTerm, form) {
-		const commentBox = document.getElementById(form);
-		const old = commentBox.value;
-		const curPos = parseInt(commentBox.getAttribute(TEXTAREA_POS_ATTR));
-
-		const firstHalf = old.slice(0, curPos)
-		const lastHalf = old.slice(curPos)
-
-		let emoji = ':' + searchTerm + ':'
-		const previousChar = firstHalf.slice(-1)
-		if (firstHalf.length > 0 && previousChar !== " " && previousChar !== "\n") {
-			emoji = " " + emoji
-		}
-		if (lastHalf.length > 0 && lastHalf[0] !== " ") {
-			emoji = emoji + " "
-		}
-
-		commentBox.value = firstHalf + emoji + lastHalf;
-
-		const newPos = curPos + emoji.length
-
-		commentBox.setAttribute(TEXTAREA_POS_ATTR, newPos);
-	}
-
-	function loadEmojis(form) {
-
-		const emojis = [
-		{
-			type:'marsey',
-			emojis: ['marseywhirlyhat','marsey173','marseycthulhu','marseycuck','marseyemperor','marseyface','marseyjohnson','marseykneel','marseymummy','marseymummy2','marseypanda','marseypumpkin','marseyskeletor','marseystein','marseyvampire','marseyvengeance','marseywitch3','marseylong1','marseylong2','marseylong3','marseypop','marseyqueenlizard','marseyagree','marseybane','marseybog','marseybux','marseycommitted','marseydisagree','marseydizzy','marseyfunko','marseyhealthy','marseykaiser','marseykyle','marseymask','marseymeds','marseykvlt','marseyn8','marseynietzsche','marseyobey','marseypatriot','marseypedo','marseypony','marseypuke','marseyqueen','marseyrage','marseysnek','marseytinfoil','marseywitch2','marseycenter','marseyauthleft','marseyauthright','marseylibleft','marseylibright','marseybinladen','marseycool','marseyjanny2','marseyjones','marseynapoleon','marseysanders','marseyshrug','marseysnoo','marseysoypoint','marseybiting','marseyblush','marseybountyhunter','marseycoonass','marseyfinger','marseyglancing','marseyhappy','marseyhearts','marseyluther','marseypizzashill','marseypokerface','marseypopcorn','marseyrasta','marseysad2','marseysmirk','marseysurprised','marseythomas','marseywitch','marseyyawn','marcusfootball','marje','marmsey','marsey1984','marsey420','marsey4chan','marsey69','marseyakshually','marseyandmarcus','marseyangel','marseyasian','marseybattered','marseybiden','marseybingus','marseyblm','marseyblowkiss','marseybluecheck','marseybong','marseybooba','marseyboomer','marseybrainlet','marseybride','marseyburger','marseybush','marseycamus','marseycanned','marseycarp','marseycatgirl','marseychef','marseychonker','marseychu','marseyclown','marseycomrade','marseyconfused','marseycoomer','marseycop','marseycope','marseycorn','marseycowboy','marseycry','marseycumjar1','marseycumjar2','marseycumjar3','marseycwc','marseydead','marseydepressed','marseydespair','marseydeux','marseydildo','marseydoomer','marseydrunk','marseydynamite','marseyexcited','marseyeyeroll','marseyfacepalm','marseyfamily','marseyfbi','marseyfeet','marseyfeminist','marseyflamethrower','marseyflamewar','marseyfloyd','marseyfug','marseygasp','marseyghost','marseygift','marseygigaretard','marseygigavaxxer','marseyglam','marseyglow','marseygodfather','marseygoodnight','marseygrass','marseygrilling','marseyhacker','marseyhmm','marseyhmmm','marseyilluminati','marseyinabox','marseyira','marseyisis','marseyjam','marseyjamming','marseyjanny','marseyjunkie','marseyking','marseykkk','marseylaugh','marseylawlz','marseylifting','marseylizard','marseylolcow','marseylove','marseymad','marseymanlet','marseymaoist','marseymcarthur','marseymerchant','marseymermaid','marseymommy','marseymouse','marseymyeisha','marseyneckbeard','marseyniqab','marseynpc','marseynun','marseynut','marseyorthodox','marseyowow','marseypainter','marseypanties','marseyparty','marseypat','marseypeacekeeper','marseypharaoh','marseypickle','marseypinochet','marseypipe','marseypirate','marseypoggers','marseypope','marseyproctologist','marseypsycho','marseyqoomer','marseyradioactive','marseyrain','marseyrat','marseyreading','marseyready','marseyrealwork','marseyreich','marseyrentfree','marseyretard','marseyrick','marseyrope','marseyrowling','marseysad','marseysadcat','marseyscarf','marseyschizo','marseyseethe','marseyshisha','marseyshook','marseysick','marseysleep','marseysmug','marseysneed','marseysociety','marseyspider','marseysrdine','marseystroke','marseysus','marseytaliban','marseytank','marseytankushanka','marseytea','marseythonk','marseythumbsup','marseytrain','marseysipping','marseytrans','marseytrans2','marseytroll','marseytrump','marseytwerking','marseyunabomber','marseyuwuw','marseyvan','marseyvaxmaxx','marseywave','marseyworried','marseyxd','marseyyeezus','marseyzoomer','marseyzwei','marsoy','marsoyhype']
-		},
-		{
-			type:'platy',
-			emojis: ['platyabused','platyblizzard','platyboxer','platydevil','platyfear','platygirlmagic','platygolong','platyhaes','platyking','platylove','platyneet','platyold','platypatience','platypopcorn','platyrich','platysarcasm','platysilly','platysleeping','platythink','platytired','platytuxedomask','platyblush','platybruh','platycaveman','platycheer','platydown','platyeyes','platyheart','platylol','platymicdrop','platynooo','platysalute','platyseethe','platythumbsup','platywave']
-		},
-		{
-			type:'tay',
-			emojis: ['tayaaa','tayadmire','taycat','taycelebrate','taychefkiss','taychristmas','tayclap','taycold','taycrown','tayflex','tayflirt','taygrimacing','tayhappy','tayheart','tayhmm','tayhuh','tayhyperdab','tayjammin','taylaugh','taymindblown','tayno','taynod','taypeace','taypray','tayrun','tayscrunch','tayshake','tayshrug','taysilly','tayslide','taysmart','taystop','taytantrum','taytea','taythink','tayvibin','taywhat','taywine','taywine2','taywink','tayyes']
-		},
-		{
-			type:'classic',
-			emojis: ['2thumbsup','aliendj','ambulance','angry','angrywhip','argue','aroused','ashamed','badass','banana','band','banghead','batman','bigeyes','bite','blind','blowkiss','blush','bong','bounce','bow','breakheart','bs','cartwheel','cat','celebrate','chainsaw','cheers','clap','cold','confused','crazyeyes','cry','cthulhu','cute','D','daydream','ddr','deadpool','devilsmile','diddle','die','distress','disturbing','dizzy','domo','doughboy','drink','drool','dudeweedlmao','edward','electro','elephant','embarrassed','emo','emo2','evil','evilclown','evilgrin','facepalm','fap','flamethrower','flipbird','flirt','frown','gasp','glomp','go','gooby','grr','gtfo','guitar','haha','handshake','happydance','headbang','heart','heartbeat','hearts','highfive','hmm','hmph','holdhands','horny','hug','hugging','hugs','hump','humpbed','hysterical','ily','inlove','jason','jawdrop','jedi','jester','kaboom','kick','kiss','kitty','laughchair','lick','link','lol','lolbeat','loving','makeout','medal','megaman','megamanguitar','meow','metime','mooning','mummy','na','nauseous','nervous','ninja','nod','nono','omg','onfire','ooo','orly','p','paddle','panda','pandabutt','paranoid','party','pat','peek','pikachu','pimp','plzdie','poke','popcorn','pout','probe','puke','punch','quote','raccoon','roar','rofl','roflmao','rolleyes','sad','sadeyes','sadhug','samurai','sarcasm','scoot','scream','shmoopy','shrug','skull','slap','slapfight','sleepy','smackfish','smackhead','smh','smile','smoke','sonic','spank','sparta','sperm','spiderman','stab','star','stare','stfu','suicide','surprisehug','suspicious','sweat','swordfight','taco','talk2hand','tantrum','teehee','thinking','threesome','throw','throwaway','tickle','typing','uhuh','vampbat','viking','violin','vulgar','wah','wat','whip','whipping','wink','witch','wizard','woah','worm','woo','work','worship','wow','XD','yay','zzz']
-		},
-		{
-			type:'rage',
-			emojis: ['troll','bitchplease','spit','challengeaccepted','contentiouscereal','cryingatcuteness','derp','derpcornsyrup','derpcrying','derpcute','derpdumb','derpeuphoria','derpinahd','derpinapokerface','derpinasnickering','derpprocessing','derprealization','derpsnickering','derptalking','derpthinking','derpthumbsup','derpunimpressed','derpwhy','donotwant','epicfacefeatures','fancywithwine','fffffffuuuuuuuuuuuu','flipthetable','foreveralone','foreveralonehappy','hewillnever','idontknow','interuptedreading','iseewhatyoudidthere','killherkillher','ledesire','leexcited','legenius','lelolidk','lemiddlefinger','lemindblown','leokay','lepanicrunning','lepokerface','lepokerface2','lerageface','leseriousface','likeaboss','lolface','longwhiskers','manymiddlefingers','megusta','motherfucker','motherofgod','mysides','ohgodwhy','pervertedspiderman','picard','ragestrangle','rukiddingme','tfwyougettrolled','trollolol','truestorybro','xallthey','yuno']
-		},
-		{
-			type:'wojak',
-			emojis: ['gigachad','gigachad2','chadyes','chadno','abusivewife','ancap','bardfinn','bloomer','boomer','boomermonster','brainletbush','brainletcaved','brainletchair','brainletchest','brainletmaga','brainletpit','chad','chadarab','chadasian','chadblack','chadjesus','chadjew','chadjihadi','chadlatino','chadlibleft','chadnordic','chadsikh','chadusa','coomer','doomer','doomerfront','doomergirl','ethot','fatbrain','fatpriest','femboy','gogetter','grug','monke','nazijak','npc','npcfront','npcmaga','psychojak','ragejak','ragemask','ramonajak','soyjackwow','soyjak','soyjakfront','soyjakhipster','soyjakmaga','soyjakyell','tomboy','zoomer','zoomersoy']
-		},
-		{
-			type:'flags',
-			emojis: ['niger', 'lgbt', 'saudi', 'animesexual','blacknation','blm','blueline','dreamgender','fatpride','incelpride','israel','kazakhstan','landlordlove','scalperpride','superstraight','trans','translord','transracial','usa']
-		}
-		]
-
-		let search_bar = document.getElementById("emoji_search");
-		let search_container = document.getElementById('emoji-tab-search')
-
-		if(search_bar.value == ""){
-			let container = document.getElementById(`EMOJIS_favorite`)
-			container.innerHTML = container.innerHTML.replace(/@form@/g, form)
-
-			const commentBox = document.getElementById(form);
-			commentBox.setAttribute(TEXTAREA_POS_ATTR, commentBox.selectionStart);
-
-			for (i=0; i < emojis.length; i++) {
-
-				let container = document.getElementById(`EMOJIS_${emojis[i].type}`)
-				let str = ''
-				let arr = emojis[i].emojis
-
-				for (j=0; j < arr.length; j++) {
-					if(arr[j].match(search_bar.value)){
-						str += `<button class="btn m-1 px-0 emoji" onclick="getEmoji(\'${arr[j]}\', \'${form}\')" style="background: None!important; width:60px; overflow: hidden; border: none;" data-bs-toggle="tooltip" title=":${arr[j]}:" delay:="0"><img loading="lazy" width=50 src="/assets/images/emojis/${arr[j]}.webp" alt="${arr[j]}-emoji"/></button>`;
-					}
-				}
-
-				container.innerHTML = str
-				search_container.innerHTML = ""
-			}
-		}else{
-			let str = ''
-			for (i=0; i < emojis.length; i++) {
-				let arr = emojis[i].emojis
-				let container = document.getElementById(`EMOJIS_${emojis[i].type}`)
-				for (j=0; j < arr.length; j++) {
-					if(arr[j].match(search_bar.value.toLowerCase())){
-					str += `<button class="btn m-1 px-0 emoji" onclick="getEmoji(\'${arr[j]}\', \'${form}\')" style="background: None!important; width:60px; overflow: hidden; border: none;" data-bs-toggle="tooltip" title=":${arr[j]}:" delay:="0"><img loading="lazy" width=50 src="/assets/images/emojis/${arr[j]}.webp" alt="${arr[j]}-emoji"/></button>`;
-					}
-				}
-				container.innerHTML = ""
-			}
-			search_container.innerHTML = str
-		}
-		search_bar.oninput = function(){loadEmojis(form);};
-	}
-</script>
 <!-- Emoji Selection Modal -->
 <div id="form" class="d-none"></div>
 <div class="modal fade" id="emojiModal" tabindex="-1" role="dialog" aria-labelledby="emojiModalTitle" aria-hidden="true">
diff --git a/files/templates/expanded_image_modal.html b/files/templates/expanded_image_modal.html
index 078e1db1e..ba50fb6aa 100644
--- a/files/templates/expanded_image_modal.html
+++ b/files/templates/expanded_image_modal.html
@@ -14,12 +14,8 @@
 		}
 	}
 
-	// Expand Images on Desktop
-
 	function expandDesktopImage(image) {
 
-		// Link text
-
 		var linkText = document.getElementById("desktop-expanded-image-link");
 		var imgLink = document.getElementById("desktop-expanded-image-wrap-link");
 
@@ -50,7 +46,6 @@
 					</div>
 				</div>
 			</div>
-			
 		</div>
 	</div>
 </div>
diff --git a/files/templates/formatting.html b/files/templates/formatting.html
index 2efafc3f0..f1b44e60e 100644
--- a/files/templates/formatting.html
+++ b/files/templates/formatting.html
@@ -192,6 +192,4 @@ Allowed styles:
 
 {% include "expanded_image_modal.html" %}
 
-<script src="/assets/js/general41.js"></script>
-
 {% endblock %}
diff --git a/files/templates/gif_modal.html b/files/templates/gif_modal.html
index a5855e48c..e37121b42 100644
--- a/files/templates/gif_modal.html
+++ b/files/templates/gif_modal.html
@@ -1,144 +1,4 @@
-<script>
-	
-
-	// Identify which comment form to insert GIF int
-
-	async function getGif(searchTerm) {
-
-		if (searchTerm !== undefined) {
-			document.getElementById('gifSearch').value = searchTerm;
-		}
-		else {
-			document.getElementById('gifSearch').value = null;
-		}
-
-		// load more gifs div
-
-		var loadGIFs = document.getElementById('gifs-load-more');
-
-		// error message div
-
-		var noGIFs = document.getElementById('no-gifs-found');
-
-		// categories div
-
-		var cats = document.getElementById('GIFcats');
-
-		// container div
-
-		var container = document.getElementById('GIFs');
-
-		// modal body div
-
-		var modalBody = document.getElementById('gif-modal-body')
-
-		// UI buttons
-
-		var backBtn = document.getElementById('gifs-back-btn');
-
-		var cancelBtn = document.getElementById('gifs-cancel-btn');
-
-		container.innerHTML = '';
-
-		if (searchTerm == undefined) {
-			container.innerHTML = '<div class="card" onclick="getGif(\'agree\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Agree</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/wGhYz3FHaRJgk/200w_d.webp"> </div> <div class="card" onclick="getGif(\'laugh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Laugh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/O5NyCibf93upy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'confused\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Confused</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o7btPCcdNniyf0ArS/200w_d.webp"> </div> <div class="card" onclick="getGif(\'sad\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Sad</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/ISOckXUybVfQ4/200w_d.webp"> </div> <div class="card" onclick="getGif(\'happy\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Happy</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/XR9Dp54ZC4dji/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awesome\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awesome</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3ohzdIuqJoo8QdKlnW/200w_d.webp"> </div> <div class="card" onclick="getGif(\'yes\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Yes</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/J336VCs1JC42zGRhjH/200w_d.webp"> </div> <div class="card" onclick="getGif(\'no\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">No</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1zSz5MVw4zKg0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'love\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Love</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/4N1wOi78ZGzSB6H7vK/200w_d.webp"> </div> <div class="card" onclick="getGif(\'please\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Please</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/qUIm5wu6LAAog/200w_d.webp"> </div> <div class="card" onclick="getGif(\'scared\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Scared</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/bEVKYB487Lqxy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'angry\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Angry</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/12Pb87uq0Vwq2c/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awkward\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awkward</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/unFLKoAV3TkXe/200w_d.webp"> </div> <div class="card" onclick="getGif(\'cringe\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Cringe</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1jDvQyhGd3L2g/200w_d.webp"> </div> <div class="card" onclick="getGif(\'omg\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">OMG</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o72F8t9TDi2xVnxOE/200w_d.webp"> </div> <div class="card" onclick="getGif(\'why\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Why</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1M9fmo1WAFVK0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'gross\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Gross</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/pVAMI8QYM42n6/200w_d.webp"> </div> <div class="card" onclick="getGif(\'meh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Meh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/xT77XTpyEzJ4OJO06c/200w_d.webp"> </div>'
-
-			backBtn.innerHTML = null;
-
-			cancelBtn.innerHTML = null;
-
-			noGIFs.innerHTML = null;
-
-			loadGIFs.innerHTML = null;
-		}
-		else {
-			backBtn.innerHTML = '<button class="btn btn-link pl-0 pr-3" id="gifs-back-btn" onclick="getGif();"><i class="fas fa-long-arrow-left text-muted ml-3"></i></button>';
-
-			cancelBtn.innerHTML = '<button class="btn btn-link pl-3 pr-0" id="gifs-cancel-btn" onclick="getGif();"><i class="fas fa-times text-muted"></i></button>';
-
-			let response = await fetch("/giphy?searchTerm=" + searchTerm + "&limit=48");
-			let data = await response.json()
-			var max = data.length - 1 //length of response, minus 1 (cuz array starts at index 0)
-			data = data.data
-			// GIF array
-			var gifURL = [];
-
-			if (max <= 0) {
-				noGIFs.innerHTML = '<div class="text-center py-3 mt-3"><div class="mb-3"><i class="fad fa-frown text-gray-500" style="font-size: 3.5rem;"></i></div><p class="font-weight-bold text-gray-500 mb-0">Aw shucks. No GIFs found...</p></div>';
-				container.innerHTML = null;
-				loadGIFs.innerHTML = null;
-			}
-			else {
-				for (var i = 0; i < 48; i++) {
-				gifURL[i] = "https://media.giphy.com/media/" + data[i].id + "/200w_d.webp";
-				if (data[i].username==''){
-					container.innerHTML += ('<div class="card bg-white" style="overflow: hidden" data-bs-dismiss="modal" aria-label="Close" onclick="insertGIF(\'' + 'https://media.giphy.com/media/' + data[i].id + '/200w_d.webp' + '\',\'' + commentFormID + '\')"><div class="gif-cat-overlay"></div><img loading="lazy" class="img-fluid" src="' + gifURL[i] + '"></div>');
-				}
-				else {
-					container.innerHTML += ('<div class="card bg-white" style="overflow: hidden" data-bs-dismiss="modal" aria-label="Close" title="by '+data[i].username+' on GIPHY" onclick="insertGIF(\'' + 'https://media.giphy.com/media/' + data[i].id + '/200w_d.webp' + '\',\'' + commentFormID + '\')"><div class="gif-cat-overlay"></div><img loading="lazy" class="img-fluid" src="' + gifURL[i] + '"></div>');
-				}
-				noGIFs.innerHTML = null;
-				loadGIFs.innerHTML = '<div class="text-center py-3"><div class="mb-3"><i class="fad fa-grin-beam-sweat text-gray-500" style="font-size: 3.5rem;"></i></div><p class="font-weight-bold text-gray-500 mb-0">Thou&#39;ve reached the end of the list!</p></div>';
-				}
-			}
-		}
-	}
-
-	function insertGIF(url,form) {
-
-		var gif = "![](" + url +")";
-
-		var commentBox = document.getElementById(form);
-
-		var old	= commentBox.value;
-
-		commentBox.value = old + gif;
-
-		}
-
-		// When GIF keyboard is hidden, hide all GIFs
-
-		document.getElementById('gifModal').addEventListener('hidden.bs.modal', function (e) {
-
-		document.getElementById('gifSearch').value = null;
-
-		// load more gifs div
-
-		var loadGIFs = document.getElementById('gifs-load-more');
-
-		// no GIFs div
-
-		var noGIFs = document.getElementById('no-gifs-found');
-
-		// container div
-
-		var container = document.getElementById('GIFs');
-
-		// UI buttons
-
-		var backBtn = document.getElementById('gifs-back-btn');
-
-		var cancelBtn = document.getElementById('gifs-cancel-btn');
-
-		// Remove inner HTML from container var
-
-		container.innerHTML = '<div class="card" onclick="getGif(\'agree\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Agree</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/wGhYz3FHaRJgk/200w_d.webp"> </div> <div class="card" onclick="getGif(\'laugh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Laugh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/O5NyCibf93upy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'confused\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Confused</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o7btPCcdNniyf0ArS/200w_d.webp"> </div> <div class="card" onclick="getGif(\'sad\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Sad</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/ISOckXUybVfQ4/200w_d.webp"> </div> <div class="card" onclick="getGif(\'happy\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Happy</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/XR9Dp54ZC4dji/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awesome\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awesome</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3ohzdIuqJoo8QdKlnW/200w_d.webp"> </div> <div class="card" onclick="getGif(\'yes\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Yes</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/J336VCs1JC42zGRhjH/200w_d.webp"> </div> <div class="card" onclick="getGif(\'no\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">No</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1zSz5MVw4zKg0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'love\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Love</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/4N1wOi78ZGzSB6H7vK/200w_d.webp"> </div> <div class="card" onclick="getGif(\'please\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Please</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/qUIm5wu6LAAog/200w_d.webp"> </div> <div class="card" onclick="getGif(\'scared\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Scared</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/bEVKYB487Lqxy/200w_d.webp"> </div> <div class="card" onclick="getGif(\'angry\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Angry</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/12Pb87uq0Vwq2c/200w_d.webp"> </div> <div class="card" onclick="getGif(\'awkward\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Awkward</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/unFLKoAV3TkXe/200w_d.webp"> </div> <div class="card" onclick="getGif(\'cringe\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Cringe</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1jDvQyhGd3L2g/200w_d.webp"> </div> <div class="card" onclick="getGif(\'omg\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">OMG</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/3o72F8t9TDi2xVnxOE/200w_d.webp"> </div> <div class="card" onclick="getGif(\'why\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Why</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/1M9fmo1WAFVK0/200w_d.webp"> </div> <div class="card" onclick="getGif(\'gross\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Gross</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/pVAMI8QYM42n6/200w_d.webp"> </div> <div class="card" onclick="getGif(\'meh\');" style="overflow: hidden;"> <div class="gif-cat-overlay"> <div style="position: relative;top: 50%;transform: translateY(-50%);color: #ffffff;font-weight: bold;">Meh</div> </div> <img loading="lazy" class="img-fluid" src="https://media.giphy.com/media/xT77XTpyEzJ4OJO06c/200w_d.webp"> </div>'
-
-		// Hide UI buttons
-
-		backBtn.innerHTML = null;
-
-		cancelBtn.innerHTML = null;
-
-		// Remove inner HTML from no gifs div
-
-		noGIFs.innerHTML = null;
-
-		// Hide no more gifs div
-
-		loadGIFs.innerHTML = null;
-	});
-</script>
+<script src="/assets/js/gif_modal.js"></script>
 
 <!-- GIF Selection Modal - Powered by GIPHY -->
 <div class="modal fade" id="gifModal" tabindex="-1" role="dialog" aria-labelledby="gifModalTitle" aria-hidden="true">
diff --git a/files/templates/header.html b/files/templates/header.html
index 11b5ef45b..2cf8a4513 100644
--- a/files/templates/header.html
+++ b/files/templates/header.html
@@ -1,5 +1,7 @@
 <!-- Navigation -->
 
+<script src="/assets/js/header.js"></script>
+
 <nav class="shadow shadow-md fixed-top">
 	{% if "rdrama" in request.host %}
 		<div id="srd" style="width: 100%; background-color: var(--primary); padding: 2px; text-align: center; font-weight: bold;">
diff --git a/files/templates/home.html b/files/templates/home.html
index 4e5843c34..8a0236992 100644
--- a/files/templates/home.html
+++ b/files/templates/home.html
@@ -132,4 +132,16 @@
 	</ul>
 </nav>
 {% endif %}
+{% if v %}
+	<script>
+		const beamsClient = new PusherPushNotifications.Client({
+			instanceId: '02ddcc80-b8db-42be-9022-44c546b4dce6',
+		});		
+		beamsClient.start()
+		.then((beamsClient) => beamsClient.getDeviceId())
+		.then(() => beamsClient.addDeviceInterest('{{v.strid}}'))
+		.then(() => beamsClient.getDeviceInterests())
+		.catch(console.error);
+	</script>
+{% endif %}
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/home_comments.html b/files/templates/home_comments.html
index efceaddd1..8b8d7a3a5 100644
--- a/files/templates/home_comments.html
+++ b/files/templates/home_comments.html
@@ -66,7 +66,6 @@
 
 
 {% endblock %}
-		
 
 {% block pagenav %}
 <nav aria-label="Page navigation">
diff --git a/files/templates/login.html b/files/templates/login.html
index 8e02a0eb8..21d67eb70 100644
--- a/files/templates/login.html
+++ b/files/templates/login.html
@@ -12,7 +12,6 @@
 		{% block title %}
 		<title>Login -	{{'SITE_NAME' | app_config}}</title>
 		{% endblock %}
-		
 		<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600&display=swap" rel="stylesheet">
 
 		<!-- Font Awesome -->
@@ -122,7 +121,6 @@
 
 
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
-<script src="/assets/js/general41.js"></script>
 
 
 <pre>
diff --git a/files/templates/login_2fa.html b/files/templates/login_2fa.html
index c1f0aafa4..f0ec3c8bf 100644
--- a/files/templates/login_2fa.html
+++ b/files/templates/login_2fa.html
@@ -75,7 +75,6 @@
 												<label for="2fa_token" class="mt-3">Your verification code</label>
 
 												<input class="form-control" id="2fa_token" name="2fa_token" type="text" placeholder="6-digit code">
-												
 												<small><a href="/lost_2fa">Lost your 2FA device?</a></small>
 
 												<button class="btn btn-primary login w-100 mt-3" id="login_button">Sign in</button>
diff --git a/files/templates/mobile_navigation_bar.html b/files/templates/mobile_navigation_bar.html
index 0a4008cbc..5aac25ff5 100644
--- a/files/templates/mobile_navigation_bar.html
+++ b/files/templates/mobile_navigation_bar.html
@@ -4,58 +4,7 @@
 	}
 </style>
 
-<script>
-	// Mobile bottom navigation bar
-
-	window.onload = function () {
-		var prevScrollpos = window.pageYOffset;
-		window.onscroll = function () {
-			var currentScrollPos = window.pageYOffset;
-
-			var topBar = document.getElementById("fixed-bar-mobile");
-
-			var bottomBar = document.getElementById("mobile-bottom-navigation-bar");
-
-			var dropdown = document.getElementById("mobileSortDropdown");
-
-			var navbar = document.getElementById("navbar");
-
-			if (bottomBar != null) {
-				if (prevScrollpos > currentScrollPos && (window.innerHeight + currentScrollPos) < (document.body.offsetHeight - 65)) {
-					bottomBar.style.bottom = "0px";
-				} 
-				else if (currentScrollPos <= 125 && (window.innerHeight + currentScrollPos) < (document.body.offsetHeight - 65)) {
-					bottomBar.style.bottom = "0px";
-				}
-				else if (prevScrollpos > currentScrollPos && (window.innerHeight + currentScrollPos) >= (document.body.offsetHeight - 65)) {
-					bottomBar.style.bottom = "-50px";
-				}
-				else {
-					bottomBar.style.bottom = "-50px";
-				}
-			}
-
-			// Execute if bottomBar exists
-
-			if (topBar != null && dropdown != null) {
-				if (prevScrollpos > currentScrollPos) {
-					topBar.style.top = "48px";
-					navbar.classList.remove("shadow");
-				} 
-				else if (currentScrollPos <= 125) {
-					topBar.style.top = "48px";
-					navbar.classList.remove("shadow");
-				}
-				else {
-					topBar.style.top = "-48px";
-					dropdown.classList.remove('show');
-					navbar.classList.add("shadow");
-				}
-			}
-			prevScrollpos = currentScrollPos;
-		}
-	}
-</script>
+<script src="/assets/js/mobile_navigation_bar.js"></script>
 
 <div class="container d-inline-flex d-lg-none">
 
diff --git a/files/templates/report_post_modal.html b/files/templates/report_post_modal.html
index 6cba89fbf..0f81a8a4e 100644
--- a/files/templates/report_post_modal.html
+++ b/files/templates/report_post_modal.html
@@ -1,54 +1,4 @@
-<script>
-    // Report Submission
-
-    report_postModal = function(id, author) {
-
-        document.getElementById("post-author").textContent = author;
-
-        submitbutton=document.getElementById("reportPostButton");
-
-        submitbutton.onclick = function() {
-
-            this.innerHTML='<span class="spinner-border spinner-border-sm mr-2" role="status" aria-hidden="true"></span>Reporting post';
-            this.disabled = true;
-
-            var xhr = new XMLHttpRequest();
-            xhr.open("POST", '/flag/post/'+id, true);
-            var form = new FormData()
-            form.append("formkey", formkey());
-            form.append("reason", document.getElementById("reason").value);
-
-            xhr.withCredentials=true;
-
-            xhr.onload=function() {
-                document.getElementById("reportPostFormBefore").classList.add('d-none');
-                document.getElementById("reportPostFormAfter").classList.remove('d-none');
-            };
-
-            xhr.onerror=function(){alert(errortext)};
-            xhr.send(form);
-
-        }
-    };
-
-    document.getElementById('reportPostModal').addEventListener('hidden.bs.modal', function () {
-
-        var button = document.getElementById("reportPostButton");
-
-        var beforeModal = document.getElementById("reportPostFormBefore");
-        var afterModal = document.getElementById("reportPostFormAfter");
-
-        button.innerHTML='Report post';
-        button.disabled= false;
-
-        afterModal.classList.add('d-none');
-
-        if ( beforeModal.classList.contains('d-none') ) {
-            beforeModal.classList.remove('d-none');
-        }
-
-    });
-</script>
+<script src="/assets/js/report_post_modal.js"></script>
 
 <!-- Report Post Modal -->
 <div class="modal fade" id="reportPostModal" tabindex="-1" role="dialog" aria-labelledby="reportPostModalTitle" aria-hidden="true">
diff --git a/files/templates/settings.html b/files/templates/settings.html
index 6e6a8380a..37e90cfdb 100644
--- a/files/templates/settings.html
+++ b/files/templates/settings.html
@@ -9,14 +9,10 @@
 		}
 	</style>
 
-	
-	
 	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
 	<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script>
-	<script src="/assets/js/general41.js"></script>
 
 	<script>
-
 		var clipboard = new ClipboardJS('.copy-link');
 		clipboard.on('success', function(e) {
 				var myToast = new bootstrap.Toast(document.getElementById('toast-success'));
@@ -30,12 +26,7 @@
 		});
 
 
-		//email change
-
-		// Show confirm password field when user clicks email box
-
 		document.getElementById('new_email').addEventListener('input', function () {
-
 			var id = document.getElementById("email-password");
 			var id2 = document.getElementById("email-password-label");
 			var id3 = document.getElementById("emailpasswordRequired");
@@ -43,27 +34,18 @@
 			id.classList.remove("d-none");
 			id2.classList.remove("d-none");
 			id3.classList.remove("d-none");
-
 		});
-	
-		// 2FA toggle modal
-
+		
 		document.getElementById('2faModal').addEventListener('hidden.bs.modal', function () {
-
 			var box = document.getElementById("2faToggle");
-			
 			box.checked = !box.checked;
-
 		});
 
-	
-		//Email verification text
-
 		function emailVerifyText() {
-
 			document.getElementById("email-verify-text").innerHTML = "Verification email sent! Please check your inbox.";
-
 		}
+
+		function formkey() {return '{{v.formkey}}';}
 	</script>
 
 	<meta charset="utf-8">
@@ -101,11 +83,6 @@
 	<!-- Font Awesome -->
 	<link href="/assets/css/fa.css" rel="stylesheet"> <!--load all styles -->
 
-	<script>
-		function formkey() {
-			return '{{v.formkey}}';
-		}
-	</script>
 </head>
 
 <body id="settings" style="overflow-x: hidden; {% if v and v.background %} background:url(/assets/images/backgrounds/{{v.background}}) no-repeat center center fixed !important; background-size: cover!important; background-color: #000!important;{% endif %}">
@@ -219,7 +196,6 @@
 
 	{% block content %}
 	{% endblock %}
-	
 	</div>
 </div>
 
diff --git a/files/templates/settings2.html b/files/templates/settings2.html
index 325df4dc1..f89403a4f 100644
--- a/files/templates/settings2.html
+++ b/files/templates/settings2.html
@@ -3,7 +3,10 @@
 <html lang="en">
 
 <head>
-	
+	<script>
+		function formkey() {return '{{v.formkey}}';}
+	</script>
+
 	<meta charset="utf-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 	<meta name="description" content="">
@@ -45,12 +48,6 @@
 	<!-- Font Awesome -->
 	<link href="/assets/css/fa.css" rel="stylesheet"> <!--load all styles -->
 
-	<script>
-		function formkey() {
-			return '{{v.formkey}}';
-		}
-	</script>
-
 </head>
 
 <body id="settings2" style="overflow-x: hidden; {% if v and v.background %} background:url(/assets/images/backgrounds/{{v.background}}) no-repeat center center fixed !important; background-size: cover!important; background-color: #000!important;{% endif %}">
@@ -200,7 +197,6 @@
 
 
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
-<script src="/assets/js/general41.js"></script>
 
 {% block scripts %}
 {% endblock %}
@@ -210,7 +206,6 @@
 
 
 </pre>
-	
 </body>
 
 </html>
\ No newline at end of file
diff --git a/files/templates/settings_apps.html b/files/templates/settings_apps.html
index 263f69814..42b4eb173 100644
--- a/files/templates/settings_apps.html
+++ b/files/templates/settings_apps.html
@@ -30,13 +30,11 @@
 				<label for="edit-{{app.id}}-name" class="mb-0 w-lg-25">App Name</label>
 				<input id="edit-{{app.id}}-name" class="form-control" type="text" name="name" value="{{app.app_name}}">
 				
-				
 				{% if app.client_id %}
 				<label for="edit-{{app.id}}-client-id" class="mb-0 w-lg-25">Client ID</label>
 				<input id="edit-{{app.id}}-client-id" class="form-control copy-link" type="text" name="name" value="{{app.client_id}}" data-clipboard-text="{{app.client_id}}" role="button" readonly="readonly">
 				{% endif %}
 				
-				
 				<label for="edit-{{app.id}}-redirect" class="mb-0 w-lg-25">Redirect URI</label>
 				<input id="edit-{{app.id}}-redirect" class="form-control" type="text" name="redirect_uri" value="{{app.redirect_uri}}">
 				<label for="edit-{{app.id}}-desc" class="mb-0 w-lg-25">Description</label>
diff --git a/files/templates/settings_blocks.html b/files/templates/settings_blocks.html
index 4d0bff4cb..4486b15ee 100644
--- a/files/templates/settings_blocks.html
+++ b/files/templates/settings_blocks.html
@@ -152,7 +152,6 @@
 					myToast.hide();
 					var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
 					myToast.show();
-					
 					exileError.textContent = JSON.parse(xhr.response)["error"];
 				}
 			}
diff --git a/files/templates/settings_filters.html b/files/templates/settings_filters.html
index 2aa47c68d..deb4c1fdd 100644
--- a/files/templates/settings_filters.html
+++ b/files/templates/settings_filters.html
@@ -189,7 +189,6 @@
 					</div>
 
 				</div>
-				
 			</div>
 
 			<h2 class="h5">Content Filters</h2>
diff --git a/files/templates/settings_profile.html b/files/templates/settings_profile.html
index 3a3fde67f..a7ba80800 100644
--- a/files/templates/settings_profile.html
+++ b/files/templates/settings_profile.html
@@ -6,6 +6,8 @@
 {% include "emoji_modal.html" %}
 {% include "gif_modal.html" %}
 
+<script src="/assets/js/setting_profile.js"></script>
+
 <div id="posts" class="row">
 
 	<div class="col col-lg-10">
@@ -110,7 +112,6 @@
 						</div>
 
 				</div>
-				
 				<div class="body d-lg-flex border-bottom">
 
 				<label class="text-black w-lg-25">Theme Color</label>
@@ -138,16 +139,13 @@
 				</div>
 
 				<!-- <p class="text-small mb-2">Or type a color code:</p>
-			
 				<div class="d-flex">
-				
 				<form action="/settings/themecolor" id="color-code-form" method="post">
 					<input type="hidden" name="formkey" value="{{v.formkey}}">
   
 					<input class="form-control" type="text" name="themecolor" id="color-code" value="{% if v.themecolor %}{{v.themecolor}}{% endif %}">
 					<label class="btn btn-secondary text-capitalize mr-2 mt-2 mb-0">Update<input type="text" for="color-code" onclick="form.submit()" hidden=""></label>
 				</form>
-				
 				</div> -->
 
 			</div>
@@ -156,76 +154,6 @@
 				<label for="theme">Website Backgrounds</label>
 			</div>
 				<div class="body w-lg-100">
-					<script>
-						function updatebgselection(){
-						var bgselector = document.getElementById("backgroundSelector");
-						var selection = bgselector.options[bgselector.selectedIndex].text;
-						
-						//var paragraph = document.getElementById("testp");
-						//paragraph.innerHTML = selection;
-						
-						const backgrounds = [
-							{
-								folder: "fantasy",
-								backgrounds: 
-								[
-									"1.webp",
-									"2.webp",
-									"3.webp",
-									"4.webp",
-									"5.webp",
-									"6.webp",
-								]
-							},
-							{
-								folder: "solarpunk",
-								backgrounds: 
-								[
-									"1.webp",
-									"2.webp",
-									"3.webp",
-									"4.webp",
-									"5.webp",
-									"6.webp",
-									"7.webp",
-									"8.webp",
-									"9.webp",
-									"10.webp",
-									"11.webp",
-									"12.webp",
-									"13.webp",
-									"14.webp",
-									"15.webp",
-									"16.webp",
-									"17.webp",
-									"18.webp",
-									"19.webp",
-								]
-							},
-							{
-							folder: "pixelart",
-							backgrounds:
-							[
-								"1.webp",
-								"2.webp",
-								"3.webp",
-								"4.webp",
-								"5.webp",
-							]
-							}
-						]
-							let bgContainer = document.getElementById(`bgcontainer`);
-							let str = '';
-							let bgsToDisplay = backgrounds[bgselector.selectedIndex].backgrounds;
-							let bgsDir = backgrounds[bgselector.selectedIndex].folder;
-							for (i=0; i < bgsToDisplay.length; i++) {
-								let onclickPost = bgsDir + "/" + bgsToDisplay[i];
-								str += `<button class="btn btn-secondary m-1 p-0" style="width:15rem; overflow: hidden;"><img loading="lazy" style="padding:0.25rem; width: 15rem" src="/assets/images/backgrounds/${bgsDir}/${bgsToDisplay[i]}" alt="${bgsToDisplay[i]}-background" onclick="post('/settings/profile?background=${onclickPost}', function(){window.location.reload(true);})"/></button>`;
-							}
-							bgContainer.innerHTML = str;
-						}
-						updatebgselection();
-					</script>
 					<p>Change the background for the website.</p>
 					<div class="input-group mb2">
 							<select id='backgroundSelector' class="form-control" form="profile-settings" name="background" onchange="updatebgselection();">
@@ -243,7 +171,6 @@
 						</div>
 					{% endif %}
 					<div id="bgcontainer"></div>
-					
 				</div>
 				</div>
 			</div>
@@ -447,7 +374,6 @@
 								</div>
 
 							</div>
-							
 							<div class="body d-lg-flex border-bottom">
 
 								<label class="text-black w-lg-25">Profile Anthem</label>
@@ -466,7 +392,6 @@
 								</div>
 
 							</div>
-							
 							<div class="body d-lg-flex border-bottom">
 
 								<label class="text-black w-lg-25">Name Color</label>
@@ -494,18 +419,13 @@
 								</div>
 
 								<p class="text-small mb-2">Or type a color code:</p>
-			
 								<div class="d-flex">
-								
 								<form action="/settings/namecolor" id="color-code-form" method="post">
 									<input type="hidden" name="formkey" value="{{v.formkey}}">
-				
 									<input class="form-control" type="text" name="color" id="color-code" value="{% if v.namecolor %}{{v.namecolor}}{% endif %}">
 									<label class="btn btn-secondary text-capitalize mr-2 mt-2 mb-0">Update<input type="text" for="color-code" onclick="form.submit()" hidden=""></label>
 								</form>
-								
 								</div>
-							
 							</div>							
 
 							{% if not v.flairchanged %}
@@ -557,16 +477,12 @@
 							</div>
 
 							<p class="text-small mb-2">Or type a color code:</p>
-			
 							<div class="d-flex">
-							
 							<form action="/settings/titlecolor" id="color-code-form" method="post">
 								<input type="hidden" name="formkey" value="{{v.formkey}}">
-			
 								<input class="form-control" type="text" name="titlecolor" id="color-code" value="{% if v.titlecolor %}{{v.titlecolor}}{% endif %}">
 								<label class="btn btn-secondary text-capitalize mr-2 mt-2 mb-0">Update<input type="text" for="color-code" onclick="form.submit()" hidden=""></label>
 							</form>
-							
 							</div>
 
 							</div>
@@ -582,7 +498,6 @@
 										<div class="input-group mb-2">
 											<textarea class="form-control rounded" id="bio-text" aria-label="With textarea" placeholder="Tell the community a bit about yourself." rows="3" name="bio" form="profile-bio" maxlength="1500">{{v.bio}}</textarea>
 										</div>
-										
 										<div class="d-flex">
 											<pre style="padding-top:0.7rem" class="btn btn-secondary format d-inline-block m-0 fas fa-bold" aria-hidden="true" onclick="makeBold('bio-text')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Bold"></pre>
 											&nbsp;
@@ -599,9 +514,7 @@
 												<input id="file-upload" type="file" name="file" accept="image/*" onchange="document.getElementById('filename-show').innerHTML='image';" hidden>
 											</label>					
 										</div>
-										
 										<pre></pre>
-										
 										<div class="d-flex">
 											<small>Limit of 1500 characters</small>
 											<input class="btn btn-primary ml-auto" id="bioSave" type="submit" value="Save Changes">
diff --git a/files/templates/settings_security.html b/files/templates/settings_security.html
index 0d6c6dd98..86aa0f77e 100644
--- a/files/templates/settings_security.html
+++ b/files/templates/settings_security.html
@@ -17,20 +17,13 @@
 					<h2 class="h5">Email</h2>
 
 					<p class="text-small text-muted">Change the email address used to sign in to your account.</p>
-		
 					<div class="settings-section rounded">
-		
 						<form	action="/settings/security" method="post">
 							<input type="hidden" name="formkey" value="{{v.formkey}}">
-		
 							<div class="body">
-		
 								<div class="d-lg-flex">
-		
 									<label for="new-email" class="w-lg-25">Email</label>
-		
 									<div class="w-lg-100">
-		
 										<input class="form-control" id="new_email" {% if v.email %}placeholder="{{v.email}}"{% else %}placeholder="Your email"{% endif %}
 										aria-describedby="new_email" type="email" name="new_email" required>
 										{% if v.email and not v.is_activated %}
@@ -38,31 +31,18 @@
 										{% elif not v.email %}
 											<div class="text-danger text-small-extra mt-1" id="email-verify-text">Add an email to secure your account in case you forget your password.</div>
 										{% endif %}
-		
 									</div>
-		
 								</div>
-		
 								<div class="d-lg-flex mt-3">
-		
 								<label for="email-password" class="w-lg-25 d-none" id="email-password-label">Password</label>
-		
 								<div class="w-lg-100">
-		
 									<input autocomplete="new-password" type="password" class="form-control mb-2 d-none" id="email-password" name="password" autocomplete="off" required>
-		
 									<small id="emailpasswordRequired" class="form-text font-weight-bold text-danger d-none mt-1">Password required to update your email.</small>
-		
 								</div>
-		
 							</div>
-		
 							<small id="emailpasswordRequired" class="form-text font-weight-bold text-danger d-none mt-1">Password required to update your email.</small>
-		
 						</div>
-		
 						<div class="footer">
-		
 							<div class="d-flex">
 								<a class="btn btn-success" href="javascript:void(0)" onclick="post_toast('/settings/gumroad')">Claim paypig rewards</a>
 								{% if v.email %}
@@ -72,16 +52,11 @@
 								<input class="btn btn-primary ml-auto"
 								type="submit" value="Add email">
 								{% endif %}
-		
 							</div>
 							<span class="text-small-extra text-muted pl-1">Must be same email as gumroad</span>
 						</div>
-		
 					</form>
-		
 				</div>
-		
-		
 
 
 
diff --git a/files/templates/sign_up.html b/files/templates/sign_up.html
index 60d3231fc..4ee5ec606 100644
--- a/files/templates/sign_up.html
+++ b/files/templates/sign_up.html
@@ -2,16 +2,9 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-		
-		
 		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
-		<script src="/assets/js/general41.js"></script>
 
 		<script>
-		
-			//Signup js
-			// Display username and password requirements on input
-
 			document.getElementById('password-register').addEventListener('input', function () {
 
 				var charCount = document.getElementById("password-register").value;
@@ -28,9 +21,6 @@
 				};
 
 			});
-		
-			// Check username length, special chars
-
 			document.getElementById('username-register').addEventListener('input', function () {
 
 				var charCount = document.getElementById("username-register").value;
@@ -52,8 +42,7 @@
 				}
 
 				if (!/[^a-zA-Z0-9_\-$]/.test(charCount)) {
-					// Change alert text
-					id.innerHTML = '<span class="form-text font-weight-bold text-success mt-1">Username is a-okay!';
+										id.innerHTML = '<span class="form-text font-weight-bold text-success mt-1">Username is a-okay!';
 
 					if (charCount.length < 3) {
 						id.innerHTML = '<span class="form-text font-weight-bold text-muted mt-1">Username must be at least 3 characters long.';
@@ -68,6 +57,7 @@
 
 			});
 		</script>
+
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 		<meta name="description" content="Sign up in under 27 seconds.">
@@ -174,7 +164,6 @@
 														<input class="form-control" id="password_confirm"
 														aria-describedby="passwordConfirmHelp" type="password" name="password_confirm"
 														required="">
-														
 														{% if "rdrama" in request.host %}
 															<div class="custom-control custom-checkbox mt-4">
 																	<input type="checkbox" class="custom-control-input" id="termsCheck" required>
diff --git a/files/templates/sign_up_failed_ref.html b/files/templates/sign_up_failed_ref.html
index ecccf6553..6a0c4c1b6 100644
--- a/files/templates/sign_up_failed_ref.html
+++ b/files/templates/sign_up_failed_ref.html
@@ -109,7 +109,6 @@
 
 
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
-<script src="/assets/js/general41.js"></script>
 
 
 <!-- {{'SITE_NAME' | app_config}} JS -->
diff --git a/files/templates/submission.html b/files/templates/submission.html
index da328d96e..1d403fc4b 100644
--- a/files/templates/submission.html
+++ b/files/templates/submission.html
@@ -17,63 +17,20 @@
 <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.8/dist/clipboard.min.js"></script>
 
 {% if v and v.id == p.author_id %}
-<script>
-	// Post edit form
+	<script>
+		togglePostEdit=function(id){
 
-	togglePostEdit=function(id){
+			body=document.getElementById("post-body");
+			title=document.getElementById("post-title");
+			form=document.getElementById("edit-post-body-"+id);
+			box=document.getElementById("post-edit-box-"+id);
 
-		body=document.getElementById("post-body");
-		title=document.getElementById("post-title");
-		form=document.getElementById("edit-post-body-"+id);
-		box=document.getElementById("post-edit-box-"+id);
-
-		body.classList.toggle("d-none");
-		title.classList.toggle("d-none");
-		form.classList.toggle("d-none");
-		autoExpand(box);
-	};
-</script>
-{% endif %}
-
-{% if v %}
-<script>
-	post_comment=function(fullname){
-
-		var form = new FormData();
-
-		form.append('formkey', formkey());
-		form.append('parent_fullname', fullname);
-		form.append('submission', document.getElementById('reply-form-submission-'+fullname).value);
-		form.append('body', document.getElementById('reply-form-body-'+fullname).value);
-		form.append('file', document.getElementById('file-upload-reply-'+fullname).files[0]);
-		var xhr = new XMLHttpRequest();
-		xhr.open("post", "/comment");
-		xhr.withCredentials=true;
-		xhr.onload=function(){
-			if (xhr.status==200) {
-				commentForm=document.getElementById('comment-form-space-'+fullname);
-				commentForm.innerHTML=JSON.parse(xhr.response)["html"];
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.hide();
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-				myToast.show();
-			}
-			else {
-				var commentError = document.getElementById("comment-error-text");
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-				myToast.hide();
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.show();
-					
-				commentError.textContent = JSON.parse(xhr.response)["error"];
-			}
-		}
-		xhr.send(form)
-
-		document.getElementById('save-reply-to-'+fullname).classList.add('disabled');
-
-	}
-</script>
+			body.classList.toggle("d-none");
+			title.classList.toggle("d-none");
+			form.classList.toggle("d-none");
+			autoExpand(box);
+		};
+	</script>
 {% endif %}
 
 <script>
@@ -85,6 +42,37 @@
 	{% endif %}
 </script>
 
+{% if p.award_count("shit") %}
+	<script src="/assets/js/bug-min.js"></script>
+	{% set minbugs = 10*p.award_count("shit") if p.award_count("shit") < 3 else 20 %}
+	{% set maxbugs = 20*p.award_count("shit") if p.award_count("shit") < 3 else 40 %}
+	<script>
+		new BugController({
+			imageSprite: "/assets/images/fly-sprite.webp",
+			canDie: false,
+			minBugs: {{minbugs}},
+			maxBugs: {{maxbugs}},
+			mouseOver: "multiply"
+		});
+	</script>
+{% endif %}
+
+
+{% if p.award_count("fireflies") %}
+	<script src="/assets/js/fireflies.js"></script>
+	{% set minbugs = 10*p.award_count("fireflies") if p.award_count("fireflies") < 3 else 20 %}
+	{% set maxbugs = 20*p.award_count("fireflies") if p.award_count("fireflies") < 3 else 40 %}
+	<script>
+		new BugController({
+			imageSprite: "/assets/images/fireflies.webp",
+			canDie: false,
+			minBugs: {{minbugs}},
+			maxBugs: {{maxbugs}},
+			mouseOver: "multiply"
+		});
+	</script>
+{% endif %}
+
 <meta charset="utf-8" />
 <meta property="og:type" content="article" />
 
@@ -254,36 +242,6 @@
 
 {% block content %}
 
-{% if p.award_count("shit") %}
-	<script src="/assets/js/bug-min.js"></script>
-	{% set minbugs = 10*p.award_count("shit") if p.award_count("shit") < 3 else 20 %}
-	{% set maxbugs = 20*p.award_count("shit") if p.award_count("shit") < 3 else 40 %}
-	<script>
-		new BugController({
-			imageSprite: "/assets/images/fly-sprite.webp",
-			canDie: false,
-			minBugs: {{minbugs}},
-			maxBugs: {{maxbugs}},
-			mouseOver: "multiply"
-		});
-	</script>
-{% endif %}
-
-
-{% if p.award_count("fireflies") %}
-	<script src="/assets/js/fireflies.js"></script>
-	{% set minbugs = 10*p.award_count("fireflies") if p.award_count("fireflies") < 3 else 20 %}
-	{% set maxbugs = 20*p.award_count("fireflies") if p.award_count("fireflies") < 3 else 40 %}
-	<script>
-		new BugController({
-			imageSprite: "/assets/images/fireflies.webp",
-			canDie: false,
-			minBugs: {{minbugs}},
-			maxBugs: {{maxbugs}},
-			mouseOver: "multiply"
-		});
-	</script>
-{% endif %}
 
 <div class="row mb-3">
 
@@ -325,11 +283,9 @@
 						<span data-bs-toggle="tooltip" data-bs-placement="bottom" id="timestamp" title="">&nbsp;{{p.age_string}}</span>
 						({% if p.realurl(v) %}<a href="/search/posts/?q=domain%3A{{p.domain}}&sort=new&t=all" {% if not v or v.newtabexternal %}target="_blank"{% endif %}>{{p.domain}}</a>{% else %}text post{% endif %})
 						
-						
 						{% if p.edited_utc %}&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom" id="edited_timestamp" title="">{{p.edited_string}}</span>{% endif %}
 						&nbsp;&nbsp;{{p.views}} views
 					</div>
-					
 					{% if p.active_flags %}
 					<div id="flaggers" class="flaggers d-none">
 						<strong><i class="far fa-fw fa-flag"></i> Reported by:</strong>
@@ -343,7 +299,6 @@
 						</ul>
 					</div>
 					{% endif %}
-				
 					{% if p.realurl(v) %}
 						<h1 id="post-title" class="card-title post-title text-left mb-md-3"><a {% if not v or v.newtabexternal %}target="_blank"{% endif %} rel="nofollow noopener noreferrer" href="{{p.realurl(v)}}">
 							{% if p.club %}<span class="patron font-weight-bolder" style="background-color:red; font-size:12px;">COUNTRY CLUB</span>{% endif %}
@@ -361,7 +316,6 @@
 							{% if "streamable.com/" in p.realurl(v) %}
 								<div style="width: 100%; height: 0px; position: relative; padding-bottom: 56.250%;"><iframe loading="lazy" src="{{p.realurl(v)}}" frameborder="0" width="100%" height="100%" allowfullscreen="" style="width: 100%; height: 100%; position: absolute;"></iframe></div>
 								<pre></pre>
-								
 							{% elif "spotify.com/" in p.realurl(v) %}
 								{% if "spotify.com/embed/" in p.realurl(v) %}
 									{% set streamurl=p.realurl(v) %}
@@ -380,7 +334,6 @@
 								</a>
 							{% endif %}
 						{% endif %}
-						
 						<div id="post-text" style="z-index: 50">
 							{% if p.is_image %}
 								<div class="row no-gutters">
@@ -445,7 +398,6 @@
 							</div>
 							</div>
 							{% endif %}
-				
 							<div class="d-none d-md-flex justify-content-between align-items-center mt-2">
 								<div class="post-actions mt-2">
 				<ul class="list-inline text-right d-flex">
@@ -460,7 +412,6 @@
 						{% endif %}
 
 						<li class="list-inline-item"><a href="/votes?link={{p.fullname}}"><i class="fas fa-arrows-v"></i>Votes</a></li>
-						
 						{% if v and v.id!=p.author_id %}
 							<li class="list-inline-item text-muted d-none d-md-inline-block"><a href="javascript:void(0)" data-bs-toggle="modal" data-bs-target="#awardModal" onclick="awardModal('/post/{{p.id}}/awards')"><i class="fas fa-gift fa-fw"></i>Give Award</a></li>
 						{% endif %}
@@ -488,7 +439,6 @@
 								<li class="list-inline-item"><a href="javascript:void(0)" data-bs-toggle="modal" data-bs-dismiss="modal" data-bs-target="#deletePostModal" onclick="delete_postModal('{{p.id}}')"><i class="fas fa-trash-alt"></i>Delete</a></li>
 							{% endif %}
 						{% endif %}
-						
 						{% if v and v.admin_level>=3 %}
 							<li id="pin-{{p.id}}" class="{% if p.stickied %}d-none{% endif %} list-inline-item"><a class="text-info" href="javascript:void(0)" onclick="post_toast2('/sticky/{{p.id}}','pin-{{p.id}}','unpin-{{p.id}}')"><i class="fas fa-thumbtack"></i>Pin</a></li>
 							<li id="unpin-{{p.id}}" class="{% if not p.stickied %}d-none{% endif %} list-inline-item"><a class="text-info" href="javascript:void(0)" onclick="post_toast2('/sticky/{{p.id}}','/sticky/{{p.id}}','pin-{{p.id}}','unpin-{{p.id}}')"><i class="fas fa-thumbtack"></i>Unpin</a></li>
@@ -538,7 +488,6 @@
 								<li id="unban-{{p.id}}" class="{% if not p.author.is_suspended %}d-none{% endif %} list-inline-item"><a class="text-danger" id="unexile2-user-{{p.id}}" href="javascript:void(0)" onclick="post_toast2('/unban_user/{{p.author_id}}','ban-{{p.id}}','unban-{{p.id}}')"><i class="fas fa-user-slash"></i>Unban user</a></li>
 							{% endif %}
 						{% endif %}
-												
 								</ul>
 							</div>
 
@@ -553,7 +502,6 @@
 						<div id="post-{{p.id}}-up" tabindex="0" data-bs-id-up="{{p.id}}" data-bs-content-type="post" class="mx-auto arrow-up upvote-button post-{{p.id}}-up {% if voted==1 %}active{% endif %}"></div>
 
 						<span id="post-score-{{p.id}}" class="score post-score-{{p.id}} {% if voted==1 %}score-up{% elif voted==-1%}score-down{% endif %}" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-original-title="+{{ups}} | -{{downs}}">{{score}}</span>
-						
 						<div {% if environ.get('DISABLE_DOWNVOTES') == '1' %}style="display:None!important"{% endif %} id="post-{{p.id}}-down" tabindex="0" data-bs-id-down="{{p.id}}" data-bs-content-type="post" class="text-muted mx-auto arrow-down downvote-button post-{{p.id}}-down {% if voted==-1 %}active{% endif %}"></div>
 					</div>
 
diff --git a/files/templates/submission_banned.html b/files/templates/submission_banned.html
index 9844bf7ae..5009a9a7e 100644
--- a/files/templates/submission_banned.html
+++ b/files/templates/submission_banned.html
@@ -76,7 +76,6 @@
 			{% if p.is_banned and p.ban_reason %}
 			<div class="text-danger mt-4 mb-2">Reason: {{p.ban_reason | safe}}</div>
 			{% endif %}
-			
 			{% if v and v.admin_level >=3 and p.body_html %}
 												<div class="post-body mt-4 mb-2"> 
 				{{p.body_html | safe}}
@@ -117,19 +116,15 @@
 <!-- Mobile responsive fixed footer with post actions -->
 
 				<div class="row fixed-top bg-white shadow d-inline-flex d-md-none p-3" id="footer-actions" style="z-index: 3; top: 48px; transition: top cubic-bezier(0, 0, 0.2, 1) 220ms;">
-				
 						<div class="col text-center">
-				
 								<div class="post-actions mx-auto">
 										<ul class="list-inline">
-												
 												<li id="voting-mobile" class="voting list-inline-item{% if voted==1 %} upvoted{% elif voted==-1 %} downvoted{% endif %}">
 														<span id="arrow-mobile-up" class="mr-2 arrow-mobile-up">
 																<i class="fas fa-arrow-alt-up mx-0"></i>
 														</span>
 
 
-																
 				<span id="post-{{p.id}}-score-mobile-up" class="score-up text-muted{% if voted!=1 %} d-none{% endif %}">✖</span>
 					<span id="post-{{p.id}}-score-mobile-none" class="score text-muted{% if voted!=0 and voted!=-2 %} d-none{% endif %}">✖</span>
 					<span id="post-{{p.id}}-score-mobile-down" class="score-down text-muted{% if voted!=-1 %} d-none{% endif %}">✖</span>
@@ -142,9 +137,7 @@
 
 										</ul>
 								</div>
-				
 						</div>
-				
 				</div>
 
 {% endblock %}
diff --git a/files/templates/submission_listing.html b/files/templates/submission_listing.html
index f21f2b43f..7adb91eed 100644
--- a/files/templates/submission_listing.html
+++ b/files/templates/submission_listing.html
@@ -80,7 +80,6 @@
 		<div class="card-header bg-transparent border-0 d-flex flex-row flex-nowrap pl-2 pl-md-0 p-0 mr-md-2">
 
 			<div style="z-index: 3;">
-				
 				{% if p.club and not (v and v.paid_dues) %}
 					<img loading="lazy" src="/assets/images/emojis/marseyglow.webp" class="post-img">
 				{% elif not p.url %}
@@ -100,7 +99,6 @@
 						<img loading="lazy" src="{{p.thumb_url}}" class="post-img">
 					</a>
 				{% endif %}
-				
 			</div>
 
 
@@ -135,7 +133,6 @@
 				<span data-bs-toggle="tooltip" data-bs-placement="bottom" id="timestamp-{{p.id}}" title="">&nbsp;{{p.age_string}}</span>
 				&nbsp;
 				({% if p.realurl(v) %}<a href="/search/posts/?q=domain%3A{{p.domain}}&sort=new&t=all" target="_blank">{{p.domain}}</a>{% else %}text post{% endif %})
-				
 				{% if p.edited_utc %}&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom" id="edited_timestamp-{{p.id}}" title="">{{p.edited_string}}</span>{% endif %}
 				&nbsp;&nbsp;{{p.views}} views
 			</div>
@@ -183,7 +180,6 @@
 								{% endif %}
 							{% endif %}
 
-						
 						{% if v and v.admin_level>=3 %}
 							<li id="pin-{{p.id}}" class="{% if p.stickied %}d-none{% endif %} list-inline-item"><a class="text-info" href="javascript:void(0)" onclick="post_toast2('/sticky/{{p.id}}','pin-{{p.id}}','unpin-{{p.id}}')"><i class="fas fa-thumbtack"></i>Pin</a></li>
 							<li id="unpin-{{p.id}}" class="{% if not p.stickied %}d-none{% endif %} list-inline-item"><a class="text-info" href="javascript:void(0)" onclick="post_toast2('/sticky/{{p.id}}','pin-{{p.id}}','unpin-{{p.id}}')"><i class="fas fa-thumbtack"></i>Unpin</a></li>
@@ -229,7 +225,6 @@
 								<li id="unban-{{p.id}}" class="{% if not p.author.is_suspended %}d-none{% endif %} list-inline-item"><a class="text-danger" id="unexile2-user-{{p.id}}" href="javascript:void(0)" onclick="post_toast2('/unban_user/{{p.author_id}}','ban-{{p.id}}','unban-{{p.id}}')"><i class="fas fa-user-slash"></i>Unban user</a></li>
 							{% endif %}
 						{% endif %}
-												
 			</ul>
 		</div>
 	</div>
@@ -487,7 +482,6 @@
 			<h2 class="h5">@{{u.username}} hasn't made a post yet</h2>
 			<p class="text-muted">Their posting history will show here.</p>
 			<pre>
-				
 			</pre>
 		</div>			
 	</div>	
diff --git a/files/templates/submit.html b/files/templates/submit.html
index 0006a5c29..b61bb282a 100644
--- a/files/templates/submit.html
+++ b/files/templates/submit.html
@@ -1,248 +1,11 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-		
-		
 		<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/js/bootstrap.bundle.min.js"></script>
 		<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
-		<script src="/assets/js/general41.js"></script>
 
+		<script src="/assets/js/submit.js"></script>
 
-		<script>
-		
-			// Text Formatting
-
-			// Bold Text
-
-			makeBold = function (form) {
-				var text = document.getElementById(form);
-				var startIndex = text.selectionStart,
-				endIndex = text.selectionEnd;
-				var selectedText = text.value.substring(startIndex, endIndex);
-
-				var format = '**'
-
-				if (selectedText.includes('**')) {
-					text.value = selectedText.replace(/\*/g, '');
-					
-				}
-				else if (selectedText.length == 0) {
-					text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
-				}
-				else {
-					text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
-				}
-			}
-
-			// Italicize Comment Text
-
-			makeItalics = function (form) {
-				var text = document.getElementById(form);
-				var startIndex = text.selectionStart,
-				endIndex = text.selectionEnd;
-				var selectedText = text.value.substring(startIndex, endIndex);
-
-				var format = '*'
-
-				if (selectedText.includes('*')) {
-					text.value = selectedText.replace(/\*/g, '');
-					
-				}
-				else if (selectedText.length == 0) {
-					text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
-				}
-				else {
-					text.value = text.value.substring(0, startIndex) + format + selectedText + format + text.value.substring(endIndex);
-				}
-			}
-
-			// Quote Comment Text
-
-			makeQuote = function (form) {
-				var text = document.getElementById(form);
-				var startIndex = text.selectionStart,
-				endIndex = text.selectionEnd;
-				var selectedText = text.value.substring(startIndex, endIndex);
-
-				var format = '>'
-
-				if (selectedText.includes('>')) {
-					text.value = text.value.substring(0, startIndex) + selectedText.replace(/\>/g, '') + text.value.substring(endIndex);
-					
-				}
-				else if (selectedText.length == 0) {
-					text.value = text.value.substring(0, startIndex) + selectedText + text.value.substring(endIndex);
-				}
-				else {
-					text.value = text.value.substring(0, startIndex) + format + selectedText + text.value.substring(endIndex);
-				}
-			}
-		
-			// Character Count
-
-			function charLimit(form, text) {
-
-				var input = document.getElementById(form);
-
-				var text = document.getElementById(text);
-
-				var length = input.value.length;
-
-				var maxLength = input.getAttribute("maxlength");
-
-				if (length >= maxLength) {
-					text.style.color = "#E53E3E";
-				}
-				else if (length >= maxLength * .72){
-					text.style.color = "#FFC107";
-				}
-				else {
-					text.style.color = "#A0AEC0";
-				}
-
-				text.innerText = maxLength - length;
-
-			}
-
-		
-			//part of submit page js
-
-			hide_image=function(){
-				x=document.getElementById('image-upload-block');
-				url=document.getElementById('post-URL').value;
-				if (url.length>=1){
-					x.classList.add('d-none');
-				}
-				else {
-					x.classList.remove('d-none');
-				}
-			}
-
-			// Auto-suggest title given URL
-
-			function autoSuggestTitle()	{
-
-				var urlField = document.getElementById("post-URL");
-
-				var titleField = document.getElementById("post-title");
-
-				var isValidURL = urlField.checkValidity();
-
-				if (isValidURL && urlField.value.length > 0 && titleField.value === "") {
-
-					var x = new XMLHttpRequest();
-					x.withCredentials=true;
-					x.onreadystatechange = function() {
-						if (x.readyState == 4 && x.status == 200) {
-
-							title=JSON.parse(x.responseText)["title"];
-							titleField.value=title;
-
-							checkForRequired()
-						}
-					}
-					x.open('get','/submit/title?url=' + urlField.value);
-					x.send(null);
-
-				};
-
-			};
-
-			// Run AutoSuggestTitle function on load
-
-			if (window.location.pathname=='/submit') {
-				window.onload = autoSuggestTitle();
-			}
-
-			// Paste to create submission
-
-			document.addEventListener('paste', function (event) {
-
-				var nothingFocused = document.activeElement === document.body;
-
-				if (nothingFocused) {
-
-					var clipText = event.clipboardData.getData('Text');
-
-					var url = new RegExp('^(?:[a-z]+:)?//', 'i');
-
-					if (url.test(clipText) && window.location.pathname !== '/submit') {
-						window.location.href = '/submit?url=' + clipText;
-					}
-					else if (url.test(clipText) && window.location.pathname == '/submit') {
-
-						document.getElementById("post-URL").value = clipText;
-
-						autoSuggestTitle()
-
-					}
-				}
-			});
-
-			function checkForRequired() {
-
-				// Divs
-
-				var title = document.getElementById("post-title");
-
-				var url = document.getElementById("post-URL");
-
-				var text = document.getElementById("post-text");
-
-				var button = document.getElementById("create_button");
-
-				var image = document.getElementById("file-upload");
-
-				// Toggle reuqired attribute
-
-				if (url.value.length > 0 || image.value.length > 0) {
-					text.required = false;
-					url.required=false;
-				} else if (text.value.length > 0 || image.value.length > 0) {
-					url.required = false;
-				} else {
-					text.required = true;
-					url.required = true;
-				}
-
-				// Validity check
-
-				var isValidTitle = title.checkValidity();
-
-				var isValidURL = url.checkValidity();
-
-				var isValidText = text.checkValidity();
-
-				// Disable submit button if invalid inputs
-
-				if (isValidTitle && (isValidURL || image.value.length>0)) {
-					button.disabled = false;
-				} else if (isValidTitle && isValidText) {
-					button.disabled = false;
-				} else {
-					button.disabled = true;
-				}
-			}
-
-
-			// markdown
-
-			function markdown() {
-				
-				var input = document.getElementById('post-text').value;
-
-				var emojis = Array.from(input.matchAll(/:(.{1,30}?):/gi))
-					if(emojis != null){
-							for(i = 0; i < emojis.length; i++){
-								input = input.replace(emojis[i][0], "<img height=30 src='/assets/images/emojis/" + emojis[i][1] + ".webp'>")
-							}
-					}
-				
-				document.getElementById('preview').innerHTML = marked(input)
-				
-			}
-
-		</script>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 		<meta name="description" content="">
@@ -255,7 +18,6 @@
 		{% block title %}
 		<title>Create a post - {{'SITE_NAME' | app_config}}</title>
 		{% endblock %}
-	
 
 		<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600&display=swap" rel="stylesheet">
 
@@ -319,12 +81,10 @@
 													<div><label class="mt-3">Attachment Upload</label></div>
 
 													<img loading="lazy" id="image-preview" class="w-100 d-block">
-						
 													<label class="btn btn-secondary m-0" for="file-upload">
 														<div id="filename-show">Select File</div>
 														<input id="file-upload" type="file" name="file" accept="image/*, video/*" hidden>
 													</label>
-						
 													<small class="form-text text-muted">Optional if you have text.</small>
 													<small class="form-text text-muted">You can upload videos up to 1 minute long.</small>
 												</div>
@@ -338,7 +98,6 @@
 													<div class="btn btn-secondary" onclick="document.getElementById('preview').classList.toggle('d-none');" style="float: right;">
 														Toggle preview
 													</div>
-													
 													<div id="preview" class="my-3"></div>
 
 													<span class="position-absolute text-small font-weight-bold" id="character-count-submit-text-form" style="right: 1rem; bottom: 0.5rem; z-index: 3;"></span>
@@ -371,7 +130,6 @@
 														<input type="checkbox" class="custom-control-input" id="nsfwCheck" name="over_18">
 														<label class="custom-control-label" for="nsfwCheck">+18</label>
 												</div>
-												
 												<div class="custom-control custom-checkbox">
 														<input type="checkbox" class="custom-control-input" id="privateCheck" name="private">
 														<label class="custom-control-label" for="privateCheck">Draft</label>
@@ -389,7 +147,6 @@
 
 
 
-													
 
 												</pre>
 										</div>
@@ -414,38 +171,8 @@
 
 		</div>
 		{% endblock %}
-	
 		<!-- {{'SITE_NAME' | app_config}} JS -->
 
-		<script>
-			document.onpaste = function(event) {
-				f=document.getElementById('file-upload');
-				files = event.clipboardData.files
-				filename = files[0].name.toLowerCase()
-				if (filename.endsWith(".jpg") || filename.endsWith(".jpeg") || filename.endsWith(".png") || filename.endsWith(".webp"))
-				{
-					f.files = files;
-					document.getElementById('filename-show').textContent = filename;
-					document.getElementById('urlblock').classList.add('d-none');
-					var fileReader = new FileReader();
-					fileReader.readAsDataURL(f.files[0]);
-					fileReader.addEventListener("load", function () {document.getElementById('image-preview').setAttribute('src', this.result);});  
-					document.getElementById('file-upload').setAttribute('required', 'false');
-					checkForRequired();
-				}
-			}
-
-			document.getElementById('file-upload').addEventListener('change', function(e){
-				f=document.getElementById('file-upload');
-				document.getElementById('urlblock').classList.add('d-none');
-				document.getElementById('filename-show').textContent = document.getElementById('file-upload').files[0].name;
-				var fileReader = new FileReader();
-				fileReader.readAsDataURL(f.files[0]);
-				fileReader.addEventListener("load", function () {document.getElementById('image-preview').setAttribute('src', this.result);});  
-				checkForRequired();
-			})
-		</script>
-
 <pre>
 
 
diff --git a/files/templates/userpage.html b/files/templates/userpage.html
index 496f4c8b8..f8ff042c5 100644
--- a/files/templates/userpage.html
+++ b/files/templates/userpage.html
@@ -43,123 +43,7 @@
 
 {% block desktopUserBanner %}
 <!-- Desktop -->
-<script>
-	function post_toast_callback(url, data, callback) {
-		var xhr = new XMLHttpRequest();
-		xhr.open("POST", url, true);
-		var form = new FormData()
-
-		if(typeof data === 'object' && data !== null) {
-			for(let k of Object.keys(data)) {
-				form.append(k, data[k]);
-			}
-		}
-
-		form.append("formkey", formkey());
-		xhr.withCredentials=true;
-
-		xhr.onload = function() {
-			let result = callback(xhr);
-				
-			if (xhr.status >= 200 && xhr.status < 300) {
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.hide();
-
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-				myToast.show();
-
-				try {
-					if(typeof result == "string") {
-						document.getElementById('toast-post-success-text').innerText = result;
-					} else {
-						document.getElementById('toast-post-success-text').innerText = JSON.parse(xhr.response)["message"];
-					}
-				} catch(e) {
-					document.getElementById('toast-post-success-text').innerText = "Action successful!";
-				}
-
-				return true;
-			} else {
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-success'));
-				myToast.hide();
-
-				var myToast = new bootstrap.Toast(document.getElementById('toast-post-error'));
-				myToast.show();
-
-				try {
-					if(typeof result == "string") {
-						document.getElementById('toast-post-error-text').innerText = result;
-					} else {
-						document.getElementById('toast-post-error-text').innerText = JSON.parse(xhr.response)["error"];
-					}
-					return false
-				} catch(e) {
-					document.getElementById('toast-post-error-text').innerText = "Error. Try again later.";
-				}
-
-				return false;
-			}
-		};
-
-		xhr.send(form);
-
-	}
-
-    const TRANSFER_TAX = 0.01;
-
-    window.addEventListener( 'load', function() {
-		var userid = document.getElementById("userid").value;
-		if (userid != "nosong")
-		{
-			var audio = new Audio(`/songs/${userid}`);
-			audio.loop=true;
-			audio.play();
-			document.getElementById('userpage').addEventListener('click', () => {
-				if (audio.paused) audio.play(); 
-			}, {once : true});
-		}
-	}, false );
-
-	function transferCoins(mobile=false) {
-		let t = event.target;
-		t.disabled = true;
-
-		let amount = parseInt(document.getElementById("coins-transfer-amount").value);
-		let transferred = amount - Math.ceil(amount*TRANSFER_TAX);
-
-		post_toast_callback("/@{{u.username}}/transfer_coins",
-			{"amount": document.getElementById(mobile ? "coins-transfer-amount-mobile" : "coins-transfer-amount").value},
-		    (xhr) => {
-			if(xhr.status == 200) {
-			    document.getElementById("user-coins-amount").innerText = parseInt(document.getElementById("user-coins-amount").innerText) - amount;
-			    document.getElementById("profile-coins-amount-mobile").innerText = parseInt(document.getElementById("profile-coins-amount-mobile").innerText) + transferred;
-			    document.getElementById("profile-coins-amount").innerText = parseInt(document.getElementById("profile-coins-amount").innerText) + transferred;
-			}
-		    }
-		);
-
-		setTimeout(_ => t.disabled = false, 2000);
-	}
-
-	function updateTax(mobile=false) {
-	    let suf = mobile ? "-mobile" : "";
-	    let amount = parseInt(document.getElementById("coins-transfer-amount" + suf).value);
-	    if(isNaN(amount) || amount < 0) {
-		amount = 0;
-	    }
-	    document.getElementById("coins-transfer-taxed" + suf).innerText = amount - Math.ceil(amount*TRANSFER_TAX);
-	}
-
-	function toggleElement(group, id) {
-		for(let el of document.getElementsByClassName(group)) {
-			if(el.id != id) {
-				el.classList.add('d-none');
-			}
-		}
-
-		document.getElementById(id).classList.toggle('d-none');
-	}
-</script>
+<script src="/assets/js/userpage.js"></script>>
 
 <textarea id="userid" style="display: none;">{% if u.song %}{{u.id}}{% else %}nosong{% endif %}</textarea>
 <div class="row d-none d-md-block">
@@ -177,7 +61,6 @@
 								<h5 style="color:#ff66ac;">BANNED USER{% if u.ban_reason %}: {{u.ban_reason}}{% endif %}</h5>
 								{% if u.unban_utc %}<h5 style="color:#ff66ac;">{{u.unban_string}}</h5>{% endif %}
 							{% endif %}
-							
 							<div class="d-flex align-items-center mt-1 mb-2">
 								<h1 class="font-weight-bolder h3 mb-0" style="color: #{{u.namecolor}}"><span {% if u.patron %}class="patron" style="background-color:#{{u.namecolor}};"{% endif %}>{{u.username}}</span></h1>
 								{% if u.username != u.original_username %}
@@ -224,14 +107,11 @@
 				</div>
 
 				{% if u.customtitle %}<p class="font-weight-bolder" style="color: #{{u.titlecolor}}">{% if u.quadrant %}<img loading="lazy" height="20" src="/assets/images/PCM/quadrants/{{u.quadrant}}.webp">{% endif %}{{u.customtitle | safe}}</p>{% endif %}
-				
 				<div class="font-weight-bolder">
 					<span id="profile-coins-amount">{{u.coins}}</span>
-					
 					&nbsp;<img data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{'COINS_NAME' | app_config}}" height="20" src="https://rdrama.net/assets/images/emojis/marseybux.webp">&nbsp;&nbsp;
 
 					{% if u.stored_subscriber_count >=1 and not u.is_nofollow %}<a href="/@{{u.username}}/followers">{{u.stored_subscriber_count}} follower{{'s' if u.stored_subscriber_count != 1 else ''}}</a>&nbsp;&nbsp; {% endif %}
-					
 					joined <span data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{u.created_datetime}}">{{u.created_date}}</span>
 				</div>
 				{% if "pcm" in request.host %}<p class="text-muted">Based Count: {{u.basedcount}}</p>{% endif %}
@@ -261,7 +141,6 @@
 					{% if v and v.id != u.id %}
 						{% if u.id != 995 %}<a id="button-unsub" class="btn btn-secondary {% if not is_following %}d-none{% endif %}" href="javascript:void(0)" onclick="post_toast2('/unfollow/{{u.username}}','button-unsub','button-sub')">Unfollow</a>{% endif %}
 						<a id="button-sub" class="btn btn-primary {% if is_following or u.is_nofollow or u.is_blocked %}d-none{% endif %}" href="javascript:void(0)" onclick="post_toast2('/follow/{{u.username}}','button-unsub','button-sub')">Follow</a>						
-						
 						<a class="btn btn-primary" href="javascript:void(0)" onclick="toggleElement('profile-toggleable', 'message')">Message</a>
 
 						<a class="btn btn-primary" href="javascript:void(0)" onclick="post_toast('/@{{u.username}}/suicide')">Get them help</a>
@@ -370,7 +249,6 @@
 								<input id="user-ban-submit" type="submit" class="btn btn-danger" value="Ban user" disabled>
 							</form>
 						{% endif %}
-						
 						<pre></pre>
 
 						<form id="agendaposter" class="{% if u.agendaposter %}d-none{% endif %}" action="/agendaposter/{{u.id}}" method="post">
@@ -378,7 +256,6 @@
 							<input type="number" step="any" name="days" class="form-control" placeholder="Days (0 or blank = permanent)" />
 							<input type="submit" class="btn btn-danger" value="Lock Agendaposter Theme" />
 						</form>
-					
 						<a id="unagendaposter" class="{% if not u.agendaposter %}d-none{% endif %} btn btn-success" href="javascript:void(0)" onclick="post_toast2('/agendaposter/{{u.id}}','agendaposter','unagendaposter')">Disable Agendaposter Theme</a>
 
 						<pre></pre>
@@ -471,7 +348,6 @@
 				{% endif %}
 				{% if u.verified %}<span><i class="fas fa-badge-check align-middle ml-1" style="color:#1DA1F2" data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{u.verified}}"></i></span>&nbsp;{% endif %}
 				<a class="text-black"><h1 class="h5 d-inline-block" style="color: #{{u.namecolor}}"><span {% if u.patron %}class="patron" style="background-color:#{{u.namecolor}};"{% endif %}>{{u.username}}</span></h1></a>
-				
 				{% if u.username != u.original_username %}
 					<span>
 						<i class="fad fa-user-tag text-info align-middle ml-2" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Original Username: @{{u.original_username}}"></i>
@@ -494,9 +370,7 @@
 					<span id="profile-coins-amount-mobile" class="font-weight-bold">{{u.coins}}</span>
 
 					&nbsp;<img data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{'COINS_NAME' | app_config}}" height="15" src="https://rdrama.net/assets/images/emojis/marseybux.webp">&nbsp;&nbsp;
-					
 					{% if u.stored_subscriber_count >=1 and not u.is_nofollow %}<a href="/@{{u.username}}/followers" class="font-weight-bold">{{u.stored_subscriber_count}} follower{{'s' if u.stored_subscriber_count != 1 else ''}}</a>&nbsp;&nbsp; {% endif %}
-					
 					{% if "pcm" in request.host %}
 						<br>Based count: {{u.basedcount}}
 					{% endif %}
@@ -535,7 +409,6 @@
 				{% if v and v.id != u.id %}
 					{% if u.id != 995 %}<a id="button-unsub2" class="btn btn-secondary {% if not is_following %}d-none{% endif %}" href="javascript:void(0)" onclick="post_toast2('/unfollow/{{u.username}}','button-unsub2','button-sub2')">Unfollow</a>{% endif %}
 					<a id="button-sub2" class="btn btn-primary {% if is_following or u.is_nofollow or u.is_blocked %}d-none{% endif %}" href="javascript:void(0)" onclick="post_toast2('/follow/{{u.username}}','button-unsub2','button-sub2')">Follow</a>						
-					
 					<a class="btn btn-primary" href="javascript:void(0)" onclick="toggleElement('profile-toggleable-mobile', 'message-mobile')">Message</a>
 					<a class="btn btn-primary" href="javascript:void(0)" onclick="post_toast('/@{{u.username}}/suicide')">Get them help</a>
 					<a class="btn btn-primary" href="javascript:void(0)" onclick="toggleElement('profile-toggleable-mobile', 'coin-transfer-mobile')">Gift {{'COINS_NAME' | app_config}}</a>
@@ -592,10 +465,8 @@
 						<div>{{u.username}} will receive <span id="coins-transfer-taxed-mobile">0</span> {{'COINS_NAME' | app_config}}</div>
 						<button class="btn btn-primary mt-3" onclick="transferCoins(true)">Gift</button>
 					</div>
-					
 					{% if v.admin_level > 1 %}
 
-					
 					<button id="grant" class="{% if u.paid_dues %}d-none{% endif %} btn btn-success" onclick="post_toast2('/@{{u.username}}/club_allow','grant','bar')">Grant club access</button>
 					<button id="bar" class="{% if u.club_banned %}d-none{% endif %} btn btn-danger" onclick="post_toast2('/@{{u.username}}/club_ban','grant','bar')">Bar from club</button>
 
@@ -649,7 +520,6 @@
 								<input id="user-ban-submit2" type="submit" class="btn btn-danger" value="Ban user" disabled>
 							</form>
 						{% endif %}
-						
 						<pre></pre>
 
 						<form id="agendaposter2" class="{% if u.agendaposter %}d-none{% endif %}" action="/agendaposter/{{u.id}}" method="post">
@@ -657,7 +527,6 @@
 							<input type="number" step="any" name="days" class="form-control" placeholder="Days (0 or blank = permanent)" />
 							<input type="submit" class="btn btn-danger" value="Lock Agendaposter Theme" />
 						</form>
-					
 						<a id="unagendaposter2" class="{% if not u.agendaposter %}d-none{% endif %} btn btn-success" href="javascript:void(0)" onclick="post_toast2('/agendaposter/{{u.id}}','agendaposter2','unagendaposter2')">Disable Agendaposter Theme</a>
 
 						<pre></pre>
@@ -703,9 +572,7 @@
 				{% if u.is_suspended %}
 					<p>Banned by: <a href="{{u.banned_by.url}}">@{{u.banned_by.username}}</a></p>
 				{% endif %}
-				
 
-				
 			</div>
 		</div>
 	</div>