diff --git a/files/static/dist/main.css b/files/static/dist/main.css
index 4d4a84785..b4bf4bfc5 100644
--- a/files/static/dist/main.css
+++ b/files/static/dist/main.css
@@ -968,6 +968,10 @@ video {
 	margin-top: 2rem;
 	margin-bottom: 2rem;
 }
+.-mx-3 {
+	margin-left: -0.75rem;
+	margin-right: -0.75rem;
+}
 .mb-5 {
 	margin-bottom: 1.25rem;
 }
@@ -1028,9 +1032,6 @@ video {
 .mb-4 {
 	margin-bottom: 1rem;
 }
-.mb-6 {
-	margin-bottom: 1.5rem;
-}
 .mr-0 {
 	margin-right: 0px;
 }
@@ -1040,6 +1041,9 @@ video {
 .mt-auto {
 	margin-top: auto;
 }
+.mb-6 {
+	margin-bottom: 1.5rem;
+}
 .mb-auto {
 	margin-bottom: auto;
 }
@@ -1061,6 +1065,9 @@ video {
 .-mt-1 {
 	margin-top: -0.25rem;
 }
+.mt-6 {
+	margin-top: 1.5rem;
+}
 .ml-4 {
 	margin-left: 1rem;
 }
@@ -1076,9 +1083,6 @@ video {
 .mb-1\.5 {
 	margin-bottom: 0.375rem;
 }
-.mt-6 {
-	margin-top: 1.5rem;
-}
 .mr-5 {
 	margin-right: 1.25rem;
 }
@@ -1133,15 +1137,18 @@ video {
 .h-6 {
 	height: 1.5rem;
 }
+.h-56 {
+	height: 14rem;
+}
+.h-4 {
+	height: 1rem;
+}
 .h-\[10px\] {
 	height: 10px;
 }
 .h-8 {
 	height: 2rem;
 }
-.h-56 {
-	height: 14rem;
-}
 .h-48 {
 	height: 12rem;
 }
@@ -1160,9 +1167,6 @@ video {
 .h-3 {
 	height: 0.75rem;
 }
-.h-4 {
-	height: 1rem;
-}
 .h-2 {
 	height: 0.5rem;
 }
@@ -1214,6 +1218,12 @@ video {
 .w-32 {
 	width: 8rem;
 }
+.w-4 {
+	width: 1rem;
+}
+.w-56 {
+	width: 14rem;
+}
 .w-48 {
 	width: 12rem;
 }
@@ -1232,9 +1242,6 @@ video {
 .w-72 {
 	width: 18rem;
 }
-.w-56 {
-	width: 14rem;
-}
 .w-2\/4 {
 	width: 50%;
 }
@@ -1409,6 +1416,11 @@ video {
 	margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
 	margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
 }
+.space-y-2\.5 > :not([hidden]) ~ :not([hidden]) {
+	--tw-space-y-reverse: 0;
+	margin-top: calc(0.625rem * calc(1 - var(--tw-space-y-reverse)));
+	margin-bottom: calc(0.625rem * var(--tw-space-y-reverse));
+}
 .space-y-6 > :not([hidden]) ~ :not([hidden]) {
 	--tw-space-y-reverse: 0;
 	margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
@@ -1429,6 +1441,11 @@ video {
 	margin-right: calc(1.25rem * var(--tw-space-x-reverse));
 	margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse)));
 }
+.space-y-8 > :not([hidden]) ~ :not([hidden]) {
+	--tw-space-y-reverse: 0;
+	margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
+	margin-bottom: calc(2rem * var(--tw-space-y-reverse));
+}
 .divide-x > :not([hidden]) ~ :not([hidden]) {
 	--tw-divide-x-reverse: 0;
 	border-right-width: calc(1px * var(--tw-divide-x-reverse));
@@ -1443,14 +1460,14 @@ video {
 	--tw-divide-opacity: 1;
 	border-color: rgba(var(--color-900), var(--tw-divide-opacity));
 }
-.divide-gray-400 > :not([hidden]) ~ :not([hidden]) {
-	--tw-divide-opacity: 1;
-	border-color: rgba(var(--color-400), var(--tw-divide-opacity));
-}
 .divide-gray-300 > :not([hidden]) ~ :not([hidden]) {
 	--tw-divide-opacity: 1;
 	border-color: rgba(var(--color-300), var(--tw-divide-opacity));
 }
+.divide-gray-400 > :not([hidden]) ~ :not([hidden]) {
+	--tw-divide-opacity: 1;
+	border-color: rgba(var(--color-400), var(--tw-divide-opacity));
+}
 .divide-red-300 > :not([hidden]) ~ :not([hidden]) {
 	--tw-divide-opacity: 1;
 	border-color: rgba(252, 165, 165, var(--tw-divide-opacity));
@@ -1692,6 +1709,22 @@ video {
 	--tw-bg-opacity: 1;
 	background-color: rgba(253, 230, 138, var(--tw-bg-opacity));
 }
+.bg-blue-200 {
+	--tw-bg-opacity: 1;
+	background-color: rgba(186, 230, 253, var(--tw-bg-opacity));
+}
+.bg-green-200 {
+	--tw-bg-opacity: 1;
+	background-color: rgba(187, 247, 208, var(--tw-bg-opacity));
+}
+.bg-pink-200 {
+	--tw-bg-opacity: 1;
+	background-color: rgba(251, 207, 232, var(--tw-bg-opacity));
+}
+.bg-purple-200 {
+	--tw-bg-opacity: 1;
+	background-color: rgba(233, 213, 255, var(--tw-bg-opacity));
+}
 .bg-blue-100 {
 	--tw-bg-opacity: 1;
 	background-color: rgba(224, 242, 254, var(--tw-bg-opacity));
@@ -1977,13 +2010,13 @@ video {
 	--tw-bg-opacity: 1;
 	background-color: rgba(54, 83, 20, var(--tw-bg-opacity));
 }
+.bg-gray-300\/40 {
+	background-color: rgba(var(--color-300), 0.4);
+}
 .bg-yellow-100 {
 	--tw-bg-opacity: 1;
 	background-color: rgba(254, 243, 199, var(--tw-bg-opacity));
 }
-.bg-gray-300\/40 {
-	background-color: rgba(var(--color-300), 0.4);
-}
 .bg-green-500 {
 	--tw-bg-opacity: 1;
 	background-color: rgba(34, 197, 94, var(--tw-bg-opacity));
@@ -1992,9 +2025,6 @@ video {
 	--tw-bg-opacity: 1;
 	background-color: rgba(239, 68, 68, var(--tw-bg-opacity));
 }
-.bg-opacity-40 {
-	--tw-bg-opacity: 0.4;
-}
 .bg-gradient-to-t {
 	background-image: linear-gradient(to top, var(--tw-gradient-stops));
 }
@@ -2145,14 +2175,14 @@ video {
 	padding-left: 1.25rem;
 	padding-right: 1.25rem;
 }
-.px-6 {
-	padding-left: 1.5rem;
-	padding-right: 1.5rem;
-}
 .py-24 {
 	padding-top: 6rem;
 	padding-bottom: 6rem;
 }
+.px-6 {
+	padding-left: 1.5rem;
+	padding-right: 1.5rem;
+}
 .py-0\.5 {
 	padding-top: 0.125rem;
 	padding-bottom: 0.125rem;
@@ -2212,6 +2242,9 @@ video {
 .pr-7 {
 	padding-right: 1.75rem;
 }
+.pt-2\.5 {
+	padding-top: 0.625rem;
+}
 .pt-28 {
 	padding-top: 7rem;
 }
@@ -2395,10 +2428,26 @@ video {
 	--tw-text-opacity: 1;
 	color: rgba(186, 230, 253, var(--tw-text-opacity));
 }
+.text-blue-600 {
+	--tw-text-opacity: 1;
+	color: rgba(2, 132, 199, var(--tw-text-opacity));
+}
+.text-pink-600 {
+	--tw-text-opacity: 1;
+	color: rgba(219, 39, 119, var(--tw-text-opacity));
+}
+.text-purple-600 {
+	--tw-text-opacity: 1;
+	color: rgba(147, 51, 234, var(--tw-text-opacity));
+}
 .text-red-200 {
 	--tw-text-opacity: 1;
 	color: rgba(254, 202, 202, var(--tw-text-opacity));
 }
+.text-green-400 {
+	--tw-text-opacity: 1;
+	color: rgba(74, 222, 128, var(--tw-text-opacity));
+}
 .text-\[\#dc2626\] {
 	--tw-text-opacity: 1;
 	color: rgba(220, 38, 38, var(--tw-text-opacity));
@@ -3010,6 +3059,25 @@ video {
 	.btn-yellow:focus {
 	--tw-text-opacity: 1;
 	color: rgba(var(--color-200), var(--tw-text-opacity));
+}
+	.btn-purple {
+	--tw-border-opacity: 1;
+	border-color: rgba(88, 28, 135, var(--tw-border-opacity));
+	background-image: linear-gradient(to top, var(--tw-gradient-stops));
+	--tw-gradient-from: #7e22ce;
+	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(126, 34, 206, 0));
+	--tw-gradient-to: #9333ea;
+	--tw-text-opacity: 1;
+	color: rgba(var(--color-100), var(--tw-text-opacity));
+}
+	.btn-purple:hover {
+	--tw-gradient-from: #9333ea;
+	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(147, 51, 234, 0));
+	--tw-gradient-to: #7e22ce;
+}
+	.btn-purple:focus {
+	--tw-text-opacity: 1;
+	color: rgba(var(--color-200), var(--tw-text-opacity));
 }
 	.btn-black {
 	border-color: rgba(0, 0, 0, 0.1);
@@ -3210,6 +3278,15 @@ video {
 	text-transform: uppercase !important;
 }
 
+.first\:pt-0:first-child {
+	padding-top: 0px;
+}
+
+.odd\:bg-gray-300:nth-child(odd) {
+	--tw-bg-opacity: 1;
+	background-color: rgba(var(--color-300), var(--tw-bg-opacity));
+}
+
 .odd\:bg-gray-200:nth-child(odd) {
 	--tw-bg-opacity: 1;
 	background-color: rgba(var(--color-200), var(--tw-bg-opacity));
@@ -3226,6 +3303,10 @@ video {
 	transform: var(--tw-transform);
 }
 
+.hover\:cursor-pointer:hover {
+	cursor: pointer;
+}
+
 .hover\:border-gray-400:hover {
 	--tw-border-opacity: 1;
 	border-color: rgba(var(--color-400), var(--tw-border-opacity));
@@ -3246,15 +3327,15 @@ video {
 	background-color: rgba(var(--color-700), var(--tw-bg-opacity));
 }
 
-.hover\:bg-black\/30:hover {
-	background-color: rgba(0, 0, 0, 0.3);
-}
-
 .hover\:bg-gray-400:hover {
 	--tw-bg-opacity: 1;
 	background-color: rgba(var(--color-400), var(--tw-bg-opacity));
 }
 
+.hover\:bg-black\/30:hover {
+	background-color: rgba(0, 0, 0, 0.3);
+}
+
 .hover\:bg-gray-100:hover {
 	--tw-bg-opacity: 1;
 	background-color: rgba(var(--color-100), var(--tw-bg-opacity));
@@ -3354,6 +3435,11 @@ video {
 	color: rgba(255, 255, 255, var(--tw-text-opacity));
 }
 
+.hover\:text-yellow-400:hover {
+	--tw-text-opacity: 1;
+	color: rgba(251, 191, 36, var(--tw-text-opacity));
+}
+
 .hover\:text-green-700:hover {
 	--tw-text-opacity: 1;
 	color: rgba(21, 128, 61, var(--tw-text-opacity));
@@ -3416,6 +3502,11 @@ video {
 	background-image: linear-gradient(to top, var(--tw-gradient-stops));
 }
 
+.focus\:from-gray-100:focus {
+	--tw-gradient-from: rgb(var(--color-100));
+	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(var(--color-100), 0));
+}
+
 .focus\:from-red-800:focus {
 	--tw-gradient-from: #991b1b;
 	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(153, 27, 27, 0));
@@ -3426,16 +3517,15 @@ video {
 	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(217, 119, 6, 0));
 }
 
-.focus\:from-gray-100:focus {
-	--tw-gradient-from: rgb(var(--color-100));
-	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(var(--color-100), 0));
-}
-
 .focus\:from-green-800:focus {
 	--tw-gradient-from: #166534;
 	--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(22, 101, 52, 0));
 }
 
+.focus\:to-gray-200:focus {
+	--tw-gradient-to: rgb(var(--color-200));
+}
+
 .focus\:to-red-700:focus {
 	--tw-gradient-to: #b91c1c;
 }
@@ -3444,10 +3534,6 @@ video {
 	--tw-gradient-to: #f59e0b;
 }
 
-.focus\:to-gray-200:focus {
-	--tw-gradient-to: rgb(var(--color-200));
-}
-
 .focus\:to-green-700:focus {
 	--tw-gradient-to: #15803d;
 }
@@ -3574,6 +3660,11 @@ video {
 	        animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
 }
 
+.group:hover .group-hover\:text-primary {
+	--tw-text-opacity: 1;
+	color: rgba(var(--color-primary), var(--tw-text-opacity));
+}
+
 .peer:checked ~ .peer-checked\:border-blue-500 {
 	--tw-border-opacity: 1;
 	border-color: rgba(14, 165, 233, var(--tw-border-opacity));
@@ -3593,6 +3684,11 @@ video {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.dark .dark\:divide-gray-700 > :not([hidden]) ~ :not([hidden]) {
+	--tw-divide-opacity: 1;
+	border-color: rgba(var(--color-700), var(--tw-divide-opacity));
+}
+
 .dark .dark\:border-b {
 	border-bottom-width: 1px;
 }
@@ -3686,11 +3782,29 @@ video {
 	color: rgba(var(--color-300), var(--tw-text-opacity));
 }
 
+.dark .dark\:text-gray-700 {
+	--tw-text-opacity: 1;
+	color: rgba(var(--color-700), var(--tw-text-opacity));
+}
+
+.dark .dark\:odd\:bg-white\/\[\.05\]:nth-child(odd) {
+	background-color: rgba(255, 255, 255, .05);
+}
+
 .dark .dark\:visited\:text-gray-400:visited {
 	--tw-text-opacity: 1;
 	color: rgba(var(--color-400), var(--tw-text-opacity));
 }
 
+.dark .dark\:hover\:bg-white\/10:hover {
+	background-color: rgba(255, 255, 255, 0.1);
+}
+
+.dark .dark\:hover\:bg-gray-700:hover {
+	--tw-bg-opacity: 1;
+	background-color: rgba(var(--color-700), var(--tw-bg-opacity));
+}
+
 .dark .dark\:hover\:bg-gray-600:hover {
 	--tw-bg-opacity: 1;
 	background-color: rgba(var(--color-600), var(--tw-bg-opacity));
@@ -3706,6 +3820,11 @@ video {
 	color: rgba(var(--color-400), var(--tw-text-opacity));
 }
 
+.dark .dark\:hover\:text-primary:hover {
+	--tw-text-opacity: 1;
+	color: rgba(var(--color-primary), var(--tw-text-opacity));
+}
+
 .dark .dark\:focus\:bg-transparent:focus {
 	background-color: transparent;
 }
@@ -3788,15 +3907,15 @@ video {
 		padding-right: 0px;
 	}
 
-	.sm\:text-lg {
-		font-size: 1.125rem;
-		line-height: 1.75rem;
-	}
-
 	.sm\:text-base {
 		font-size: 1rem;
 		line-height: 1.5rem;
 	}
+
+	.sm\:text-lg {
+		font-size: 1.125rem;
+		line-height: 1.75rem;
+	}
 }
 
 @media (min-width: 768px) {
@@ -3809,6 +3928,11 @@ video {
 		margin: 0px;
 	}
 
+	.md\:my-3 {
+		margin-top: 0.75rem;
+		margin-bottom: 0.75rem;
+	}
+
 	.md\:mt-6 {
 		margin-top: 1.5rem;
 	}
@@ -3869,6 +3993,10 @@ video {
 		height: 5rem;
 	}
 
+	.md\:h-12 {
+		height: 3rem;
+	}
+
 	.md\:w-4 {
 		width: 1rem;
 	}
@@ -3893,6 +4021,10 @@ video {
 		width: 50%;
 	}
 
+	.md\:w-12 {
+		width: 3rem;
+	}
+
 	.md\:max-w-xl {
 		max-width: 36rem;
 	}
@@ -3913,6 +4045,10 @@ video {
 		justify-content: center;
 	}
 
+	.md\:justify-around {
+		justify-content: space-around;
+	}
+
 	.md\:space-x-3 > :not([hidden]) ~ :not([hidden]) {
 		--tw-space-x-reverse: 0;
 		margin-right: calc(0.75rem * var(--tw-space-x-reverse));
@@ -3995,6 +4131,10 @@ video {
 		padding: 0.75rem;
 	}
 
+	.md\:p-5 {
+		padding: 1.25rem;
+	}
+
 	.md\:py-3 {
 		padding-top: 0.75rem;
 		padding-bottom: 0.75rem;
@@ -4025,6 +4165,11 @@ video {
 		padding-right: 0.75rem;
 	}
 
+	.md\:py-4 {
+		padding-top: 1rem;
+		padding-bottom: 1rem;
+	}
+
 	.md\:pl-3 {
 		padding-left: 0.75rem;
 	}
@@ -4049,6 +4194,10 @@ video {
 		padding-top: 0.25rem;
 	}
 
+	.md\:pl-4 {
+		padding-left: 1rem;
+	}
+
 	.md\:text-xl {
 		font-size: 1.25rem;
 		line-height: 1.75rem;
@@ -4064,6 +4213,16 @@ video {
 		line-height: 2.25rem;
 	}
 
+	.md\:text-base {
+		font-size: 1rem;
+		line-height: 1.5rem;
+	}
+
+	.md\:text-lg {
+		font-size: 1.125rem;
+		line-height: 1.75rem;
+	}
+
 	.md\:hover\:opacity-100:hover {
 		opacity: 1;
 	}
diff --git a/files/static/src/main.css b/files/static/src/main.css
index 84951e7dc..13682071e 100644
--- a/files/static/src/main.css
+++ b/files/static/src/main.css
@@ -407,6 +407,9 @@
 	.btn-yellow {
 		@apply bg-gradient-to-t from-yellow-700 to-yellow-600 hover:from-yellow-600 hover:to-yellow-700 border-yellow-900 text-gray-100 focus:text-gray-200;
 	}
+	.btn-purple {
+		@apply bg-gradient-to-t from-purple-700 to-purple-600 hover:from-purple-600 hover:to-purple-700 border-purple-900 text-gray-100 focus:text-gray-200;
+	}
 	.btn-black {
 		@apply bg-white bg-gradient-to-t from-black to-black/80 hover:from-black/90 hover:to-black border-black/10 text-gray-100 focus:text-gray-200;
 	}
diff --git a/files/templates/CHRISTMAS/admin/admin_home.html b/files/templates/CHRISTMAS/admin/admin_home.html
index ffff55435..75b685001 100644
--- a/files/templates/CHRISTMAS/admin/admin_home.html
+++ b/files/templates/CHRISTMAS/admin/admin_home.html
@@ -1,3 +1,167 @@
+{%
+	set stats = [
+		{
+			'stat': 'users',
+			'count': '6,506',
+			'description': 'up 12% since last month'
+		},
+		{
+			'stat': 'posts',
+			'count': '60,506',
+			'description': 'up 6% since last month'
+		},
+		{
+			'stat': 'comments',
+			'count': '495,267',
+			'description': 'up 2% since last month'
+		}
+	]
+%}
+
+
+{%
+  set sections = [
+  	{
+		'title': 'content',
+		'color': 'red',
+		'content': [
+	    {
+			'icon': 'fa-pencil',
+			'title': 'Reported Posts',
+			'description': 'Community-flagged posts',
+			'link': '/admin/reported/posts'
+	    },
+	    {
+			'icon': 'fa-comment-alt',
+			'title': 'Reported Comments',
+			'description': 'Community-flagged comments',
+			'link': '/admin/reported/comments'
+	    },
+	    {
+			'icon': 'fa-image',
+			'title': 'Image Posts',
+			'description': 'User-uploaded media',
+			'link': '/admin/image_posts'
+	    },
+	    {
+			'icon': 'fa-align-slash',
+			'title': 'Removed Posts',
+			'description': 'Posts removed by mods',
+			'link': '/admin/removed/posts'
+	    },
+	    {
+			'icon': 'fa-comment-alt-slash',
+			'title': 'Removed Comments',
+			'description': 'Comments removed by mods',
+			'link': '/admin/removed/comments'
+	    }
+	  ]
+	},
+	{
+		'title': 'users',
+		'color': 'blue',
+		'content': [
+	    {
+			'icon': 'fa-ghost',
+			'title': 'Shadow Banned',
+			'description': 'Users currently shadow banned',
+			'link': '/admin/shadowbanned'
+	    },
+	    {
+			'icon': 'fa-republican',
+			'title': 'Agenda Posters',
+			'description': 'Users with agenda poster mode',
+			'link': '/admin/agendaposters'
+	    },
+	    {
+			'icon': 'fa-seedling',
+			'title': 'Grass Award',
+			'description': 'Users with active grass award',
+			'link': '/admin/grassed'
+	    },
+	    {
+			'icon': 'fa-users',
+			'title': 'Users Feed',
+			'description': 'Updated feed of sign ups',
+			'link': '/admin/users'
+	    }
+	  ]
+	},
+	{
+		'title': 'grant',
+		'color': 'pink',
+		'content': [
+	    {
+			'icon': 'fa-trophy',
+			'title': 'Give Award',
+			'description': 'Give users awards',
+			'link': '/admin/awards'
+	    },
+	    {
+			'icon': 'fa-badge',
+			'title': 'Grant Badge',
+			'description': 'Grant users badges',
+			'link': '/admin/badge_grant'
+	    }
+	  ]
+	},
+	{
+		'title': 'safety',
+		'color': 'green',
+		'content': [
+	    {
+			'icon': 'fa-ban',
+			'title': 'Banned Domains',
+			'description': 'Domains banned site-wide',
+			'link': '/admin/banned_domains'
+	    },
+	    {
+			'icon': 'fa-search',
+			'title': 'Vote Fraud Analysis',
+			'description': 'Check alt-account voting',
+			'link': '/admin/alt_votes'
+	    }
+	  ]
+	},
+	{
+		'title': 'Metrics',
+		'color': 'purple',
+		'content': [
+	    {
+			'icon': 'fa-list-ol',
+			'title': 'Content stats',
+			'description': 'Post, comment, etc. numbers',
+			'link': '/stats'
+	    },
+	    {
+			'icon': 'fa-chart-bar',
+			'title': 'Content charts',
+			'description': 'Visualize site stats',
+			'link': '/charts'
+	    }
+	  ]
+	},
+	{
+		'title': 'Meta',
+		'color': 'gray',
+		'content': [
+	    {
+			'icon': 'fa-wrench',
+			'title': 'API access',
+			'description': 'Approved apps',
+			'link': '/admin/apps'
+	    },
+	    {
+			'icon': 'fa-columns',
+			'title': 'Sidebar',
+			'description': 'Edit the frontpage sidebar',
+			'link': '/admin/sidebar'
+	    }
+	  ]
+	}
+  ]
+%}
+
 {% extends "CHRISTMAS/default.html" %}
 
 {% block title %}
@@ -5,56 +169,94 @@
 <meta name="description" content="{{'SITE_NAME' | app_config}} Help">
 {% endblock %}
 
-{% block content %}
-<div class="col-span-full">
-	<h3>Admin Tools</h3>
-
-	<h4>Content</h4>
-	<ul>
-		<li><a href="/admin/reported/posts">Reported Posts</a></li>
-		<li><a href="/admin/reported/comments">Reported Comments</a></li>
-		<li><a href="/admin/image_posts">Image Posts</a></li>
-		<li><a href="/admin/removed">Removed Posts</a></li>
-	</ul>
-
-	<h4>Users</h4>
-	<ul>
-		<li><a href="/admin/shadowbanned">Shadowbanned Users</a></li>
-		<li><a href="/admin/agendaposters">Users with Agendaposter Theme</a></li>
-		<li><a href="/admin/users">Users Feed</a></li>
-	</ul>
-
-	<h4>Safety</h4>
-	<ul>
-		<li><a href="/admin/banned_domains">Banned Domains</a></li>
-		<li><a href="/admin/alt_votes">Multi Vote Analysis</a></li>
-	</ul>
-
-	<h4>Grant</h4>
-	<ul>
-		<li><a href="/admin/awards">Give User Award</a></li>
-		<li><a href="/admin/badge_grant">Badges</a></li>
-	</ul>
-
-	<h4>API Access Control</h4>
-	<ul>
-		<li><a href="/admin/apps">Apps</a></li>
-	</ul>
-
-	<h4>Statistics</h4>
-	<ul>
-		<li><a href="/stats">Content Stats</a></li>
-		<li><a href="/chart">Stat Chart</a></li>
-	</ul>
-
-	<h4>Configuration</h4>
-	<ul>
-		<li><a href="/admin/rules">Site Rules</a></li>
-	</ul>
-
-	<div>
-		<input type="checkbox" id="disablesignups" name="disablesignups" {% if x == "yes" %}checked{% endif %} onchange="post_toast('/admin/disablesignups');">
-		<label class="label" for="disablesignups">Disable signups</label>
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+		<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Admin Dashboard
+			</h1>
+			<small class="block text-gray-700 dark:text-gray-400">
+				Welcome agent, <strong>#{{ v.id }}</strong>.
+			</small>
+		</div>
+		<div class="ml-auto flex space-x-2">
+			<a href="/log?admin={{ v.username }}" class="btn btn-primary">
+				<i class="fas fa-list fa-sm fa-fw mr-1"></i>
+				Your activity
+			</a>
+			<a href="/notifications?modmail=true" class="btn btn-green">
+				<i class="fas fa-envelope fa-sm fa-fw mr-1"></i>
+				Mod mail
+			</a>
+			<span class="hidden md:inline-block">
+				<a href="https://github.com/Aevann1/Drama" class="btn btn-purple">
+					<i class="fab fa-github fa-sm fa-fw mr-1"></i>
+					GitHub repo
+				</a>
+			</span>
+		</div>
 	</div>
 </div>
+{% endblock %}
+
+{% block content %}
+<div class="col-span-full xl:col-span-9 bg-gray-200 dark:bg-gray-800 p-4 md:px-0 space-y-8">
+
+	<!-- <div class="hidden">
+		<h2 class="hidden font-bold text-2xl md:text-3xl  font-heading leading-normal mb-4 pb-3 border-b border-gray-300 dark:border-gray-700">
+			Metrics
+		</h2>
+		<div class="p-4 md:p-5 flex justify-between md:justify-around space-x-4 items-center rounded-md bg-gray-300 dark:bg-gray-700 shadow-inset-t-white-10 border border-gray-400 dark:border-gray-900">
+			{% for section in stats %}
+				<div class="md:px-5">
+					<div class="text-black dark:text-gray-500 uppercase font-bold text-xs tracking-wider leading-4 mb-2">
+						{{ section.stat }}
+					</div>
+					<h2 class="font-bold text-lg md:text-3xl font-heading leading-normal mb-2 text-shadow-light text-black dark:text-gray-200">{{ section.count }}</h2>
+					<p class="flex items-center text-xs md:text-base text-gray-700 dark:text-gray-300">
+						<i class="fas fa-caret-up text-lg text-green-400 mr-2"></i>
+						<span>{{ section.description }}</span>
+					</p>
+				</div>
+			{% endfor %}
+		</div>
+	</div>
+ -->
+	<div>
+		<h2 class="hidden font-bold text-2xl md:text-3xl  font-heading leading-normal mb-4 pb-3 border-b border-gray-300 dark:border-gray-700">
+			Links
+		</h2>
+		{% for section in sections %}
+			<h2 class="font-bold text-lg font-heading leading-normal mb-0 capitalize">
+				{{ section.title }}
+			</h2>
+			<div class="flex flex-wrap -mx-3 overflow-hidden mb-6">
+				{% for item in section.content %}
+				<div class="my-2 md:my-3 px-3 w-full md:w-1/2 overflow-hidden lg:w-1/3">
+					<a href="{{ item.link }}" class="flex items-center p-3 md:px-5 md:py-4 rounded border border-gray-400 dark:border-gray-700 hover:bg-gray-300 dark:hover:bg-gray-700 h-full">
+						<div class="flex flex-shrink-0 items-center justify-center w-9 h-9 md:w-12 md:h-12 rounded-sm bg-{{ section.color }}-200 shadow-inner-white-10">
+							<i class="fas {{ item.icon }} fa-fw md:text-lg text-{{ section.color }}-600"></i>
+						</div>
+						<div class="pl-3 md:pl-4">
+							<h3 class="font-bold text-base font-heading leading-normal mb-0 capitalize text-black dark:text-gray-200 break-words" style="word-break: break-word;">
+								{{ item.title }}
+							</h3>
+							<p class="text-sm md:text-base text-gray-500 break-words" style="word-break: break-word;">
+								{{ item.description }}
+							</p>
+						</div>
+					</a>
+				</div>
+				{% endfor %}
+			</div>
+		{% endfor %}
+	</div>
+
+</div>
+{% endblock %}
+
+{% block sidebar %}
+	{% include 'CHRISTMAS/sidebars/AdminSidebar.html' %}
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/admin/alt_votes.html b/files/templates/CHRISTMAS/admin/alt_votes.html
index 3e54a2ff9..68a0ac1b1 100644
--- a/files/templates/CHRISTMAS/admin/alt_votes.html
+++ b/files/templates/CHRISTMAS/admin/alt_votes.html
@@ -5,85 +5,117 @@
 <meta name="description" content="{{'SITE_NAME' | app_config}} Help">
 {% endblock %}
 
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Vote Analysis
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Vote Analysis</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+{% endblock %}
+
 {% block content %}
-<div class="col-span-full my-4">
-<pre>
+<div class="col-span-full my-4 space-y-6">
 
+	<div class="p-5 flex flex-col rounded-md bg-gray-300 dark:bg-gray-700 shadow-inset-t-white-10 border border-gray-400 dark:border-gray-900">
+		<h2 class="font-bold text-lg font-heading leading-normal mb-0 capitalize">
+			Vote Info
+		</h2>
+		<form action="/admin/alt_votes" method="get">
+			<label class="label">
+				Usernames
+			</label>
+			<div class="w-full flex space-x-2 items-center">
+				<input id="link-input" type="text" class="form-input" name="u1" value="{{u1.username if u1 else ''}}" placeholder="User #1" required>
+				<input id="link-input" type="text" class="form-input" name="u2" value="{{u2.username if u2 else ''}}" placeholder="User #2" oninput="document.getElementById('analysis-btn').disabled=false" required>
+				<input id="analysis-btn" type="submit" value="Analyze" class="btn btn-primary">
+			</div>
+		</form>
+	</div>
 
+	{% if u1 and u2 %}
+	<div class="p-5 flex flex-col rounded-md bg-gray-300 dark:bg-gray-700 shadow-inset-t-white-10 border border-gray-400 dark:border-gray-900">
+		<h2 class="font-bold text-lg font-heading leading-normal mb-0 capitalize">
+			Analysis
+		</h2>
+		<table class="w-full table table-striped mb-5">
+			<thead class="bg-primary text-white">
+				<tr>
+					<th></th>
+					<th>@{{u1.username}} only(% unique)</th>
+					<th>Both</th>
+					<th>@{{u2.username}} only (% unique)</th>
+				</tr>
+			</thead>
 
-</pre>
-<h5>Vote Info</h5>
+			<tr>
+				<td><b>Post Upvotes</b></td>
+				<td>{{data['u1_only_post_ups']}} ({{data['u1_post_ups_unique']}}%)</td>
+				<td>{{data['both_post_ups']}}</td>
+				<td>{{data['u2_only_post_ups']}} ({{data['u2_post_ups_unique']}}%)</td>
+			</tr>
+			<tr>
+				<td><b>Post Downvotes</b></td>
+				<td>{{data['u1_only_post_downs']}} ({{data['u1_post_downs_unique']}}%)</td>
+				<td>{{data['both_post_downs']}}</td>
+				<td>{{data['u2_only_post_downs']}} ({{data['u2_post_downs_unique']}}%)</td>
+			</tr>
+			<tr>
+				<td><b>Comment Upvotes</b></td>
+				<td>{{data['u1_only_comment_ups']}} ({{data['u1_comment_ups_unique']}}%)</td>
+				<td>{{data['both_comment_ups']}}</td>
+				<td>{{data['u2_only_comment_ups']}} ({{data['u2_comment_ups_unique']}}%)</td>
+			</tr>
+			<tr>
+				<td><b>Comment Downvotes</b></td>
+				<td>{{data['u1_only_comment_downs']}} ({{data['u1_comment_downs_unique']}}%)</td>
+				<td>{{data['both_comment_downs']}}</td>
+				<td>{{data['u2_only_comment_downs']}} ({{data['u2_comment_downs_unique']}}%)</td>
+			</tr>
+		</table>
+	</div>
 
-<form action="/admin/alt_votes" method="get" class="mb-6">
-	<label for="link-input">Usernames</label>
-	<input id="link-input" type="text" class="form-control mb-2" name="u1" value="{{u1.username if u1 else ''}}" placeholder="User 1">
-	<input id="link-input" type="text" class="form-control mb-2" name="u2" value="{{u2.username if u2 else ''}}" placeholder="User 2">
-	<input type="submit" value="Submit" class="btn btn-primary">
-</form>
+	<div class="p-5 flex flex-col rounded-md bg-gray-300 dark:bg-gray-700 shadow-inset-t-white-10 border border-gray-400 dark:border-gray-900">
+		<h2 class="font-bold text-lg font-heading leading-normal mb-0 capitalize">
+			Link Acocunts
+		</h2>
+		{% if u2 in u1.alts %}
+		<p>Accounts are known alts of eachother.</p>
+		{% else %}
 
-{% if u1 and u2 %}
+		<p>Two accounts controlled by different people should have most uniqueness percentages at or above 70-80%</p>
+		<p>A sockpuppet account will have its uniqueness percentages significantly lower.</p>
 
+		<button class="btn btn-gray" onclick="document.getElementById('link-form').classList.toggle('hidden');">
+			Link Accounts
+		</button>
 
-<h2>Analysis</h2>
+		<form action="/admin/link_accounts" method="post" id="link-form" class="hidden mt-2">
+			<input type="hidden" name="formkey" value="{{v.formkey}}">
+			<input type="hidden" name="u1" value="{{u1.id}}">
+			<input type="hidden" name="u2" value="{{u2.id}}">
+			<input type="submit" class="btn btn-red" value="Confirm Link: @{{u1.username}} and @{{u2.username}}">
+		</form>
+	</div>
 
+	{% endif %}
 
-
-<table class="w-full table table-striped mb-5">
-	<thead class="bg-primary text-white">
-		<tr>
-			<th></th>
-			<th>@{{u1.username}} only(% unique)</th>
-			<th>Both</th>
-			<th>@{{u2.username}} only (% unique)</th>
-		</tr>
-	</thead>
-
-	<tr>
-		<td><b>Post Upvotes</b></td>
-		<td>{{data['u1_only_post_ups']}} ({{data['u1_post_ups_unique']}}%)</td>
-		<td>{{data['both_post_ups']}}</td>
-		<td>{{data['u2_only_post_ups']}} ({{data['u2_post_ups_unique']}}%)</td>
-	</tr>
-	<tr>
-		<td><b>Post Downvotes</b></td>
-		<td>{{data['u1_only_post_downs']}} ({{data['u1_post_downs_unique']}}%)</td>
-		<td>{{data['both_post_downs']}}</td>
-		<td>{{data['u2_only_post_downs']}} ({{data['u2_post_downs_unique']}}%)</td>
-	</tr>
-	<tr>
-		<td><b>Comment Upvotes</b></td>
-		<td>{{data['u1_only_comment_ups']}} ({{data['u1_comment_ups_unique']}}%)</td>
-		<td>{{data['both_comment_ups']}}</td>
-		<td>{{data['u2_only_comment_ups']}} ({{data['u2_comment_ups_unique']}}%)</td>
-	</tr>
-	<tr>
-		<td><b>Comment Downvotes</b></td>
-		<td>{{data['u1_only_comment_downs']}} ({{data['u1_comment_downs_unique']}}%)</td>
-		<td>{{data['both_comment_downs']}}</td>
-		<td>{{data['u2_only_comment_downs']}} ({{data['u2_comment_downs_unique']}}%)</td>
-	</tr>
-</table>
-
-<h2>Link Accounts</h2>
-
-{% if u2 in u1.alts %}
-<p>Accounts are known alts of eachother.</p>
-{% else %}
-
-<p>Two accounts controlled by different people should have most uniqueness percentages at or above 70-80%</p>
-<p>A sockpuppet account will have its uniqueness percentages significantly lower.</p>
-
-<a href="javascript:void(0)" class="btn btn-secondary" onclick="document.getElementById('linkbtn').classList.toggle('d-none');">Link Accounts</a>
-<form action="/admin/link_accounts" method="post">
-	<input type="hidden" name="formkey" value="{{v.formkey}}">
-	<input type="hidden" name="u1" value="{{u1.id}}">
-	<input type="hidden" name="u2" value="{{u2.id}}">
-	<input type="submit" id="linkbtn" class="btn btn-primary d-none" value="Confirm Link: {{u1.username}} and {{u2.username}}">
-</form>
-
-{% endif %}
-
-{% endif %}
+	{% endif %}
 
 </div>
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/admin/apps.html b/files/templates/CHRISTMAS/admin/apps.html
index c9f963a3d..e5474d1b2 100644
--- a/files/templates/CHRISTMAS/admin/apps.html
+++ b/files/templates/CHRISTMAS/admin/apps.html
@@ -5,6 +5,36 @@
 <meta name="description" content="{{'SITE_NAME' | app_config}} Help">
 {% endblock %}
 
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				API Access
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">API Access</a>
+				</li>
+			</ul>
+		</div>
+		<div class="ml-auto">
+			<a href="https://github.com/Aevann1/Drama" class="btn btn-black">
+				<i class="fab fa-github fa-sm fa-fw mr-1"></i>
+				GitHub Repo
+			</a>
+		</div>
+	</div>
+</div>
+{% endblock %}
+
 {% block content %}
 <div class="col-span-full my-4">
 	{% for app in apps %}
diff --git a/files/templates/CHRISTMAS/admin/awards.html b/files/templates/CHRISTMAS/admin/awards.html
index 847eb6fdb..8cfeba731 100644
--- a/files/templates/CHRISTMAS/admin/awards.html
+++ b/files/templates/CHRISTMAS/admin/awards.html
@@ -6,8 +6,43 @@
 
 {% block pagetype %}message{% endblock %}
 
-{% block content %}
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Awards
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Awards</a>
+				</li>
+			</ul>
+		</div>
+		<div class="ml-auto flex space-x-2">
+			<button id="submit-btn" type="submit" form="awards-form" class="btn btn-green" disabled>
+				<i class="fas fa-trophy fa-sm fa-fw mr-1"></i>
+				Give awards
+			</button>
+			{% if 'rdrama.net' not in request.host or v.admin_level > 2 %}
+			<button onclick="post_toast('/admin/monthly')" class="btn btn-yellow">
+				<i class="fas fa-dollar-sign fa-sm fa-fw mr-1"></i>
+				Grant monthly MarseyBux
+			</button>
+			{% endif %}
+		</div>
+	</div>
+</div>
+{% endblock %}
 
+{% block content %}
 <div class="col-span-full my-4">
 
 	{% if error %}
@@ -33,41 +68,45 @@
 	</div>
 	{% endif %}
 
-	<pre></pre>
-	<pre></pre>
-	<h5>User Award Grant</h5>
-
-	<form action="/admin/awards", method="post">
+	<form id="awards-form" action="/admin/awards" method="post">
 		<input type="hidden" name="formkey" value="{{v.formkey}}">
-		<label for="input-username">Username</label><br>
-		<input id="input-username" class="form-input mb-3" type="text" name="username" required>
+		<label for="input-username" class="label">Username</label>
+		<input autocomplete="off" id="input-username" class="form-input mb-2" type="text" name="username" required placeholder="Enter a username" oninput="document.getElementById('submit-btn').disabled = false">
 
-		<table class="w-full table table-striped">
+		<table class="w-full mt-6">
 			<thead class="bg-primary text-white">
 				<tr>
-					<th scope="col">Icon</th>
-					<th scope="col">Title</th>
-					<th scope="col">Amount</th>
+					<th scope="col" class="p-2.5">Icon</th>
+					<th scope="col" class="p-2.5">Title</th>
+					<th scope="col" class="p-2.5"></th>
+					<th scope="col" class="p-2.5"></th>
+					<th scope="col" class="p-2.5"></th>
+					<th scope="col" class="p-2.5"></th>
+					<th scope="col" class="p-2.5">Amount</th>
 				</tr>
 			</thead>
 			<tbody>
 			{% for a in awards %}
-				<tr>
-					<td><i class="{{a['icon']}} {{a['color']}}" style="font-size: 30px"></i></td>
-					<td style="font-weight: bold">{{a['title']}}</td>
-					<td><input type="number" class="form-input" name="{{a['kind']}}" value="0" min="0" max="10" placeholder="Enter amount..." ></td>
+				<tr class="odd:bg-gray-300 dark:odd:bg-white/[.05] hover:bg-gray-400 dark:hover:bg-white/10 hover:cursor-pointer">
+					<td class="px-2.5">
+						<div class="w-16 h-16 p-2 flex items-center justify-center">
+							<i class="{{a['icon']}} {{a['color']}} text-xl"></i>
+						</div>
+					</td>
+					<td class="px-2.5 font-bold">
+						{{a['title']}}
+					</td>
+					<td></td>
+					<td></td>
+					<td></td>
+					<td></td>
+					<td class="px-2.5">
+						<input type="number" class="form-input" name="{{a['kind']}}" value="0" min="0" max="10" placeholder="Enter amount..." >
+					</td>
 				</tr>
 			{% endfor %}
 		</table>
-
-		<input class="btn btn-green mt-3" type="submit" value="Grant Awards">
-
 	</form>
 
-	<pre></pre>
-	{% if 'rdrama.net' not in request.host or v.admin_level > 2 %}
-		<div><a class="btn btn-green mt-3" href="javascript:void(0)" onclick="post_toast('/admin/monthly')">Grant Monthly Marseybux</a></div>
-	{% endif %}
-
 </div>
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/admin/badge_grant.html b/files/templates/CHRISTMAS/admin/badge_grant.html
index a282d2230..c79cbe671 100644
--- a/files/templates/CHRISTMAS/admin/badge_grant.html
+++ b/files/templates/CHRISTMAS/admin/badge_grant.html
@@ -6,76 +6,101 @@
 
 {% block pagetype %}message{% endblock %}
 
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Badge Grant
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Badge Grant</a>
+				</li>
+			</ul>
+		</div>
+		<div class="ml-auto">
+			<button type="submit" form="badge-grant-form" class="btn btn-green">
+				<i class="fas fa-badge fa-sm fa-fw mr-1"></i>
+				Give badge
+			</button>
+		</div>
+	</div>
+</div>
+{% endblock %}
+
 {% block content %}
 <div class="col-span-full my-2 px-2.5 md:px-0">
 
-		{% if error %}
-		<div class="alert alert-danger alert-dismissible fade show my-3" role="alert">
-			<i class="fas fa-exclamation-circle my-auto"></i>
-			<span>
-				{{error}}
-			</span>
-			<button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
-				<span aria-hidden="true"><i class="far fa-times"></i></span>
-			</button>
-		</div>
-		{% endif %}
-		{% if msg %}
-		<div class="alert alert-success alert-dismissible fade show my-3" role="alert">
-			<i class="fas fa-check-circle my-auto" aria-hidden="true"></i>
-			<span>
-				{{msg}}
-			</span>
-			<button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
-				<span aria-hidden="true"><i class="far fa-times"></i></span>
-			</button>
-		</div>
-		{% endif %}
-
-<pre></pre>
-<pre></pre>
-<h5>Badge Grant</h5>
-
-<form action="/admin/badge_grant" method="post">
-<input type="hidden" name="formkey" value="{{v.formkey}}">
+	{% if error %}
+	<div class="alert alert-danger alert-dismissible fade show my-3" role="alert">
+		<i class="fas fa-exclamation-circle my-auto"></i>
+		<span>
+			{{error}}
+		</span>
+		<button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
+			<span aria-hidden="true"><i class="far fa-times"></i></span>
+		</button>
+	</div>
+	{% endif %}
+	{% if msg %}
+	<div class="alert alert-success alert-dismissible fade show my-3" role="alert">
+		<i class="fas fa-check-circle my-auto" aria-hidden="true"></i>
+		<span>
+			{{msg}}
+		</span>
+		<button type="button" class="close" data-bs-dismiss="alert" aria-label="Close">
+			<span aria-hidden="true"><i class="far fa-times"></i></span>
+		</button>
+	</div>
+	{% endif %}
 
 
-<label for="input-username" class="label">Username</label>
-<input id="input-username" class="form-input mb-4" type="text" name="username" required placeholder="Enter a username">
+	<form id="badge-grant-form" action="/admin/badge_grant" method="post">
+		<input type="hidden" name="formkey" value="{{v.formkey}}">
 
-<table class="w-full table table-striped">
-<thead class="bg-primary text-white">
-		<tr>
-			<th scope="col">Select</th>
-			<th scope="col">Image</th>
-			<th scope="col">Name</th>
-			<th scope="col">Default Description</th>
-		</tr>
-	</thead>
-	<tbody>
-{% for k, v in badge_types.items() %}
-<tr>
-	<td><input type="radio" id="badge-{{k}}" name="badge_id" value="{{k}}"></td>
-	<td>
-		<label for="badge-{{k}}">
-			<img loading="lazy" src="/assets/CHRISTMAS/images/badges/{{v['name']}}.webp?a=1" class="object-contain w-16 h-16 p-2" alt="{{v['name']}} badge"/>
-		</label>
-	</td>
-	<td>{{v['name']}}</td>
-	<td>{{v['description']}}</td>
-</tr>
-{% endfor %}
-</table>
+		<label for="input-username" class="label">Username</label>
+		<input autocomplete="off" id="input-username" class="form-input mb-2" type="text" name="username" required placeholder="Enter a username">
 
-<label for="input-url" class="label">URL</label>
-<input id="input-url" class="form-input mb-2" type="text" name="url" placeholder="Optional">
+		<label for="input-url" class="label">URL</label>
+		<input id="input-url" class="form-input mb-2" type="text" name="url" placeholder="Optional">
 
-<label for="input-description" class="label">Custom description</label>
-<input id="input-description" class="form-input" type="text" name="description" placeholder="Leave blank for badge default">
+		<label for="input-description" class="label">Custom description</label>
+		<textarea id="input-description" class="form-input" name="description" placeholder="Leave blank for badge's default desription."></textarea>
 
-<input class="btn btn-green mt-2" type="submit">
+		<table class="w-full table table-striped mt-6">
+			<thead class="bg-primary text-white">
+				<tr>
+					<th scope="col" class="p-2.5">Select</th>
+					<th scope="col" class="p-2.5">Image</th>
+					<th scope="col" class="p-2.5">Name</th>
+					<th scope="col" class="p-2.5">Default Description</th>
+				</tr>
+			</thead>
+			<tbody>
+				{% for k, v in badge_types.items() %}
+				<tr class="odd:bg-gray-300 dark:odd:bg-white/[.05] hover:bg-gray-400 dark:hover:bg-white/10 hover:cursor-pointer" onclick="selectCheckbox('badge-{{k}}')">
+					<td class="px-2.5" tabindex="1">
+						<input type="radio" id="badge-{{k}}" name="badge_id" value="{{k}}" class="pointer-events-none">
+					</td>
+					<td class="px-2.5">
+						<img loading="lazy" src="/assets/CHRISTMAS/images/badges/{{v['name']}}.webp?a=1" class="object-contain w-16 h-16 p-2" alt="{{v['name']}} badge"/>
+					</td>
+					<td class="px-2.5 font-bold">{{v['name']}}</td>
+					<td class="px-2.5 text-gray-700 dark:text-gray-500">{{v['description']}}</td>
+				</tr>
+				{% endfor %}
+			</tbody>
+		</table>
 
-</form>
+	</form>
 
 </div>
 
@@ -89,3 +114,12 @@
 </style>
 
 {% endblock %}
+
+{% block scripts %}
+<script>
+	function selectCheckbox(id) {
+		const el = document.getElementById(id);
+		el.checked = !el.checked;
+	}
+</script>
+{% endblock %}
diff --git a/files/templates/CHRISTMAS/admin/banned_domains.html b/files/templates/CHRISTMAS/admin/banned_domains.html
index f31b4ea0b..178e2b74f 100644
--- a/files/templates/CHRISTMAS/admin/banned_domains.html
+++ b/files/templates/CHRISTMAS/admin/banned_domains.html
@@ -1,34 +1,78 @@
 {% extends "CHRISTMAS/default.html" %}
 
 {% block title %}
-	<title>Banned Domains</title>
+<title>Banned Domains</title>
+{% endblock %}
+
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Banned Domains
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Banned Domains</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
 {% endblock %}
 
 {% block content %}
-<div class="col-span-full my-2 px-2.5 md:px-0">
-<table class="w-full table table-striped mb-5">
-	<thead class="bg-primary text-white">
-		<tr>
-			<th style="font-weight:bold;">Domain</th>
-			<th style="font-weight:bold;">Ban reason</th>
-		</tr>
-	</thead>
+<div class="col-span-full my-4 px-2.5 md:px-0">
 
-	{% for domain in banned_domains %}
-		<tr>
-			<td style="font-weight:bold;">{{domain.domain}}</td>
-			<td>{{domain.reason}}</td>
-		</tr>
-	{% endfor %}
-</table>
+	<form action="/admin/banned_domains" method="post" class="p-5 flex flex-col rounded-md bg-gray-300 dark:bg-gray-700 shadow-inset-t-white-10 border border-gray-400 dark:border-gray-900">
+		<label class="label">
+			Manage a domain
+		</label>
+		<input type="hidden" name="formkey" value="{{v.formkey}}">
+		<div class="w-full flex space-x-2 items-center">
+			<input name="domain" placeholder="Enter domain here.." class="form-input" required>
+			<input name="reason" placeholder="Enter ban reason here..." oninput="document.getElementById('ban-submit').disabled=false" class="form-input" required>
+			<input id="ban-submit" type="submit" class="btn btn-red" value="Toggle ban" disabled>
+		</div>
+	</form>
 
-
-<form action="/admin/banned_domains" method="post">
-	<input type="hidden" name="formkey" value="{{v.formkey}}">
-	<input name="domain" placeholder="Enter domain here.." class="form-control" required>
-	<input name="reason" placeholder="Enter ban reason here.." onchange="document.getElementById('ban-submit').disabled=false" class="form-control">
-	<input id="ban-submit" type="submit" class="btn btn-primary" value="Toggle ban" disabled>
-</form>
+	{% if banned_domains %}
+	<table class="w-full table mt-6">
+		<thead class="bg-primary text-white">
+			<tr>
+				<th scope="col" class="p-2.5">Domain</th>
+				<th scope="col" class="p-2.5">Ban reason</th>
+			</tr>
+		</thead>
+		<tbody>
+			{% for domain in banned_domains %}
+			<tr class="h-16 odd:bg-gray-300 dark:odd:bg-white/[.05] hover:bg-gray-400 dark:hover:bg-white/10">
+				<td class="px-2.5 font-bold">
+					{{domain.domain}}
+				</td>
+				<td class="px-2.5">{{domain.reason}}</td>
+			</tr>
+			{% endfor %}
+		</tbody>
+	</table>
+	{% else %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No banned domains</h2>
+		<p class="text-gray-500 text-sm">
+			When a domain is banned, it will show up here.
+		</p>
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
+	</div>
+	{% endif %}
 </div>
-
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/admin/content_stats.html b/files/templates/CHRISTMAS/admin/content_stats.html
index 9e7de0208..122c5dfb5 100644
--- a/files/templates/CHRISTMAS/admin/content_stats.html
+++ b/files/templates/CHRISTMAS/admin/content_stats.html
@@ -5,21 +5,49 @@
 <meta name="description" content="{{'SITE_NAME' | app_config}} Help">
 {% endblock %}
 
-{% block content %}
-<pre></pre>
-<table class="table table-striped mb-5">
-<thead class="bg-primary text-white">
-	<tr>
-		<th>Statistic</th>
-		<th>Value</th>
-	</tr>
-</thead>
-{% for entry in data %}
-	<tr>
-		<td>{{entry}}</td>
-		<td>{{data[entry]}}</td>
-	</tr>
-{% endfor %}
-</table>
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Content Stats
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Content Stants</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+{% endblock %}
 
+{% block content %}
+<div class="col-span-full my-4 px-2.5 md:px-0">
+	<div class="overflow-x-auto">
+		<table class="w-full table mb-5">
+			<thead class="bg-primary text-white shadow-inset-t-white-10">
+				<tr>
+					<th scope="col" class="p-2.5">Statistic</th>
+					<th scope="col" class="p-2.5">Value</th>
+				</tr>
+			</thead>
+			<tbody>
+				{% for entry in data %}
+				<tr class="h-16 odd:bg-gray-300 dark:odd:bg-white/[.05] hover:bg-gray-400 dark:hover:bg-white/10">
+					<td class="px-2.5">{{entry}}</td>
+					<td class="px-2.5 font-bold">{{data[entry]}}</td>
+				</tr>
+				{% endfor %}
+			</tbody>
+		</table>
+	</div>
+</div>
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/admin/image_posts.html b/files/templates/CHRISTMAS/admin/image_posts.html
index a26e5feb9..bf71a6770 100644
--- a/files/templates/CHRISTMAS/admin/image_posts.html
+++ b/files/templates/CHRISTMAS/admin/image_posts.html
@@ -1,36 +1,41 @@
-{% extends "CHRISTMAS/userpage.html" %}
-
-{% block adminpanel %}{% endblock %}
-{% block pagetype %}userpage{% endblock %}
-{% block banner %}{% endblock %}
-{% block mobileBanner %}{% endblock %}
-{% block desktopBanner %}{% endblock %}
-{% block desktopUserBanner %}{% endblock %}
-{% block mobileUserBanner %}{% endblock %}
-
-{% block postNav %}{% endblock %}
-
-{% block fixedMobileBarJS %}
-{% endblock %}
+{% extends "CHRISTMAS/default.html" %}
 
 {% block title %}
 <title>Image feed</title>
 <meta name="description" content="on {{'SITE_NAME' | app_config}}">
 {% endblock %}
 
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Image Posts
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Image Posts</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+{% endblock %}
 
 {% block content %}
-
-<div class="row no-gutters">
-
-	<div class="col">
-
+<div class="col-span-full xl:col-span-9 dark:bg-gray-700 md:dark:bg-gray-800">
 	{% block listing %}
-		<div class="posts">
+		<ul class="flex flex-col sm:py-4 my-2.5 sm:my-0" id="posts">
 			{% include "CHRISTMAS/submission_listing.html" %}
-		</div>
+		</ul>
 	{% endblock %}
-	</div>
 </div>
 {% endblock %}
 
diff --git a/files/templates/CHRISTMAS/admin/removed_comments.html b/files/templates/CHRISTMAS/admin/removed_comments.html
index 4989b2329..9bf21ee58 100644
--- a/files/templates/CHRISTMAS/admin/removed_comments.html
+++ b/files/templates/CHRISTMAS/admin/removed_comments.html
@@ -1,73 +1,21 @@
-{% extends "CHRISTMAS/admin/image_posts.html" %}
-
-
-{% block title %}
-<title>Removed Content</title>
-<meta name="description" content="on {{'SITE_NAME' | app_config}}">
-{% endblock %}
-
-{% block content %}
-
-<div class="row justify-content-around mx-lg-5 d-lg-none no-gutters">
-	<div class="col bg-light border-bottom rounded-md p-3">
-		<div class="profile-details">
-			<div class="media">
-			<div class="media-body">
-				<pre></pre>
-				<h5 class="h6 d-inline-block">Removed Posts</h5>
-
-			</div>
-
-		</div>
+{% extends "CHRISTMAS/admin/removed_posts.html" %}
 
+{% block listing %}
+<div class="col-span-full px-2.5 md:px-0">
+	{% with comments=listing %}
+	{% include "CHRISTMAS/comments.html" %}
+	{% endwith %}
+	{% if not listing %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No removed comments</h2>
+		<p class="text-gray-500 text-sm">
+			When mods remove a comment, it will show up here.
+		</p>
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
 	</div>
-</div>
-</div>
-
-<div class="row no-gutters">
-
-	<div class="col">
-
-		{% block listing %}
-
-
-		<div class="posts">
-			{% with comments=listing %}
-				{% include "CHRISTMAS/comments.html" %}
-			{% endwith %}
-			{% if not listing %}
-			<div class="row no-gutters">	
-				<div class="col">			
-					<div class="text-center py-7">
-						<div class="h4 p-2">There are no comments here (yet).</div>
-					</div>			
-				</div>	
-			</div>
-				{% endif %}
-		</div>
-
-{% endblock %}
-	</div>
+	{% endif %}
 </div>
 {% endblock %}
-
-{% block pagenav %}
-<nav aria-label="Page navigation">
-	<ul class="pagination pagination-sm py-3 pl-3 mb-0">
-		{% if page>1 %}
-		<li class="page-item">
-			<small><a class="page-link" href="?page={{page-1}}" tabindex="-1">Prev</a></small>
-		</li>
-		{% else %}
-		<li class="page-item disabled"><span class="page-link">Prev</span></li>
-		{% endif %}
-		{% if next_exists %}
-		<li class="page-item">
-			<small><a class="page-link" href="?page={{page+1}}">Next</a></small>
-		</li>
-		{% else %}
-		<li class="page-item disabled"><span class="page-link">Next</span></li>
-		{% endif %}
-	</ul>
-</nav>
-{% endblock %}
diff --git a/files/templates/CHRISTMAS/admin/removed_posts.html b/files/templates/CHRISTMAS/admin/removed_posts.html
index 2a798edd5..a999c23e7 100644
--- a/files/templates/CHRISTMAS/admin/removed_posts.html
+++ b/files/templates/CHRISTMAS/admin/removed_posts.html
@@ -1,39 +1,67 @@
-{% extends "CHRISTMAS/admin/image_posts.html" %}
+{% extends "CHRISTMAS/default.html" %}
 
+{% block pagetype %}userpage{% endblock %}
 
 {% block title %}
-<title>Removed Content</title>
+<title>Reported Posts</title>
 <meta name="description" content="on {{'SITE_NAME' | app_config}}">
 {% endblock %}
 
-{% block content %}
-
-<div class="row justify-content-around mx-lg-5 d-lg-none no-gutters">
-	<div class="col bg-light border-bottom rounded-md p-3">
-		<div class="profile-details">
-			<div class="media">
-			<div class="media-body">
-				<pre></pre>
-				<h5 class="h6 d-inline-block">Removed Posts</h5>
-
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Removed Content
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Removed Content</a>
+				</li>
+			</ul>
+		</div>
+		<div class="ml-auto">
+			<div class="dropdown">
+				<button class="block px-4 py-2 bg-gradient-to-t from-gray-200 to-gray-100 focus:from-gray-100 focus:to-gray-200 border border-gray-300 rounded-md text-shadow shadow-inset-t-white-10 text-sm font-bold text-gray-700 focus:text-gray-900 focus:shadow-inner focus:outline-none dropdown-toggle" type="button" id="dropdownAdminReportSortsButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+					{% if request.path=="/admin/removed/posts" %}
+						<i class="fas fa-pencil text-gray-500 fa-sm fa-fw mr-1"></i>Posts
+					{% endif %}
+					{% if request.path=="/admin/removed/comments" %}
+						<i class="fas fa-comment-alt text-gray-500 fa-sm fa-fw mr-1"></i>Comments
+					{% endif %}
+				</button>
+				<ul class="dropdown-menu w-56 bg-gray-900 rounded-md shadow-lg" aria-labelledby="dropdownAdminReportSortsButton" x-placement="bottom-start">
+					<li class="{% if request.path=="/admin/removed/posts" %}hidden{% endif %}">
+						<a class="dropdown-item dropdown-item-primary" href="/admin/removed/posts">
+							<i class="fas fa-pencil fa-sm fa-fw mr-4"></i>Posts
+						</a>
+					</li>
+					<li class="{% if request.path=="/admin/removed/comments" %}hidden{% endif %}">
+						<a class="dropdown-item dropdown-item-primary" href="/admin/removed/comments">
+							<i class="fas fa-comment-alt fa-sm fa-fw mr-4"></i>Comments
+						</a>
+					</li>
+				</ul>
 			</div>
-
 		</div>
-
 	</div>
 </div>
-</div>
-
-<div class="row no-gutters">
-
-	<div class="col">
+{% endblock %}
 
+{% block content %}
+<div class="col-span-full xl:col-span-9 dark:bg-gray-700 md:dark:bg-gray-800">
 	{% block listing %}
-		<div class="posts">
-			{% include "CHRISTMAS/submission_listing.html" %}
-		</div>
+	<ul class="flex flex-col sm:py-4 my-2.5 sm:my-0" id="posts">
+		{% include "CHRISTMAS/submission_listing.html" %}
+	</ul>
 	{% endblock %}
-	</div>
 </div>
 {% endblock %}
 
diff --git a/files/templates/CHRISTMAS/admin/reported_comments.html b/files/templates/CHRISTMAS/admin/reported_comments.html
index a88b9333a..b19b267a4 100644
--- a/files/templates/CHRISTMAS/admin/reported_comments.html
+++ b/files/templates/CHRISTMAS/admin/reported_comments.html
@@ -1,24 +1,22 @@
 {% extends "CHRISTMAS/admin/reported_posts.html" %}
 
-
-
 {% block listing %}
-
-
-		<div class="posts">
-			{% with comments=listing %}
-				{% include "CHRISTMAS/comments.html" %}
-			{% endwith %}
-			{% if not listing %}
-			<div class="row no-gutters">	
-				<div class="col">			
-					<div class="text-center py-7">
-						<div class="h4 p-2">There are no comments here (yet).</div>
-					</div>			
-				</div>	
-			</div>
-				{% endif %}
-		</div>
-
+<div class="col-span-full px-2.5 md:px-0">
+	{% with comments=listing %}
+	{% include "CHRISTMAS/comments.html" %}
+	{% endwith %}
+	{% if not listing %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No reported comments</h2>
+		<p class="text-gray-500 text-sm">
+			When someone reports a comment, it will show up here.
+		</p>
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
+	</div>
+	{% endif %}
+</div>
 {% endblock %}
 
diff --git a/files/templates/CHRISTMAS/admin/reported_posts.html b/files/templates/CHRISTMAS/admin/reported_posts.html
index 7533f6b8f..5a8a6318f 100644
--- a/files/templates/CHRISTMAS/admin/reported_posts.html
+++ b/files/templates/CHRISTMAS/admin/reported_posts.html
@@ -1,66 +1,70 @@
-{% extends "CHRISTMAS/settings2.html" %}
+{% extends "CHRISTMAS/default.html" %}
 
-{% block adminpanel %}{% endblock %}
 {% block pagetype %}userpage{% endblock %}
-{% block banner %}{% endblock %}
-{% block mobileBanner %}{% endblock %}
-{% block desktopBanner %}{% endblock %}
-{% block desktopUserBanner %}{% endblock %}
-{% block mobileUserBanner %}{% endblock %}
-
-	{% block postNav %}
-	<div class="container-fluid bg-white sticky">
-		<div class="row border-bottom">
-			<div class="col">
-				<div class="container">
-					<div class="row bg-white">
-						<div class="col">
-							<div class="d-flex">
-								<ul class="nav post-nav mr-auto">
-									<li class="nav-item">
-										<a class="nav-link {% if request.path=="/admin/reported/posts" %} active{% endif %}" href="/admin/reported/posts">
-											<div>Posts</div>
-										</a>
-									</li>
-									<li class="nav-item">
-										<a class="nav-link {% if request.path=="/admin/reported/comments" %} active{% endif %}" href="/admin/reported/comments">
-											<div>Comments</div>
-										</a>
-									</li>
-								</ul>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-	</div>
-	{% endblock %}
-
-
-{% block fixedMobileBarJS %}
-{% endblock %}
 
 {% block title %}
 <title>Reported Posts</title>
 <meta name="description" content="on {{'SITE_NAME' | app_config}}">
 {% endblock %}
 
-{% block content %}
-
-<div class="row no-gutters">
-
-	<div class="col">
-
-	{% block listing %}
-		<div class="posts">
-			{% include "CHRISTMAS/submission_listing.html" %}
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Reports
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Reports</a>
+				</li>
+			</ul>
+		</div>
+		<div class="ml-auto">
+			<div class="dropdown">
+				<button class="block px-4 py-2 bg-gradient-to-t from-gray-200 to-gray-100 focus:from-gray-100 focus:to-gray-200 border border-gray-300 rounded-md text-shadow shadow-inset-t-white-10 text-sm font-bold text-gray-700 focus:text-gray-900 focus:shadow-inner focus:outline-none dropdown-toggle" type="button" id="dropdownAdminReportSortsButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+					{% if request.path=="/admin/reported/posts" %}
+						<i class="fas fa-pencil text-gray-500 fa-sm fa-fw mr-1"></i>Posts
+					{% endif %}
+					{% if request.path=="/admin/reported/comments" %}
+						<i class="fas fa-comment-alt text-gray-500 fa-sm fa-fw mr-1"></i>Comments
+					{% endif %}
+				</button>
+				<ul class="dropdown-menu w-56 bg-gray-900 rounded-md shadow-lg" aria-labelledby="dropdownAdminReportSortsButton" x-placement="bottom-start">
+					<li class="{% if request.path=="/admin/reported/posts" %}hidden{% endif %}">
+						<a class="dropdown-item dropdown-item-primary" href="/admin/reported/posts">
+							<i class="fas fa-pencil fa-sm fa-fw mr-4"></i>Posts
+						</a>
+					</li>
+					<li class="{% if request.path=="/admin/reported/comments" %}hidden{% endif %}">
+						<a class="dropdown-item dropdown-item-primary" href="/admin/reported/comments">
+							<i class="fas fa-comment-alt fa-sm fa-fw mr-4"></i>Comments
+						</a>
+					</li>
+				</ul>
+			</div>
 		</div>
-	{% endblock %}
 	</div>
 </div>
 {% endblock %}
 
+{% block content %}
+<div class="col-span-full xl:col-span-9 dark:bg-gray-700 md:dark:bg-gray-800">
+	{% block listing %}
+	<ul class="flex flex-col sm:py-4 my-2.5 sm:my-0" id="posts">
+		{% include "CHRISTMAS/submission_listing.html" %}
+	</ul>
+	{% endblock %}
+</div>
+{% endblock %}
+
 {% block pagenav %}
 <nav aria-label="Page navigation">
 	<ul class="pagination pagination-sm py-3 pl-3 mb-0">
diff --git a/files/templates/CHRISTMAS/admin/sidebar.html b/files/templates/CHRISTMAS/admin/sidebar.html
new file mode 100644
index 000000000..797b4b729
--- /dev/null
+++ b/files/templates/CHRISTMAS/admin/sidebar.html
@@ -0,0 +1,41 @@
+{% extends "CHRISTMAS/default.html" %}
+
+{% block pagetitle %}Edit {{'SITE_NAME' | app_config}} sidebar{% endblock %}
+
+{% block content %}
+{% if msg %}
+	<div class="alert alert-success alert-dismissible fade show my-3" role="alert">
+		<i class="fas fa-check-circle my-auto" aria-hidden="true"></i>
+		<span>
+			{{msg}}
+		</span>
+		<button role="button" class="close" data-bs-dismiss="alert" aria-label="Close">
+			<span aria-hidden="true"><i class="far fa-times"></i></span>
+		</button>
+	</div>
+{% endif %}
+
+<div class="row my-5">
+	<div class="col col-md-8">
+		<div class="settings">
+			<div id="description">
+				<h2>Edit sidebar</h2>
+				<br>
+			</div>
+			<div class="body d-lg-flex">
+				<div class="w-lg-100">
+					<form id="profile-settings" action="/admin/sidebar" method="post">
+						<input autocomplete="off" type="hidden" name="formkey" value="{{v.formkey}}">
+						<textarea autocomplete="off" maxlength="10000" class="form-control rounded" id="bio-text" aria-label="With textarea" placeholder="Site sidebar" rows="50" name="sidebar" form="profile-settings">{% if sidebar %}{{ sidebar }}{% endif %}</textarea>
+
+						<div class="d-flex mt-2">
+							<input autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="Save">
+						</div>
+					</form>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+
+{% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/agendaposters.html b/files/templates/CHRISTMAS/agendaposters.html
index ff3fec505..57906a4aa 100644
--- a/files/templates/CHRISTMAS/agendaposters.html
+++ b/files/templates/CHRISTMAS/agendaposters.html
@@ -1,19 +1,72 @@
-{% extends "CHRISTMAS/settings2.html" %}
+{% extends "CHRISTMAS/default.html" %}
+
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Agenda Posters
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				{% if v and v.admin_level > 2 %}
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				{% endif %}
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Agenda Posters</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+{% endblock %}
 
 {% block content %}
-<table class="table table-striped mb-5">
-<thead class="bg-primary text-white">
-	<tr>
-		<th style="font-weight:bold;">#</th>
-		<th style="font-weight:bold;">Name</th>
-	</tr>
-</thead>
-{% for user in users %}
-	<tr>
-		<td style="font-weight:bold;">{{loop.index}}</td>
-		<td><a style="color:#{{user.namecolor}}; font-weight:bold;" href="/@{{user.username}}"><img loading="lazy" src="/uid/{{user.id}}/pic" class="pp20"><span {% if user.patron %}class="patron" style="background-color:#{{user.namecolor}};"{% endif %}>{{user.username}}</span></a></td>
-	</tr>
-{% endfor %}
-</table>
-
+<div class="col-span-full my-4 px-2.5 md:px-0">
+	{% if users %}
+	<table class="w-full table">
+		<thead class="bg-primary text-white">
+			<tr>
+				<th scope="col" class="p-2.5">#</th>
+				<th scope="col" class="p-2.5">Name</th>
+			</tr>
+		</thead>
+		<tbody>
+			{% for user in users %}
+			<tr class="h-16 odd:bg-gray-300 dark:odd:bg-white/[.05] hover:bg-gray-400 dark:hover:bg-white/10">
+				<td class="px-2.5 font-bold">{{loop.index}}</td>
+				<td class="px-2.5">
+					<a style="color:#{{user.namecolor}}; font-weight:bold;" href="/@{{user.username}}">
+						<img loading="lazy" src="/uid/{{user.id}}/pic" class="pp20">
+						<span {% if user.patron %}class="patron" style="background-color:#{{user.namecolor}};"{% endif %}>{{user.username}}</span>
+					</a>
+				</td>
+			</tr>
+			{% endfor %}
+		</tbody>
+	</table>
+	{% else %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No agenda posters</h2>
+		<p class="text-gray-500 text-sm">
+			When users have active agenda poster theme, it will show up here.
+		</p>
+		{% if v and v.admin_level > 2 %}
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
+		{% else %}
+		<a href="/" class="mt-3 btn btn-gray">
+			Go to homepage
+		</a>
+		{% endif %}
+	</div>
+	{% endif %}
+</div>
 {% endblock %}
diff --git a/files/templates/CHRISTMAS/award_modal.html b/files/templates/CHRISTMAS/award_modal.html
index 2e291b545..4651dddd6 100644
--- a/files/templates/CHRISTMAS/award_modal.html
+++ b/files/templates/CHRISTMAS/award_modal.html
@@ -2,10 +2,10 @@
 
 <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">
-		<div class="modal-content bg-gray-100 rounded-md shadow-lg">
+		<div class="modal-content bg-gray-100 dark:bg-gray-700 rounded-md shadow-lg">
 			<div class="modal-header">
-				<h5 class="font-bold text-xl text-black font-heading leading-normal">Gift Award</h5>
-				<button type="button" class="close text-gray-700 hover:text-gray-900" data-bs-dismiss="modal" aria-label="Close">
+				<h5 class="font-bold text-xl font-heading leading-normal">Gift Award</h5>
+				<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
 					<span aria-hidden="true"><i class="far fa-times"></i></span>
 				</button>
 			</div>
@@ -23,8 +23,8 @@
 							<label for="{{award.kind}}-award" onclick="document.getElementById('giveaward').disabled=false" class="w-full h-full p-2 text-center hover:bg-gray-300 peer-checked:shadow-inner peer-checked:bg-gray-400 rounded cursor-not-allowed opacity-50">
 							{% endif %}
 								<i class="{{award.icon}} {{award.color}}"></i>
-								<div class="mt-2 font-bold text-base text-black">{{award.title}}</div>
-								<div class="text-sm text-gray-600">{{award.owned}} owned</div>
+								<div class="mt-2 font-bold text-base text-black dark:text-gray-200">{{award.title}}</div>
+								<div class="text-sm text-gray-500">{{award.owned}} owned</div>
 							</label>
 						</div>
 						{% endfor %}
@@ -34,8 +34,8 @@
 						<small id="notelabel-helper" class="font-normal text-gray-500">Optional</small>
 					</label>
 					<textarea id="note" maxlength="200" name="note" class="form-input" placeholder="Note to include in award notification..."></textarea>
-					<div class="flex justify-end space-x-2 border-t border-gray-300 p-4 -mx-4 mt-4">
-						<button type="button" class="px-4 py-2 text-sm font-bold text-gray-500 hover:text-gray-700" data-bs-dismiss="modal">
+					<div class="flex justify-end space-x-2 border-t border-gray-300 dark:border-gray-800 p-4 -mx-4 mt-4">
+						<button type="button" class="px-4 py-2 text-sm font-bold text-gray-500 hover:text-gray-700 dark:hover:text-gray-400" data-bs-dismiss="modal">
 							Cancel
 						</button>
 						<input id="giveaward" class="ml-auto btn btn-green" type="submit" value="Gift Award" disabled>
diff --git a/files/templates/CHRISTMAS/comments/CommentActions.html b/files/templates/CHRISTMAS/comments/CommentActions.html
index 4f4d5714d..f6de23d68 100644
--- a/files/templates/CHRISTMAS/comments/CommentActions.html
+++ b/files/templates/CHRISTMAS/comments/CommentActions.html
@@ -149,20 +149,33 @@
 				</li>
 				{% endif %}
 
-				{% if v and c.post and (v.admin_level > 1 or v.id == c.post.author_id) %}
+				{% if v and c.post %}
 				<li>
 					<hr class="mt-2 mb-1.5 border-t border-black h-1 shadow-inset-t-white-05"/>
 				</li>
-				<li id="unpin-{{c.id}}" class="hidden {% if c.is_pinned %}md:block{% endif %}">
-					<button class="dropdown-item dropdown-item-primary" data-bs-dismiss="modal" data-bs-target="#actionsModal-{{c.id}}" onclick="post_toast3('/pin_comment/{{c.id}}','pin-{{c.id}}','unpin-{{c.id}}')">
-						<i class="fas fa-thumbtack fa-rotate--45 fa-sm fa-fw mr-4"></i>Unpin
-					</button>
-				</li>
-				<li id="pin-{{c.id}}" class="hidden {% if not c.is_pinned %}md:block{% endif %}">
-					<button class="dropdown-item dropdown-item-primary" data-bs-dismiss="modal" data-bs-target="#actionsModal-{{c.id}}" onclick="post_toast3('/pin_comment/{{c.id}}','pin-{{c.id}}','unpin-{{c.id}}')">
-						<i class="fas fa-thumbtack fa-rotate--45 fa-sm fa-fw mr-4"></i>Pin
-					</button>
-				</li>
+					{% if v.admin_level > 1 %}
+					<li id="unpin-{{c.id}}" class="hidden {% if c.is_pinned %}md:block{% endif %}">
+						<button class="dropdown-item dropdown-item-primary" onclick="post_toast3('/unsticky_comment/{{c.id}}','pin-{{c.id}}','unpin-{{c.id}}')">
+							<i class="fas fa-thumbtack fa-rotate--45 fa-sm fa-fw mr-4"></i>Unpin
+						</button>
+					</li>
+					<li id="pin-{{c.id}}" class="hidden {% if not c.is_pinned %}md:block{% endif %}">
+						<button class="dropdown-item dropdown-item-primary" onclick="post_toast3('/sticky_comment/{{c.id}}','pin-{{c.id}}','unpin-{{c.id}}')">
+							<i class="fas fa-thumbtack fa-rotate--45 fa-sm fa-fw mr-4"></i>Pin
+						</button>
+					</li>
+					{% elif v.id == c.post.author_id %}
+					<li id="unpin-{{c.id}}" class="hidden {% if c.is_pinned %}md:block{% endif %}">
+						<button class="dropdown-item dropdown-item-primary" onclick="post_toast3('/unpin_comment/{{c.id}}','pin-{{c.id}}','unpin-{{c.id}}')">
+							<i class="fas fa-thumbtack fa-rotate--45 fa-sm fa-fw mr-4"></i>Unpin
+						</button>
+					</li>
+					<li id="pin-{{c.id}}" class="hidden {% if not c.is_pinned %}md:block{% endif %}">
+						<button class="dropdown-item dropdown-item-primary" onclick="post_toast3('/pin_comment/{{c.id}}','pin-{{c.id}}','unpin-{{c.id}}')">
+							<i class="fas fa-thumbtack fa-rotate--45 fa-sm fa-fw mr-4"></i>Pin
+						</button>
+					</li>
+					{% endif %}
 				{% endif %}
 
 				{% if v and v.admin_level > 1 %}
diff --git a/files/templates/CHRISTMAS/default.html b/files/templates/CHRISTMAS/default.html
index 5fdf30c3e..de30fbb04 100644
--- a/files/templates/CHRISTMAS/default.html
+++ b/files/templates/CHRISTMAS/default.html
@@ -192,9 +192,9 @@
 
 		{% block stylesheets %}
 
-		<link rel="stylesheet" href="/assets/CHRISTMAS/css/main.css?a=2">
+		<link rel="stylesheet" href="/assets/CHRISTMAS/css/main.css?a=4">
 
-      	<link rel="stylesheet" href="/static/dist/main.css?a=3">
+      	<link rel="stylesheet" href="/static/dist/main.css?a=4">
 
 		{% if v %}
 			<style>:root{--primary:#dc2626}</style>
diff --git a/files/templates/CHRISTMAS/dropdowns/SearchSorts.html b/files/templates/CHRISTMAS/dropdowns/SearchSorts.html
index 72ded9bfc..629313cac 100644
--- a/files/templates/CHRISTMAS/dropdowns/SearchSorts.html
+++ b/files/templates/CHRISTMAS/dropdowns/SearchSorts.html
@@ -1,6 +1,6 @@
 <div class="flex items-center space-x-2">
 	<div class="dropdown">
-		<button class="block px-4 py-2 bg-gradient-to-t from-gray-200 to-gray-100 focus:from-gray-100 focus:to-gray-200 border border-gray-300 rounded-md text-shadow shadow-inset-t-white-10 text-sm font-bold text-gray-700 focus:text-gray-900 focus:shadow-inner focus:outline-none dropdown-toggle" type="button" id="dropdownSearchSortsutton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+		<button class="block px-4 py-2 bg-gradient-to-t from-gray-200 to-gray-100 focus:from-gray-100 focus:to-gray-200 border border-gray-300 rounded-md text-shadow shadow-inset-t-white-10 text-sm font-bold text-gray-700 focus:text-gray-900 focus:shadow-inner focus:outline-none dropdown-toggle" type="button" id="dropdownSearchSortsButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 			{% if t=="hour" %}<i class="fas fa-clock text-gray-500 fa-sm fa-fw mr-1"></i>{% endif %}
 			{% if t=="day" %}<i class="fas fa-calendar-day text-gray-500 fa-sm fa-fw mr-1"></i>{% endif %}
 			{% if t=="week" %}<i class="fas fa-calendar-week text-gray-500 fa-sm fa-fw mr-1"></i>{% endif %}
diff --git a/files/templates/CHRISTMAS/grassed.html b/files/templates/CHRISTMAS/grassed.html
index 0c7ce6142..ea2984599 100644
--- a/files/templates/CHRISTMAS/grassed.html
+++ b/files/templates/CHRISTMAS/grassed.html
@@ -1,21 +1,74 @@
-{% extends "CHRISTMAS/settings2.html" %}
+{% extends "CHRISTMAS/default.html" %}
+
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Grassed Users
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				{% if v and v.admin_level > 2 %}
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				{% endif %}
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Grassed Users</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+{% endblock %}
 
 {% block content %}
-<table class="table table-striped mb-5">
-<thead class="bg-primary text-white">
-	<tr>
-		<th style="font-weight:bold;">#</th>
-		<th style="font-weight:bold;">Name</th>
-		<th style="font-weight:bold;">Grasser</th>
-	</tr>
-</thead>
-{% for user in users %}
-	<tr>
-		<td style="font-weight:bold;">{{loop.index}}</td>
-		<td><a style="color:#{{user.namecolor}}; font-weight:bold;" href="/@{{user.username}}"><img loading="lazy" src="/uid/{{user.id}}/pic" class="pp20"><span {% if user.patron %}class="patron" style="background-color:#{{user.namecolor}};"{% endif %}>{{user.username}}</span></a></td>
-		<td style="font-weight:bold;">{{user.ban_reason.split('by ')[1]}}</td>
-	</tr>
-{% endfor %}
-</table>
-
+<div class="col-span-full my-4 px-2.5 md:px-0">
+	{% if users %}
+	<table class="w-full table">
+	<thead class="bg-primary text-white">
+		<tr>
+			<th scope="col" class="p-2.5">#</th>
+			<th scope="col" class="p-2.5">Username</th>
+			<th scope="col" class="p-2.5">Grasser</th>
+		</tr>
+	</thead>
+	<tbody>
+		{% for user in users %}
+			<tr class="h-16 odd:bg-gray-300 dark:odd:bg-white/[.05] hover:bg-gray-400 dark:hover:bg-white/10">
+				<td class="px-2.5 font-bold">{{loop.index}}</td>
+				<td class="px-2.5">
+					<a style="color:#{{user.namecolor}}; font-weight:bold;" href="/@{{user.username}}">
+						<img loading="lazy" src="/uid/{{user.id}}/pic" class="pp20">
+						<span {% if user.patron %}class="patron" style="background-color:#{{user.namecolor}};"{% endif %}>{{user.username}}</span>
+					</a>
+				</td>
+				<td class="px-2.5 font-bold">{{user.ban_reason.split('by ')[1]}}</td>
+			</tr>
+		{% endfor %}
+	</tbody>
+	</table>
+	{% else %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No grassed users</h2>
+		<p class="text-gray-500 text-sm">
+			When users have an active grass award, it will show up here.
+		</p>
+		{% if v and v.admin_level > 2 %}
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
+		{% else %}
+		<a href="/" class="mt-3 btn btn-gray">
+			Go to homepage
+		</a>
+		{% endif %}
+	</div>
+	{% endif %}
+</div>
 {% endblock %}
diff --git a/files/templates/CHRISTMAS/header-tw.html b/files/templates/CHRISTMAS/header-tw.html
index b97d4c9e1..391e2de51 100644
--- a/files/templates/CHRISTMAS/header-tw.html
+++ b/files/templates/CHRISTMAS/header-tw.html
@@ -1,69 +1,5 @@
 {% set random = range(1, 13)|random() %}
 
-{% set randomBanner = range(0,11)|random() %}
-
-{%
-  set banner = [
-    {
-      'username': 'Bartholomew_1',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-1.jpg?a=1'
-    },
-    {
-      'username': 'Yui',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-2.jpg?a=1'
-    },
-    {
-      'username': 'Bartholomew_1',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-3.jpg?a=1'
-    },
-    {
-      'username': 'chiobu',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-4.jpg?a=1'
-    },
-    {
-      'username': 'chiobu',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-5.webp?a=1'
-    },
-    {
-      'username': 'geese_suck',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-6.jpg?a=1'
-    },
-    {
-      'username': 'Bartholomew_1',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-7.jpg?a=1'
-    },
-    {
-      'username': 'drama_enthusiast',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-8.webp?a=1'
-    },
-    {
-      'username': 'dramarama',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-9.jpg?a=1'
-    },
-    {
-      'username': 'geese_suck',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-10.jpg?a=1'
-    },
-    {
-      'username': 'ThreeLetterAgent',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-11.jpg?a=1'
-    },
-    {
-      'username': 'geese_suck',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-12.jpg?a=1'
-    },
-    {
-      'username': 'geese_suck',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-13.jpg?a=1'
-    },
-    {
-      'username': 'geese_suck',
-      'image': '/static/assets/CHRISTMAS/banners/sidebar-banner-14.jpg?a=1'
-    }
-  ]
-%}
-
-
 <!-- This example requires Tailwind CSS v2.0+ -->
 <nav class="fixed top-0 w-full bg-gray-700" style="z-index: 1030;">
   <div class="w-full max-w-screen-2xl mx-auto grid grid-cols-12 px-4">
@@ -145,7 +81,7 @@
         </div>
         {% if v.admin_level > 1 %}
         <!-- Admin link -->
-        <a href="{{ '/admin' if v else '/signup?redirect={{request.path | urlencode}}' }}" class="bg-transparent p-1 rounded-full text-gray-400 hover:text-gray-300 dark:text-gray-500 dark:hover:text-gray-400 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
+        <a href="{{ '/admin' if v else '/signup?redirect={{request.path | urlencode}}' }}" class="bg-transparent p-1 rounded-full text-yellow-500 hover:text-yellow-400 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
           <span class="sr-only">Admin tools</span>
           <i class="fas fa-crown fa-fw"></i>
         </a>
@@ -288,11 +224,11 @@
         </li>
       </ul>
       {% endif %}
-      <a href="/post/32341/" class="block w-full h-56 shadow-sm p-[3px] bg-white dark:bg-gray-900 overflow-hidden">
-        <img loading="lazy" class="w-full h-full flex-shrink-0 object-contain cursor-pointer" src="{{ banner[randomBanner].image }}" alt="artwork featuring an orange and white cat"/>
+      <a href="/static/assets/images/{{'SITE_NAME' | app_config}}/banners/{{range(1,95)|random()}}.webp?a=3" class="block w-full h-56 shadow-sm p-[3px] bg-white dark:bg-gray-900 overflow-hidden">
+        <img loading="lazy" class="w-full h-full flex-shrink-0 object-contain cursor-pointer" src="/static/assets/images/{{'SITE_NAME' | app_config}}/banners/{{range(1,95)|random()}}.webp?a=3" alt="artwork featuring an orange and white cat"/>
       </a>
-      <small class="mt-1 block text-gray-500">
-        Artwork by <a href="/@{{ banner[randomBanner].username }}" class="font-bold">@{{ banner[randomBanner].username }}</a>
+      <small class="hidden mt-1 text-gray-500">
+        Artwork by <a href="/me" class="font-bold">@username</a>
       </small>
     </div>
   </div>
diff --git a/files/templates/CHRISTMAS/home.html b/files/templates/CHRISTMAS/home.html
index 04d3e40e1..c5948cd58 100644
--- a/files/templates/CHRISTMAS/home.html
+++ b/files/templates/CHRISTMAS/home.html
@@ -2,7 +2,7 @@
 
 {% block subHeader %}
 	<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
-		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700"></div>
+		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
 		<div class="relative col-span-full flex items-center">
 			<div>
 				<h1 class="font-bold text-xl font-heading leading-normal mb-0">
diff --git a/files/templates/CHRISTMAS/log.html b/files/templates/CHRISTMAS/log.html
index e22bbe512..cfe69f16d 100644
--- a/files/templates/CHRISTMAS/log.html
+++ b/files/templates/CHRISTMAS/log.html
@@ -1,127 +1,154 @@
-{% extends "CHRISTMAS/settings2.html" %}
+{%
+	set colors = {
+	'fa-user-slash': 'text-red-600',
+	'fa-feather-alt': 'text-gray-500',
+	'fa-eye-evil': 'text-red-600'
+}
+%}
+
+{% extends "CHRISTMAS/default.html" %}
 
 {% block pagetitle %}Moderation Log{% endblock %}
 
-
-{% block content %}
-{% if v %}
-	<style>:root{--primary:#{{v.themecolor}}}</style>
-	<link rel="stylesheet" href="/assets/CHRISTMAS/css/main-deprecated.css?a=1"><link rel="stylesheet" href="/assets/CHRISTMAS/css/{{v.theme}}.css?a=1">
-	{% if v.agendaposter %}<link rel="stylesheet" href="/assets/CHRISTMAS/css/agendaposter.css?a=1">{% elif v.css %}<link rel="stylesheet" href="/@{{v.username}}/css">{% endif %}
-{% else %}
-	<style>:root{--primary:#{{'DEFAULT_COLOR' | app_config}}</style>
-	<link rel="stylesheet" href="/assets/CHRISTMAS/css/main-deprecated.css?a=1"><link rel="stylesheet" href="/assets/CHRISTMAS/css/{{'DEFAULT_THEME' | app_config}}.css?a=1">
-{% endif %}
-
-<div class="row justify-content-around">
-
-	<div class="col h-100">
-
-		<div class="d-md-flex justify-content-between mt-4">
-			<div>
-				<h5>Moderation Log</h5>
-			</div>
-
-		</div>
-
-		<div class="row" style="overflow: visible;padding-top:5px;">
-			<div class="col">
-				<div class="d-flex justify-content-between align-items-center mr-2">
-		
-					{% block navbar %}
-					<div class="font-weight-bold py-3">‎</div>
-		
-					<div class="d-flex align-items-center sortingbarmargin">
-						<div class="text-small font-weight-bold mr-2">‎</div>
-						<div class="dropdown dropdown-actions">
-
-							<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-								{% if admin %}<img src="/@{{admin}}/pic" alt="avatar" width=20 height=20 class="rounded-circle mr-2">{{admin}}{% else %}<img src="/assets/images/emojis/marseyjanny.webp" alt="avatar" width=20 height=20 class="rounded-circle mr-2">All{% endif %}
-							</button>
-							<div class="dropdown-menu" aria-labelledby="dropdownMenuButton" x-placement="bottom-start" style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(0px, 31px, 0px);">
-								<a class="dropdown-item" href="/log{% if type %}?kind={{type}}{% endif %}"><img src="/assets/images/emojis/marseyjanny.webp" alt="avatar" width=20 height=20 class="rounded-circle mr-2">All</a>
-								{% for a in admins %}
-									<a class="dropdown-item" href="?admin={{a}}{% if type %}&kind={{type}}{% endif %}"><img src="/@{{a}}/pic" alt="avatar" width=20 height=20 class="rounded-circle mr-2">{{a}}</a>
-								{% endfor %}
-							</div>
-						</div>
-		
-						<div class="text-small font-weight-bold mr-2">‎</div>
-						<div class="dropdown dropdown-actions">
-
-							<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton2" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-								{% if type %}<i class="fas {{types[type]['icon']}} mr-2"></i>{{type}}{% else %}<i class="fas fa-broom mr-2"></i>All{% endif %}
-							</button>
-							<div class="dropdown-menu" aria-labelledby="dropdownMenuButton2s" x-placement="bottom-start" style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(0px, 31px, 0px);">
-								<a class="dropdown-item" href="/log{% if admin %}?admin={{admin}}{% endif %}"><i class="fas fa-broom mr-2"></i>All</a>
-								{% for t, v in types.items() %}
-									<a class="dropdown-item" href="?{% if admin %}admin={{admin}}&{% endif %}kind={{t}}"><i class="fas {{v['icon']}} mr-2"></i>{{t}}</a>
-								{% endfor %}
-							</div>
-						</div>
-					</div>
-					{% endblock %}
-				</div>
-			</div>
-		</div>
-
-
-		<div class="rounded border bg-white mx-auto">
-			{% for ma in actions %}
-
-				<div id="action-{{ma.id}}" class="position-relative d-flex justify-content-between flex-wrap align-items-center h-min-16 px-3 py-3 mb-3 mb-md-2 bg-white{% if loop.index > 1 %} border-top{% endif %}">
-
-				<div class="d-flex flex-grow-1 align-items-center">
-					<div class="d-flex align-items-center justify-content-center {{ma.color}} mr-3 rounded-lg flex-shrink-0" style="width: 32px;height: 32px;"><i class="far text-center {{ma.icon}} text-lg text-white fa-fw"></i></div>
-					<div class="d-flex align-items-center">
-						<span class="rounded">
-						<img src="{{ma.user.profile_url}}" alt="avatar" width=42 height=42 class="rounded-circle">
-					</span>
-						<div class="text-muted pl-3">
-							<div>
-								<a href="{{ma.user.url}}" class="font-weight-bold text-black" target="_self">@{{ma.user.username}}</a>
-
-							<span>{{ma.string | safe}}</span>
-						</div>
-
-						<div class="text-gray-500">{{ma.age_string}} <a href="{{ma.permalink}}"><i class="far fa-link ml-1 text-muted"></i></a>
-							<a href="javascript:void(0)" class="copy-link" role="button"data-clipboard-text="{{ma.permalink | full_link}}"><i class="far fa-copy ml-1 text-muted"></i></a>
-						</div>
-
-					</div>
-				</div>
-			</div>
-			</div>
-
-
-			{% else %}
-				<div>There's nothing here right now.</div>
-			{% endfor %}
-		</div>
-
-
-		<nav aria-label="Page navigation" class="mb-5">
-			<ul class="pagination pagination-sm mb-0">
-				{% if page>1 %}
-					<li class="page-item">
-						<small><a class="page-link" href="/log?page={{page+1}}{% if admin %}&admin={{admin}}{% endif %}{% if type %}&kind={{type}}{% endif %}" tabindex="-1">Prev</a></small>
-					</li>
-				{% else %}
-					<li class="page-item disabled"><span class="page-link">Prev</span></li>
-				{% endif %}
-				{% if next_exists %}
-				<li class="page-item">
-					<small><a class="page-link" href="/log?page={{page+1}}{% if admin %}&admin={{admin}}{% endif %}{% if type %}&kind={{type}}{% endif %}">Next</a></small>
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Moderation Log
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				{% if v and v.admin_level > 2 %}
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
 				</li>
-				{% else %}
-					<li class="page-item disabled"><span class="page-link">Next</span></li>
 				{% endif %}
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Moderation Log</a>
+				</li>
 			</ul>
-		</nav>
-
+		</div>
+		<div class="ml-auto flex space-x-2">
+			<!-- Filter by mod -->
+			<div class="dropdown">
+				<button class="inline-flex items-center px-4 py-2 bg-gradient-to-t from-gray-200 to-gray-100 focus:from-gray-100 focus:to-gray-200 border border-gray-300 rounded-md text-shadow shadow-inset-t-white-10 text-sm font-bold text-gray-700 focus:text-gray-900 focus:shadow-inner focus:outline-none dropdown-toggle" type="button" id="dropdownLogSortsButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+					{% if admin %}
+					<img src="/@{{admin}}/pic" alt="{{ admin }}avatar" class="flex-shrink-0 w-4 h-4 object-cover mr-2">{{ admin }}
+					{% else %}
+					<img src="/assets/images/emojis/marseyjanny.webp" alt="default mod avatar" class="flex-shrink-0 w-4 h-4 object-cover mr-4">All
+					{% endif %}
+				</button>
+				<ul class="dropdown-menu w-56 bg-gray-900 rounded-md shadow-lg" aria-labelledby="dropdownLogSortsButton" x-placement="bottom-start">
+					<li>
+						<a class="dropdown-item dropdown-item-primary" href="/log{% if type %}?kind={{type}}{% endif %}">
+							<img src="/assets/images/emojis/marseyjanny.webp" alt="default mod avatar" class="flex-shrink-0 w-4 h-4 object-cover mr-4">All
+						</a>
+					</li>
+					{% for a in admins %}
+					<li>
+						<a class="dropdown-item dropdown-item-primary" href="?admin={{a}}{% if type %}&kind={{type}}{% endif %}">
+							<img src="/@{{a}}/pic" alt="{{ a }} avatar" class="flex-shrink-0 w-4 h-4 object-cover mr-4">{{ a }}
+						</a>
+					</li>
+					{% endfor %}
+				</ul>
+			</div>
+			<!-- Filter by action -->
+			<div class="dropdown">
+				<button class="inline-flex items-center px-4 py-2 bg-gradient-to-t from-gray-200 to-gray-100 focus:from-gray-100 focus:to-gray-200 border border-gray-300 rounded-md text-shadow shadow-inset-t-white-10 text-sm font-bold text-gray-700 focus:text-gray-900 focus:shadow-inner focus:outline-none dropdown-toggle" type="button" id="dropdownLogActionSortsButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+					{% if type %}
+					<i class="fas {{types[type]['icon']}} fa-fw mr-2"></i>{{type}}
+					{% else %}
+					<i class="fas fa-broom fa-fw mr-2"></i>All
+					{% endif %}
+				</button>
+				<ul class="dropdown-menu w-56 bg-gray-900 rounded-md shadow-lg" aria-labelledby="dropdownLogActionSortsButton" x-placement="bottom-start">
+					<li>
+						<a class="dropdown-item dropdown-item-primary" href="/log{% if admin %}?admin={{admin}}{% endif %}">
+							<i class="fas fa-broom fa-fw mr-2"></i>All
+						</a>
+					</li>
+					{% for t, v in types.items() %}
+					<li>
+						<a class="dropdown-item dropdown-item-primary" href="?{% if admin %}admin={{admin}}&{% endif %}kind={{t}}">
+							<i class="fas {{v['icon']}} fa-fw mr-2"></i>{{t}}
+						</a>
+					</li>
+					{% endfor %}
+				</ul>
+			</div>
+		</div>
 	</div>
 </div>
+{% endblock %}
 
-<script src="/assets/CHRISTMAS/js/clipboard.js?a=1"></script>
+
+{% block content %}
+
+<div class="col-span-full my-4">
+
+	{% if actions %}
+	<ul class="flex flex-col divide-y divide-gray-300 dark:divide-gray-700 space-y-2.5 mb-0 list-none">
+		{% for ma in actions %}
+		<li id="action-{{ma.id}}" class="relative flex pt-2.5 first:pt-0">
+			<div class="w-6 h-6 flex justify-center items-center flex-shrink-0">
+				<i class="far {{ ma.icon }} {{ colors[ma.icon] }} fa-fw"></i>
+			</div>
+			<div class="pl-2 text-gray-500 dark:text-gray-400 text-sm">
+				<div>
+					<a href="{{ma.user.url}}" class="font-font text-black dark:text-gray-200 hover:text-primary dark:hover:text-primary" target="_self">@{{ma.user.username}}
+					</a>
+					<span>{{ma.string | safe}}</span>
+				</div>
+				<div class="text-gray-400 dark:text-gray-500 text-xs">
+					<span>{{ma.age_string}}</span>
+				</div>
+			</div>
+		</li>
+		{% endfor %}
+	</ul>
+	{% else %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No logs</h2>
+		<p class="text-gray-500 text-sm">
+			When mods perform actions, it will show up here.
+		</p>
+		{% if v and v.admin_level > 2 %}
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
+		{% else %}
+		<a href="/" class="mt-3 btn btn-gray">
+			Go to homepage
+		</a>
+		{% endif %}
+	</div>
+	{% endif %}
+
+	<nav aria-label="Page navigation" class="mb-5">
+		<ul class="pagination pagination-sm mb-0">
+			{% if page>1 %}
+			<li class="page-item">
+				<small><a class="page-link" href="/log?page={{page+1}}{% if admin %}&admin={{admin}}{% endif %}{% if type %}&kind={{type}}{% endif %}" tabindex="-1">Prev</a></small>
+			</li>
+			{% else %}
+			<li class="page-item disabled"><span class="page-link">Prev</span></li>
+			{% endif %}
+			{% if next_exists %}
+			<li class="page-item">
+				<small><a class="page-link" href="/log?page={{page+1}}{% if admin %}&admin={{admin}}{% endif %}{% if type %}&kind={{type}}{% endif %}">Next</a></small>
+			</li>
+			{% else %}
+			<li class="page-item disabled"><span class="page-link">Next</span></li>
+			{% endif %}
+		</ul>
+	</nav>
+
+</div>
 
 {% endblock %}
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/modals/ModalCommentActions.html b/files/templates/CHRISTMAS/modals/ModalCommentActions.html
index c1a0c17ec..54a2422fc 100644
--- a/files/templates/CHRISTMAS/modals/ModalCommentActions.html
+++ b/files/templates/CHRISTMAS/modals/ModalCommentActions.html
@@ -68,17 +68,30 @@
 					</li>
 					{% endif %}
 					{% endif %}
-					{% if v and c.post and (v.admin_level > 1 or v.id == c.post.author_id) %}
-					<li id="pin2-{{c.id}}" class="{% if c.is_pinned %}hidden{% endif %}">
-						<button class="btn btn-gray w-full text-left" onclick="post_toast2('/pin_comment/{{c.id}}','pin2-{{c.id}}','unpin2-{{c.id}}')">
-							<i class="fas fa-thumbtack fa-rotate--45 fa-fw mr-4"></i>Pin
-						</button>
-					</li>
-					<li id="unpin2-{{c.id}}" class="{% if not c.is_pinned %}hidden{% endif %}">
-						<button class="btn btn-gray w-full text-left" onclick="post_toast2('/pin_comment/{{c.id}}','pin2-{{c.id}}','unpin2-{{c.id}}')">
-							<i class="fas fa-thumbtack fa-rotate--45 fa-fw mr-4"></i>Unpin
-						</button>
-					</li>
+					{% if v and c.post %}
+						{% if v.admin_level > 1 %}
+						<li id="pin2-{{c.id}}" class="{% if c.is_pinned %}hidden{% endif %}">
+							<button class="btn btn-gray w-full text-left" onclick="post_toast2('/sticky_comment/{{c.id}}','pin2-{{c.id}}','unpin2-{{c.id}}')">
+								<i class="fas fa-thumbtack fa-rotate--45 fa-fw mr-4"></i>Pin
+							</button>
+						</li>
+						<li id="unpin2-{{c.id}}" class="{% if not c.is_pinned %}hidden{% endif %}">
+							<button class="btn btn-gray w-full text-left" onclick="post_toast2('/unsticky_comment/{{c.id}}','pin2-{{c.id}}','unpin2-{{c.id}}')">
+								<i class="fas fa-thumbtack fa-rotate--45 fa-fw mr-4"></i>Unpin
+							</button>
+						</li>
+						{% elif v.id == c.post.author_id %}
+						<li id="pin2-{{c.id}}" class="{% if c.is_pinned %}hidden{% endif %}">
+							<button class="btn btn-gray w-full text-left" onclick="post_toast2('/pin_comment/{{c.id}}','pin2-{{c.id}}','unpin2-{{c.id}}')">
+								<i class="fas fa-thumbtack fa-rotate--45 fa-fw mr-4"></i>Pin
+							</button>
+						</li>
+						<li id="unpin2-{{c.id}}" class="{% if not c.is_pinned %}hidden{% endif %}">
+							<button class="btn btn-gray w-full text-left" onclick="post_toast2('/unpin_comment/{{c.id}}','pin2-{{c.id}}','unpin2-{{c.id}}')">
+								<i class="fas fa-thumbtack fa-rotate--45 fa-fw mr-4"></i>Unpin
+							</button>
+						</li>
+						{% endif %}
 					{% endif %}
 					{% if v %}
 						{% if v.admin_level > 0 and v.id==c.author_id %}
diff --git a/files/templates/CHRISTMAS/modals/ModalThemePicker.html b/files/templates/CHRISTMAS/modals/ModalThemePicker.html
index 464024ae3..7c0af5c6e 100644
--- a/files/templates/CHRISTMAS/modals/ModalThemePicker.html
+++ b/files/templates/CHRISTMAS/modals/ModalThemePicker.html
@@ -1,3 +1,9 @@
+ {% if v and v.theme2 %}
+ 	{% set theme = v.theme2 %}
+ {% else %}
+ 	{% set theme = 'theme-iron dark' %}
+ {% endif %}
+
 <div class="modal fade" id="themePickerModal" tabindex="-1" role="dialog" aria-labelledby="themePickerModalTitle" aria-hidden="true">
 	<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered" role="document">
 		<div class="modal-content bg-gray-100 dark:bg-gray-700 dark:text-gray-200 rounded-md shadow-lg">
@@ -12,7 +18,7 @@
 				<div class="flex flex-wrap -mx-2 overflow-hidden">
 					<!-- Evergreen -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-evergreen" type="radio" id="evergreen-theme" class="peer" onchange="changeTheme(['theme-evergreen']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-evergreen'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-evergreen" type="radio" id="evergreen-theme" class="peer" onchange="changeTheme(['theme-evergreen']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-evergreen'%}checked{% endif %}>
 						<label for="evergreen-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#37523e]">
 								<div class="h-3 w-full bg-[#37523e]"></div>
@@ -42,7 +48,7 @@
 					</div>
 					<!-- Iron -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-iron dark" type="radio" id="iron-theme-dark" class="peer" onchange="changeTheme(['theme-iron','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-iron dark'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-iron dark" type="radio" id="iron-theme-dark" class="peer" onchange="changeTheme(['theme-iron','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-iron dark'%}checked{% endif %}>
 						<label for="iron-theme-dark" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#3f3f46]">
 								<div class="h-3 w-full bg-[#3f3f46]"></div>
@@ -72,7 +78,7 @@
 					</div>
 					<!-- Savile Row -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-savile-row" type="radio" id="savile-row-theme" class="peer" onchange="changeTheme(['theme-savile-row']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-savile-row' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-savile-row" type="radio" id="savile-row-theme" class="peer" onchange="changeTheme(['theme-savile-row']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-savile-row' %}checked{% endif %}>
 						<label for="savile-row-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#524737]">
 								<div class="h-3 w-full bg-[#524737]"></div>
@@ -102,7 +108,7 @@
 					</div>
 					<!-- Osmium -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-dramblr" type="radio" id="dramblr-theme" class="peer" onchange="changeTheme(['theme-dramblr']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-dramblr'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-dramblr" type="radio" id="dramblr-theme" class="peer" onchange="changeTheme(['theme-dramblr']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-dramblr'%}checked{% endif %}>
 						<label for="dramblr-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#334155]">
 								<div class="h-3 w-full bg-[#334155]"></div>
@@ -132,7 +138,7 @@
 					</div>
 					<!-- Dramblr -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-dramblr dark" type="radio" id="dramblr-theme-dark" class="peer" onchange="changeTheme(['theme-dramblr','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-dramblr dark'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-dramblr dark" type="radio" id="dramblr-theme-dark" class="peer" onchange="changeTheme(['theme-dramblr','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-dramblr dark'%}checked{% endif %}>
 						<label for="dramblr-theme-dark" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#334155]">
 								<div class="h-3 w-full bg-[#334155]"></div>
@@ -162,7 +168,7 @@
 					</div>
 					<!-- Canary -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-canary" type="radio" id="canary-theme" class="peer" onchange="changeTheme(['theme-canary']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-canary'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-canary" type="radio" id="canary-theme" class="peer" onchange="changeTheme(['theme-canary']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-canary'%}checked{% endif %}>
 						<label for="canary-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#a16207]">
 								<div class="h-3 w-full bg-[#a16207]"></div>
@@ -192,7 +198,7 @@
 					</div>
 					<!-- Confection -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-bubblegum" type="radio" id="bubblegum-theme" class="peer" onchange="changeTheme(['theme-bubblegum']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-bubblegum'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-bubblegum" type="radio" id="bubblegum-theme" class="peer" onchange="changeTheme(['theme-bubblegum']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-bubblegum'%}checked{% endif %}>
 						<label for="bubblegum-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#be185d]">
 								<div class="h-3 w-full bg-[#be185d]"></div>
@@ -222,7 +228,7 @@
 					</div>
 					<!-- Mocha -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-mocha" type="radio" id="mocha-theme" class="peer" onchange="changeTheme(['theme-mocha']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-mocha'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-mocha" type="radio" id="mocha-theme" class="peer" onchange="changeTheme(['theme-mocha']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-mocha'%}checked{% endif %}>
 						<label for="mocha-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#524c37]">
 								<div class="h-3 w-full bg-[#524c37]"></div>
@@ -252,7 +258,7 @@
 					</div>
 					<!-- Blood Orange -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-blood-orange" type="radio" id="blood-orange-theme" class="peer" onchange="changeTheme(['theme-blood-orange']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-blood-orange'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-blood-orange" type="radio" id="blood-orange-theme" class="peer" onchange="changeTheme(['theme-blood-orange']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-blood-orange'%}checked{% endif %}>
 						<label for="blood-orange-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#4338ca]">
 								<div class="h-3 w-full bg-[#4338ca]"></div>
@@ -282,7 +288,7 @@
 					</div>
 					<!-- Choco Mint -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-choco-mint dark" type="radio" id="choco-mint-theme" class="peer" onchange="changeTheme(['theme-choco-mint','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-choco-mint dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-choco-mint dark" type="radio" id="choco-mint-theme" class="peer" onchange="changeTheme(['theme-choco-mint','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-choco-mint dark' %}checked{% endif %}>
 						<label for="choco-mint-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#524c37]">
 								<div class="h-3 w-full bg-[#524c37]"></div>
@@ -312,7 +318,7 @@
 					</div>
 					<!-- Limon -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-limon" type="radio" id="limon-theme" class="peer" onchange="changeTheme(['theme-limon']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-limon'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-limon" type="radio" id="limon-theme" class="peer" onchange="changeTheme(['theme-limon']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-limon'%}checked{% endif %}>
 						<label for="limon-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#4d7c0f]">
 								<div class="h-3 w-full bg-[#4d7c0f]"></div>
@@ -342,7 +348,7 @@
 					</div>
 					<!-- Lake Tahoe -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-lake-tahoe dark" type="radio" id="lake-tahoe-theme" class="peer" onchange="changeTheme(['theme-lake-tahoe','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-lake-tahoe dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-lake-tahoe dark" type="radio" id="lake-tahoe-theme" class="peer" onchange="changeTheme(['theme-lake-tahoe','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-lake-tahoe dark' %}checked{% endif %}>
 						<label for="lake-tahoe-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#0e7490]">
 								<div class="h-3 w-full bg-[#0e7490]"></div>
@@ -372,7 +378,7 @@
 					</div>
 					<!-- Abyss -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-abyss dark" type="radio" id="abyss-theme" class="peer" onchange="changeTheme(['theme-abyss','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-abyss dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-abyss dark" type="radio" id="abyss-theme" class="peer" onchange="changeTheme(['theme-abyss','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-abyss dark' %}checked{% endif %}>
 						<label for="abyss-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-black">
 								<div class="h-3 w-full bg-black"></div>
@@ -402,7 +408,7 @@
 					</div>
 					<!-- Dusk -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-midnight dark" type="radio" id="midnight-theme" class="peer" onchange="changeTheme(['theme-midnight','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-midnight dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-midnight dark" type="radio" id="midnight-theme" class="peer" onchange="changeTheme(['theme-midnight','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-midnight dark' %}checked{% endif %}>
 						<label for="midnight-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#374151]">
 								<div class="h-3 w-full bg-[#374151]"></div>
@@ -432,7 +438,7 @@
 					</div>
 					<!-- cambridge -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-cambridge" type="radio" id="cambridge-theme" class="peer" onchange="changeTheme(['theme-cambridge']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-cambridge' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-cambridge" type="radio" id="cambridge-theme" class="peer" onchange="changeTheme(['theme-cambridge']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-cambridge' %}checked{% endif %}>
 						<label for="cambridge-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#44403c]">
 								<div class="h-3 w-full bg-[#44403c]"></div>
@@ -462,7 +468,7 @@
 					</div>
 					<!-- Yale -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-yale dark" type="radio" id="yale-theme" class="peer" onchange="changeTheme(['theme-yale','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-yale dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-yale dark" type="radio" id="yale-theme" class="peer" onchange="changeTheme(['theme-yale','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-yale dark' %}checked{% endif %}>
 						<label for="yale-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#d73987]">
 								<div class="h-3 w-full bg-[#d73987]"></div>
@@ -492,7 +498,7 @@
 					</div>
 					<!-- Haskell -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-haskell dark" type="radio" id="haskell-theme" class="peer" onchange="changeTheme(['theme-haskell','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-haskell dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-haskell dark" type="radio" id="haskell-theme" class="peer" onchange="changeTheme(['theme-haskell','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-haskell dark' %}checked{% endif %}>
 						<label for="haskell-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#00001f]">
 								<div class="h-3 w-full bg-[#00001f]"></div>
@@ -522,7 +528,7 @@
 					</div>
 					<!-- Alpine -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-alpine" type="radio" id="alpine-theme" class="peer" onchange="changeTheme(['theme-alpine']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-alpine' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-alpine" type="radio" id="alpine-theme" class="peer" onchange="changeTheme(['theme-alpine']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-alpine' %}checked{% endif %}>
 						<label for="alpine-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#44423b]">
 								<div class="h-3 w-full bg-[#44423b]"></div>
@@ -552,7 +558,7 @@
 					</div>
 					<!-- War Games -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-war-games dark" type="radio" id="war-games-theme" class="peer" onchange="changeTheme(['theme-war-games','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-war-games dark' %}checked{% endif %}>
+						<input hidden name="theme" value="theme-war-games dark" type="radio" id="war-games-theme" class="peer" onchange="changeTheme(['theme-war-games','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-war-games dark' %}checked{% endif %}>
 						<label for="war-games-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#001f1b]">
 								<div class="h-3 w-full bg-[#001f1b]"></div>
@@ -582,7 +588,7 @@
 					</div>
 					<!-- Slate -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-iron" type="radio" id="iron-theme" class="peer" onchange="changeTheme(['theme-iron']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-iron'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-iron" type="radio" id="iron-theme" class="peer" onchange="changeTheme(['theme-iron']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-iron'%}checked{% endif %}>
 						<label for="iron-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#3f3f46]">
 								<div class="h-3 w-full bg-[#3f3f46]"></div>
@@ -612,7 +618,7 @@
 					</div>
 					<!-- Mountain Bluebird -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-mountain-bluebird" type="radio" id="mountain-bluebird-theme" class="peer" onchange="changeTheme(['theme-mountain-bluebird']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-mountain-bluebird'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-mountain-bluebird" type="radio" id="mountain-bluebird-theme" class="peer" onchange="changeTheme(['theme-mountain-bluebird']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-mountain-bluebird'%}checked{% endif %}>
 						<label for="mountain-bluebird-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#252525]">
 								<div class="h-3 w-full bg-[#252525]"></div>
@@ -642,7 +648,7 @@
 					</div>
 					<!-- Redwood -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-redwood dark" type="radio" id="redwood-theme" class="peer" onchange="changeTheme(['theme-redwood','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-redwood dark'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-redwood dark" type="radio" id="redwood-theme" class="peer" onchange="changeTheme(['theme-redwood','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-redwood dark'%}checked{% endif %}>
 						<label for="redwood-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#462f2f]">
 								<div class="h-3 w-full bg-[#462f2f]"></div>
@@ -672,7 +678,7 @@
 					</div>
 					<!-- Conifer -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-evergreen dark" type="radio" id="evergreen-theme-dark" class="peer" onchange="changeTheme(['theme-evergreen','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-evergreen dark'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-evergreen dark" type="radio" id="evergreen-theme-dark" class="peer" onchange="changeTheme(['theme-evergreen','dark']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-evergreen dark'%}checked{% endif %}>
 						<label for="evergreen-theme-dark" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#37523e]">
 								<div class="h-3 w-full bg-[#37523e]"></div>
@@ -702,7 +708,7 @@
 					</div>
 					<!-- Sequoia -->
 					<div class="my-2 px-2 w-1/2 lg:w-1/4 flex items-center justify-center">
-						<input hidden name="theme" value="theme-sequoia" type="radio" id="sequoia-theme" class="peer" onchange="changeTheme(['theme-sequoia']); post_toast2('/settings/profile?theme2='+value, '1')" {% if v.theme2 == 'theme-sequoia'%}checked{% endif %}>
+						<input hidden name="theme" value="theme-sequoia" type="radio" id="sequoia-theme" class="peer" onchange="changeTheme(['theme-sequoia']); post_toast2('/settings/profile?theme2='+value, '1')" {% if theme == 'theme-sequoia'%}checked{% endif %}>
 						<label for="sequoia-theme" class="flex flex-col items-center justify-center w-full h-full text-center border border-gray-300 hover:border-gray-400 shadow-sm dark:border-gray-600 hover:bg-gray-100 dark:hover:bg-gray-600 peer-checked:border-blue-500 peer-checked:bg-blue-600/10 rounded-lg overflow-hidden">
 							<div class="flex flex-col w-full h-full bg-[#462f2f]">
 								<div class="h-3 w-full bg-[#462f2f]"></div>
diff --git a/files/templates/CHRISTMAS/notifications.html b/files/templates/CHRISTMAS/notifications.html
index 0c9720bbd..bb4aff476 100644
--- a/files/templates/CHRISTMAS/notifications.html
+++ b/files/templates/CHRISTMAS/notifications.html
@@ -6,7 +6,7 @@
 
 {% block subHeader %}
 	<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
-		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700"></div>
+		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
 		<div class="relative col-span-full flex items-center">
 			<div>
 				<h1 class="font-bold text-xl font-heading leading-normal mb-0">
diff --git a/files/templates/CHRISTMAS/settings.html b/files/templates/CHRISTMAS/settings.html
index 02171d3be..3da0c0e3d 100644
--- a/files/templates/CHRISTMAS/settings.html
+++ b/files/templates/CHRISTMAS/settings.html
@@ -34,16 +34,16 @@
 
 	{% block stylesheets %}
 
-	<link rel="stylesheet" href="/assets/CHRISTMAS/css/main.css?a=2">
+	<link rel="stylesheet" href="/assets/CHRISTMAS/css/main.css?a=4">
 
-  	<link rel="stylesheet" href="/static/dist/main.css?a=3">
+  	<link rel="stylesheet" href="/static/dist/main.css?a=4">
 
 	{% if v %}
 		<style>:root{--primary:#{{v.themecolor}}}</style>
 		<!-- <link rel="stylesheet" href="/assets/CHRISTMAS/css/{{v.theme}}.css?a=1"> -->
 		{% if v.agendaposter %}
 		<link rel="stylesheet" href="/assets/CHRISTMAS/css/agendaposter.css?a=1">
-		{% elif v.css %}
+		{% elif v.css and not request.path.startswith('/settings/css') %}
 		<link rel="stylesheet" href="/@{{v.username}}/css">
 		{% endif %}
 	{% else %}
diff --git a/files/templates/CHRISTMAS/settings_css.html b/files/templates/CHRISTMAS/settings_css.html
index d5b6f7b68..00327344b 100644
--- a/files/templates/CHRISTMAS/settings_css.html
+++ b/files/templates/CHRISTMAS/settings_css.html
@@ -7,13 +7,13 @@
 <div class="flex flex-col space-y-4 sm:py-4 my-2.5 sm:my-0">
 
 	<!-- Custom website CSS -->
-	<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+	<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 		<div class="px-4 py-4">
 			<h2 class="label text-black">Custom site CSS</h2>
 			<form id="profile-settings" action="/settings/css" method="post">
 				<input type="hidden" name="formkey" value="{{v.formkey}}">
-				<div class="rounded border border-gray-300 border-dashed bg-white w-full">
-					<textarea class="p-2 shadow-inner w-full" placeholder="i.e. .custom-class {...}" rows="24" name="css" form="profile-settings" maxlength="4000">{% if v.css %}{{v.csslazy}}{% endif %}</textarea>
+				<div class="rounded border border-gray-300 dark:border-gray-900 bg-gray-100 dark:bg-white/[.05] shadow-inner w-full">
+					<textarea class="bg-transparent focus:bg-white dark:focus:bg-transparent p-2 shadow-inner w-full" placeholder="i.e. .custom-class {...}" rows="24" name="css" form="profile-settings" maxlength="4000">{% if v.css %}{{v.csslazy}}{% endif %}</textarea>
 				</div>
 				<small class="block mt-2 text-gray-400">Limit of 4000 characters</small>
 				<div class="mt-4">
@@ -24,13 +24,13 @@
 	</div>
 
 	<!-- Custom profile CSS -->
-	<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+	<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 		<div class="px-4 py-4">
 			<h2 class="label text-black">Custom profile CSS</h2>
 			<form id="profile-settings" action="/settings/profilecss" method="post">
 				<input type="hidden" name="formkey" value="{{v.formkey}}">
-				<div class="rounded border border-gray-300 border-dashed bg-white w-full">
-					<textarea class="p-2 shadow-inner w-full" id="bio-text" aria-label="With textarea" placeholder="i.e. .custom-avatar {...}" rows="24" name="profilecss" form="profile-settings" maxlength="4000">{% if v.profilecss %}{{v.profilecss}}{% endif %}</textarea>
+				<div class="rounded border border-gray-300 dark:border-gray-900 bg-gray-100 dark:bg-white/[.05] shadow-inner w-full">
+					<textarea class="bg-transparent focus:bg-white dark:focus:bg-transparent p-2 shadow-inner w-full" id="bio-text" aria-label="With textarea" placeholder="i.e. .custom-avatar {...}" rows="24" name="profilecss" form="profile-settings" maxlength="4000">{% if v.profilecss %}{{v.profilecss}}{% endif %}</textarea>
 				</div>
 				<small class="block mt-2 text-gray-400">Limit of 4000 characters</small>
 				<div class="mt-4">
diff --git a/files/templates/CHRISTMAS/settings_filters.html b/files/templates/CHRISTMAS/settings_filters.html
index 49df35a28..fa0c9967f 100644
--- a/files/templates/CHRISTMAS/settings_filters.html
+++ b/files/templates/CHRISTMAS/settings_filters.html
@@ -47,7 +47,7 @@
 				<label class="inline-block pl-2 text-gray-400" for="cardview">View posts in a larger, card format.</label>
 			</div>
 
-			<h2 class="h5 text-black">Frontpage Size</h2>
+			<h2 class="h5">Frontpage Size</h2>
 
 			<div class="settings-section rounded">
 				<div class="d-lg-flex border-bottom">
@@ -115,7 +115,7 @@
 
 					<div class="d-lg-flex border-bottom">
 						<div class="title w-lg-25">
-							<label for="defaulttime">Default Time Filter for Posts</label>
+							<label for="defaulttime" class="label">Default Time Filter for Posts</label>
 						</div>
 
 						<div class="body w-lg-100">
@@ -134,7 +134,7 @@
 
 			</div>
 
-			<h2 class="h5 text-black">Tab Behaviour</h2>
+			<h2 class="h5">Tab Behaviour</h2>
 
 			<div class="settings-section rounded">
 
@@ -182,7 +182,7 @@
 			</div>
 
 
-			<h2 class="h5 text-black">Twitter Links</h2>
+			<h2 class="h5">Twitter Links</h2>
 
 			<div class="settings-section rounded">
 
@@ -208,7 +208,7 @@
 			</div>
 
 
-			<h2 class="h5 text-black">Reddit Links</h2>
+			<h2 class="h5">Reddit Links</h2>
 
 			<div class="settings-section rounded">
 
@@ -270,7 +270,7 @@
 				</div>
 			</div>
 
-			<h2 class="h5 text-black">Content Filters</h2>
+			<h2 class="h5">Content Filters</h2>
 
 				<div class="settings-section rounded">
 
diff --git a/files/templates/CHRISTMAS/settings_profile.html b/files/templates/CHRISTMAS/settings_profile.html
index e00bcfe07..d3b024348 100644
--- a/files/templates/CHRISTMAS/settings_profile.html
+++ b/files/templates/CHRISTMAS/settings_profile.html
@@ -6,7 +6,7 @@
 		<div class="flex flex-col space-y-4 sm:py-4 my-2.5 sm:my-0">
 
 			<!-- Avatar section -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 
 					<h2 class="label text-black">Use Old Site</h2>
@@ -129,7 +129,7 @@
 
 			</div> -->
 
-			<div class="rounded-lg bg-gray-100 border border-gray-300 shadow-inset-t-white-10 p-4">
+			<div class="rounded-lg bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10 p-4">
 				<h2 class="label text-black">Linked accounts</h2>
 				<div class="flex flex-col space-y-2 divide-y divide-y-800">
 					<div>
@@ -157,7 +157,7 @@
 			</div>
 
 			<!-- Referral & RSS -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Referral code</h2>
 					<input type="text" onclick="this.select()" value="{{request.host_url}}signup?ref={{v.username}}" class="m-0.5 p-0.5 bg-white border border-gray-300 text-xs text-black w-80">
@@ -176,7 +176,7 @@
 			</div>
 
 			<!-- Profile Username -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Username</h2>
 					<form action="/settings/name_change" method="post">
@@ -196,7 +196,7 @@
 			</div>
 
 			<!-- Profile Anthem -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Profile Anthem</h2>
 					<form action="/settings/song_change" method="post">
@@ -213,7 +213,7 @@
 			</div>
 
 			<!-- Username Color -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Username Color</h2>
 					<form action="/settings/namecolor" id="color-code-form" method="post">
@@ -230,7 +230,7 @@
 
 			{% if not v.flairchanged %}
 			<!-- Flair -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Flair</h2>
 					<form id="profile-settings" action="/settings/title_change" method="post">
@@ -251,7 +251,7 @@
 			{% endif %}
 
 			<!-- Title Color -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Flair Color</h2>
 					<form action="/settings/titlecolor" id="color-code-form" method="post">
@@ -268,7 +268,7 @@
 
 			{% if v.verified %}
 			<!-- Bluecheck Color -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Bluecheck Color</h2>
 					<form action="/settings/titlecolor" id="color-code-form" method="post">
@@ -284,7 +284,7 @@
 			</div>
 			{% endif %}
 
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Bio</h2>
 					<form id="profile-bio" action="/settings/profile" method="post" enctype="multipart/form-data">
@@ -328,7 +328,7 @@
 			</div>
 
 			<!-- Privacy -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Privacy</h2>
 					<div class="mb-4">
@@ -343,7 +343,7 @@
 			</div>
 
 			<!-- Avatar section -->
-			<div class="rounded-lg divide-y divide-gray-300 bg-gray-100 border border-gray-300 shadow-inset-t-white-10">
+			<div class="rounded-lg divide-y divide-gray-300 dark:divide-gray-700 bg-gray-100 dark:bg-white/10 border border-gray-300 dark:border-gray-900 shadow-inset-t-white-10">
 				<div class="px-4 py-4">
 					<h2 class="label text-black">Friends</h2>
 					<form id="profile-friends" action="/settings/profile" method="post" enctype="multipart/form-data">
diff --git a/files/templates/CHRISTMAS/shadowbanned.html b/files/templates/CHRISTMAS/shadowbanned.html
index 59b98b69a..063938aba 100644
--- a/files/templates/CHRISTMAS/shadowbanned.html
+++ b/files/templates/CHRISTMAS/shadowbanned.html
@@ -1,21 +1,68 @@
-{% extends "CHRISTMAS/settings2.html" %}
+{% extends "CHRISTMAS/default.html" %}
+
+{% block subHeader %}
+<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
+	<div class="relative col-span-full flex items-center">
+		<div>
+			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
+				Shadow Banned Users
+			</h1>
+			<ul class="flex space-x-2 text-xs text-gray-500 dark:text-gray-400 leading-normal mb-0">
+				<li>
+					<a href="/admin" class="text-gray-500 hover:underline">Admin Dashboard</a>
+				</li>
+				<li>
+					<i class="fas fa-arrow-alt-right text-shadow fa-fw fa-sm"></i>
+				</li>
+				<li>
+					<a href="#" class="text-gray-700 dark:text-gray-500 hover:underline">Shadow Banned Users</a>
+				</li>
+			</ul>
+		</div>
+	</div>
+</div>
+{% endblock %}
 
 {% block content %}
-<table class="table table-striped mb-5">
-<thead class="bg-primary text-white">
-	<tr>
-		<th style="font-weight:bold;">#</th>
-		<th style="font-weight:bold;">Name</th>
-		<th style="font-weight:bold;">Shadowbanned by</th>
-	</tr>
-</thead>
-{% for user in users %}
-	<tr>
-		<td style="font-weight:bold;">{{loop.index}}</td>
-		<td><a style="color:#{{user.namecolor}}; font-weight:bold;" href="/@{{user.username}}"><img loading="lazy" src="/uid/{{user.id}}/pic" class="pp20"><span {% if user.patron %}class="patron" style="background-color:#{{user.namecolor}};"{% endif %}>{{user.username}}</span></a></td>
-		<td style="font-weight:bold;">{{user.shadowbanned}}</td>
-	</tr>
-{% endfor %}
-</table>
-
+<div class="col-span-full my-2 px-2.5 md:px-0">
+	{% if users %}
+	<table class="w-full table table-striped mt-6">
+		<thead class="bg-primary text-white">
+			<tr>
+				<th scope="col" class="p-2.5">#</th>
+				<th scope="col" class="p-2.5">Name</th>
+				<th scope="col" class="p-2.5">Shadowbanned by</th>
+			</tr>
+		</thead>
+		<tbody>
+			{% for user in users %}
+			<tr>
+				<td class="px-2.5 font-bold">{{loop.index}}</td>
+				<td class="px-2.5">
+					<a style="color:#{{user.namecolor}}; font-weight:bold;" href="/@{{user.username}}">
+						<img loading="lazy" src="/uid/{{user.id}}/pic" class="pp20">
+						<span {% if user.patron %}class="patron" style="background-color:#{{user.namecolor}};"{% endif %}>{{user.username}}</span>
+					</a>
+				</td>
+				<td class="px-2.5 font-bold">
+					{{ user.shadowbanned }}
+				</td>
+			</tr>
+			{% endfor %}
+		</tbody>
+	</table>
+	{% else %}
+	<div class="flex flex-col items-center justify-center py-24 md:py-48">
+		<img loading="lazy" src="https://c.tenor.com/NhDy-AkelhQAAAAM/marsey-drama.gif" class="w-20 h-20 mb-4 rounded-md object-cover">
+		<h2 class="text-xl font-bold leading-normal font-heading">No shadow banned users</h2>
+		<p class="text-gray-500 text-sm">
+			When a mod shadow bans someone, it will show up here.
+		</p>
+		<a href="/admin" class="mt-3 btn btn-gray">
+			Go to admin dashboard
+		</a>
+	</div>
+	{% endif %}
+</div>
 {% endblock %}
diff --git a/files/templates/CHRISTMAS/shop.html b/files/templates/CHRISTMAS/shop.html
index 40542ad82..1d3117bc8 100644
--- a/files/templates/CHRISTMAS/shop.html
+++ b/files/templates/CHRISTMAS/shop.html
@@ -6,7 +6,7 @@
 
 {% block subHeader %}
 <div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
-		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700"></div>
+		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
 		<div class="relative col-span-full flex items-center">
 		<div>
 			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
diff --git a/files/templates/CHRISTMAS/sidebars/AdminSidebar.html b/files/templates/CHRISTMAS/sidebars/AdminSidebar.html
new file mode 100644
index 000000000..8c9a894e9
--- /dev/null
+++ b/files/templates/CHRISTMAS/sidebars/AdminSidebar.html
@@ -0,0 +1,54 @@
+{%
+	set colors = {
+	'fa-user-slash': 'text-red-600',
+	'fa-feather-alt': 'text-gray-500',
+	'fa-eye-evil': 'text-red-600'
+	}
+%}
+
+<div class="sidebar hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 my-4 px-4 py-3 rounded-md bg-gray-300/40 dark:bg-gray-700/40 shadow-inner">
+	<h2 class="ml-2 font-bold text-lg font-heading leading-normal mb-2">Quick Actions</h2>
+	<div class="flex flex-col space-y-4 mb-3">
+		<div class="flex items-center">
+			<input type="checkbox" id="disablesignups" class="h-5 w-5" name="disablesignups" onchange="post_toast('/admin/disablesignups');" {% if x == "yes" %}checked{% endif %}>
+			<label class="label ml-2" for="disablesignups">Disable signups</label>
+		</div>
+	</div>
+	<hr class="mt-6 mb-5 h-0.5 border-b border-gray-300 dark:border-gray-900 shadow-inset-t-white-05"/>
+	<div class="flex items-center justify-between ml-2 mb-2">
+		<h2 class="font-bold text-lg font-heading leading-normal mb-0">
+			<a href="/log" class="group text-black dark:text-gray-200 hover:text-primary dark:hover:text-primary">
+			Recent
+			<span class="text-gray-500 group-hover:text-primary font-normal">
+				Activity
+				<i class="fas fa-arrow-alt-right fa-fw fa-sm"></i>
+			</a>
+		</h2>
+	</div>
+	{% if actions %}
+	<ul class="flex flex-col divide-y divide-gray-300 dark:divide-gray-700 space-y-2.5 mb-0 list-none">
+		{% for ma in actions %}
+		<li id="action-{{ma.id}}" class="relative flex pt-2.5 first:pt-0">
+			<div class="w-6 h-6 flex justify-center items-center flex-shrink-0">
+				<i class="far {{ ma.icon }} {{ colors[ma.icon] }} fa-fw"></i>
+			</div>
+			<div class="pl-2 text-gray-500 dark:text-gray-400 text-sm">
+				<div>
+					<a href="{{ma.user.url}}" class="font-font text-black dark:text-gray-200 hover:text-primary dark:hover:text-primary" target="_self">@{{ma.user.username}}
+					</a>
+					<span>{{ma.string | safe}}</span>
+				</div>
+				<div class="text-gray-400 dark:text-gray-500 text-xs">
+					<span>{{ma.age_string}}</span>
+				</div>
+			</div>
+		</li>
+		{% endfor %}
+	</ul>
+	{% else %}
+	<div class="py-4 text-center">
+		<i class="block fas fa-ghost text-lg text-gray-400 dark:text-gray-700"></i>
+		<p class="mt-1 text-sm text-gray-500">No recent mod activity...</p>
+	</div>
+	{% endif %}
+</div>
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/sidebars/HomeSidebar.html b/files/templates/CHRISTMAS/sidebars/HomeSidebar.html
index 75955a30c..ec3597ad9 100644
--- a/files/templates/CHRISTMAS/sidebars/HomeSidebar.html
+++ b/files/templates/CHRISTMAS/sidebars/HomeSidebar.html
@@ -61,7 +61,7 @@
 	]
 %}
 
-<div class="hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 py-4">
+<div class="sidebar hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 py-4">
 	<div>
 		<h2 class="ml-2 font-bold text-xl text-gray-900 dark:text-gray-300 font-heading leading-normal mb-2">
 			Stickies
@@ -118,11 +118,11 @@
 		</ul>
 	</div>
 	<hr class="mt-6 mb-5 h-0.5 border-b border-gray-300 dark:border-gray-900 shadow-inset-t-white-05"/>
-	<a href="/post/32341/" class="block w-full h-56 shadow-sm p-[3px] bg-white dark:bg-gray-900 overflow-hidden">
-		<img class="w-full h-full flex-shrink-0 object-contain cursor-pointer" src="/static/assets/images/{{'SITE_NAME' | app_config}}/banners/{{banner[random].image}}.webp?a=1" alt="artwork featuring an orange and white cat"/>
+	<a href="/static/assets/images/{{'SITE_NAME' | app_config}}/banners/{{range(1,95)|random()}}.webp?a=3" class="block w-full h-56 shadow-sm p-[3px] bg-white dark:bg-gray-900 overflow-hidden">
+		<img class="w-full h-full flex-shrink-0 object-contain cursor-pointer" src="/static/assets/images/{{'SITE_NAME' | app_config}}/banners/{{range(1,95)|random()}}.webp?a=3" alt="artwork featuring an orange and white cat"/>
 	</a>
-	<small class="mt-1 block text-gray-500">
-		Artwork by <a href="/@{{ banner[random].username }}" class="font-bold">@{{ banner[random].username }}</a>
+	<small class="mt-1 hidden text-gray-500">
+		Artwork by <a href="/me" class="font-bold">@username</a>
 	</small>
 	{% if v %}
 	<hr class="mt-6 mb-5 h-0.5 border-b border-gray-300 dark:border-gray-900 shadow-inset-t-white-05"/>
diff --git a/files/templates/CHRISTMAS/sidebars/ProfileSidebar.html b/files/templates/CHRISTMAS/sidebars/ProfileSidebar.html
index 4233409cb..1c73a9bbb 100644
--- a/files/templates/CHRISTMAS/sidebars/ProfileSidebar.html
+++ b/files/templates/CHRISTMAS/sidebars/ProfileSidebar.html
@@ -1,4 +1,4 @@
-<div class="hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0">
+<div class="sidebar hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0">
 	{% if v and v.admin_level > 1 and v.id != u.id %}
 	<div class="relative my-4 px-4 py-3 rounded-md border border-yellow-400 dark:border-gray-700 bg-yellow-100 dark:bg-gray-700/40">
 		<span class="absolute top-2 right-3 text-base">
@@ -221,7 +221,7 @@
 		<hr class="mt-6 mb-5 h-0.5 border-b border-gray-300 dark:border-gray-900 shadow-inset-t-white-05"/>
 		<div>
 			<h2 class="ml-2 font-bold text-lg font-heading leading-normal mb-2">Badges</h2>
-			<ul class="flex flex-row flex-wrap gap-2 mb-0">
+			<ul class="flex flex-row flex-wrap gap-2">
 				{% if u.badges %}
 				{% for b in u.badges %}
 				<li>
@@ -238,6 +238,11 @@
 				<p class="italic text-gray-500 text-sm">No badges... lame</p>
 				{% endif %}
 			</ul>
+			{% if v.admin_level > 2 %}
+				<a href="/admin/badge_grant" class="text-sm text-primary hover:underline">
+					Grant @{{ u.username }} badges
+				</a>
+			{% endif %}
 		</div>
 		<hr class="mt-6 mb-5 h-0.5 border-b border-gray-300 dark:border-gray-900 shadow-inset-t-white-05"/>
 		<div>
diff --git a/files/templates/CHRISTMAS/sidebars/SettingsSidebar.html b/files/templates/CHRISTMAS/sidebars/SettingsSidebar.html
index a0c7628ea..f958bc6d6 100644
--- a/files/templates/CHRISTMAS/sidebars/SettingsSidebar.html
+++ b/files/templates/CHRISTMAS/sidebars/SettingsSidebar.html
@@ -1,4 +1,4 @@
-<div class="hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 py-4">
+<div class="sidebar hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 py-4">
 	<div class="flex flex-col space-y-4">
 		<div class="flex flex-col rounded-md border border-gray-300 divide-y divide-gray-400/30 overflow-hidden">
 			<a href="/settings/profile" class="text-left block w-full px-4 py-3 text-shadow-t text-base font-medium text-gray-700 hover:text-gray-800 text-decoration-none active:text-gray-800 active:outline-none {{ 'bg-gray-200 shadow-inner' if request.path == '/settings/profile' else 'bg-gray-300 hover:bg-gray-400 shadow-inset-t-white-10' }}">
@@ -15,7 +15,7 @@
 			</a>
 		</div>
 		<div class="flex flex-col rounded-md border border-gray-300 divide-y divide-gray-400/30 overflow-hidden">
-			<a href="/settings/css" class="text-left block w-full px-4 py-3 text-shadow-t text-base font-medium text-gray-700 hover:text-gray-800 text-decoration-none active:text-gray-800 active:outline-none {{ 'bg-gray-200 bg-opacity-40 shadow-inner' if request.path == '/settings/css' else 'bg-gray-300 hover:bg-gray-400 shadow-inset-t-white-10' }}">
+			<a href="/settings/css" class="text-left block w-full px-4 py-3 text-shadow-t text-base font-medium text-gray-700 hover:text-gray-800 text-decoration-none active:text-gray-800 active:outline-none {{ 'bg-gray-200 shadow-inner' if request.path == '/settings/css' else 'bg-gray-300 hover:bg-gray-400 shadow-inset-t-white-10' }}">
 				<i class="fas fa-wrench fa-fw mr-1"></i>
 				Customization
 			</a>
diff --git a/files/templates/CHRISTMAS/sidebars/SubmissionSidebar.html b/files/templates/CHRISTMAS/sidebars/SubmissionSidebar.html
index d3c52a8a9..7dbd29ef7 100644
--- a/files/templates/CHRISTMAS/sidebars/SubmissionSidebar.html
+++ b/files/templates/CHRISTMAS/sidebars/SubmissionSidebar.html
@@ -1,4 +1,4 @@
-<div class="hidden xl:block xl:col-start-10 xl:col-end-13 flex flex-col flex-shrink-0 py-4">
+<div class="sidebar hidden xl:block xl:col-start-10 xl:col-end-13 flex flex-col flex-shrink-0 py-4">
 	<div>
 		<h2 class="ml-2 font-bold text-lg font-heading leading-normal mb-2">
 			Awards
diff --git a/files/templates/CHRISTMAS/sidebars/SubmitSidebar.html b/files/templates/CHRISTMAS/sidebars/SubmitSidebar.html
index 0e34999c6..a89377bf8 100644
--- a/files/templates/CHRISTMAS/sidebars/SubmitSidebar.html
+++ b/files/templates/CHRISTMAS/sidebars/SubmitSidebar.html
@@ -1,4 +1,4 @@
-<div class="hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 my-4 px-4 py-3 rounded-md bg-gray-300/40 dark:bg-gray-700/40 shadow-inner">
+<div class="sidebar hidden xl:block xl:col-start-10 xl:col-end-13 flex-shrink-0 my-4 px-4 py-3 rounded-md bg-gray-300/40 dark:bg-gray-700/40 shadow-inner">
 	<h2 class="ml-2 font-bold text-lg font-heading leading-normal mb-2">Options</h2>
 	<div class="flex flex-col space-y-4 mb-3">
 		<div class="flex items-center">
diff --git a/files/templates/CHRISTMAS/submission.html b/files/templates/CHRISTMAS/submission.html
index 547e7f526..c59594023 100644
--- a/files/templates/CHRISTMAS/submission.html
+++ b/files/templates/CHRISTMAS/submission.html
@@ -103,7 +103,7 @@
 
 {% block subHeader %}
 	<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
-		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700"></div>
+		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
 		<div class="relative col-span-full flex items-center">
 			<div>
 				<h1 class="font-bold text-xl font-heading leading-normal mb-0">
@@ -118,7 +118,7 @@
 					</li>
 					<li>
 						<a href="{{p.permalink}}" class="text-gray-700 dark:text-gray-500 hover:underline">{{p.author.username}}'s post</a>
-					<li>
+					</li>
 				</ul>
 			</div>
 		</div>
diff --git a/files/templates/CHRISTMAS/submission/SubmissionAwards.html b/files/templates/CHRISTMAS/submission/SubmissionAwards.html
index 9293969e3..e5927f234 100644
--- a/files/templates/CHRISTMAS/submission/SubmissionAwards.html
+++ b/files/templates/CHRISTMAS/submission/SubmissionAwards.html
@@ -5,33 +5,12 @@
 
 <!-- Poop award -->
 {% if p.award_count("shit") %}
-<script defer src="/assets/CHRISTMAS/js/bugs.js?a=1"></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/CHRISTMAS/images/fly-sprite.gif",
-		canDie: false,
-		minBugs: {{minbugs}},
-		maxBugs: {{maxbugs}},
-		mouseOver: "multiply"
-	});
-</script>
+	<script src="/static/assets/js/critters.js?a=3"></script>
+	<script src="/static/assets/js/bugs.js?a=3"></script>
 {% endif %}
 
 <!-- Fireflies award -->
 {% if p.award_count("fireflies") %}
-<script defer src="/assets/CHRISTMAS/js/fireflies.js?a=1"></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/CHRISTMAS/images/fireflies.gif",
-		canDie: false,
-		minBugs: {{minbugs}},
-		maxBugs: {{maxbugs}},
-		mouseOver: "multiply"
-	});
-</script>
+	<script src="/static/assets/js/critters.js?a=3"></script>
+	<script src="/static/assets/js/fireflies.js?a=3"></script>
 {% endif %}
-
diff --git a/files/templates/CHRISTMAS/submit.html b/files/templates/CHRISTMAS/submit.html
index b161b6836..5376de2d3 100644
--- a/files/templates/CHRISTMAS/submit.html
+++ b/files/templates/CHRISTMAS/submit.html
@@ -6,7 +6,7 @@
 
 {% block subHeader %}
 <div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
-	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700"></div>
+	<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700 sub-header"></div>
 	<div class="relative col-span-full flex items-center">
 		<div>
 			<h1 class="font-bold text-xl font-heading leading-normal mb-0">
diff --git a/files/templates/CHRISTMAS/tailwind-class-list.html b/files/templates/CHRISTMAS/tailwind-class-list.html
index 949eee4f6..a9c2a82d5 100644
--- a/files/templates/CHRISTMAS/tailwind-class-list.html
+++ b/files/templates/CHRISTMAS/tailwind-class-list.html
@@ -1,3 +1,9 @@
 <div class="animate-pulse hover:bg-gray-300 hover:opacity-100 md:hover:opacity-100 pointer-events-none"></div>
 
-<div class="text-twitter text-blue text-lightblue text-danger text-success text-gold text-silver text-light-green text-green-500 text-blue-200 dark:text-gray-100"></div>
\ No newline at end of file
+<div class="text-twitter text-blue text-lightblue text-danger text-success text-gold text-silver text-light-green text-green-500 text-blue-200 dark:text-gray-100"></div>
+
+<div class="bg-blue-200 text-blue-600 bg-green-200 text-green-600"></div>
+
+<div class="bg-yellow-200 text-yellow-600 bg-pink-200 text-pink-600"></div>
+
+<div class="bg-purple-200 text-purple-600"></div>
\ No newline at end of file
diff --git a/files/templates/CHRISTMAS/userpage.html b/files/templates/CHRISTMAS/userpage.html
index fe6824b93..bf9702977 100644
--- a/files/templates/CHRISTMAS/userpage.html
+++ b/files/templates/CHRISTMAS/userpage.html
@@ -4,9 +4,6 @@
 
 {% block title %}
 
-<!-- {% if u and u.profilecss and (u.admin_level or not (v and v.admin_level)) %}
-<link rel="stylesheet" href="/@{{u.username}}/profilecss">
-{% endif %} -->
 <title>{{u.username}}'s profile - {{'SITE_NAME' | app_config}}</title>
 {% if u.is_private %}
 <meta name="robots" content="noindex">
@@ -28,6 +25,10 @@
 <meta name="twitter:description" content="{{u.coins}} {{'COINS_NAME' | app_config}} - Joined {{u.created_date}} - {% if u.stored_subscriber_count >=1 and not u.is_private and not u.is_nofollow %}{{u.stored_subscriber_count}} Followers -{% endif %} {% if not u.is_private %} {{0 if u.shadowbanned else u.post_count}} Posts - {{0 if u.shadowbanned else u.comment_count}} Comments - {% endif %}{{u.bio}}">
 <meta name="twitter:image" content="{{u.banner_url}}" >
 <meta name="twitter:url" content="{{u.url | full_link}}" >
+
+{% if u and u.profilecss and (u.admin_level or not (v and v.admin_level)) %}
+<link rel="stylesheet" href="/@{{u.username}}/profilecss">
+{% endif %}
 {% endblock %}
 
 {% block subHeader %}
diff --git a/files/templates/CHRISTMAS/votes.html b/files/templates/CHRISTMAS/votes.html
index 6420cd7d6..03a16b9b6 100644
--- a/files/templates/CHRISTMAS/votes.html
+++ b/files/templates/CHRISTMAS/votes.html
@@ -5,6 +5,8 @@
 <meta name="description" content="{{'SITE_NAME' | app_config}} Votes">
 {% endblock %}
 
+{% block pagetype %}page-voting{% endblock %}
+
 {% block subHeader %}
 	<div class="relative max-w-screen-2xl mx-auto px-4 py-4 grid grid-cols-12 rounded-t">
 		<div class="absolute top-0 left-0 w-full h-full bg-gradient-to-t from-gray-300 to-gray-200 dark:bg-none dark:bg-gray-800 rounded-t sub-header-shadow dark:border-b dark:border-gray-700"></div>