2 files changed, 484 insertions, 0 deletions
diff --git a/views/css/themes/default.css b/views/css/themes/default.css
new file mode 100644
index 0000000..98edc29
--- /dev/null
+++ b/views/css/themes/default.css
@@ -0,0 +1,249 @@
+a, a:link, a:visited, a:hover, a:active {
+	text-decoration: none
+}
+
+a:link, a:visited,  a:active {
+	color: black;
+}
+
+a:hover {
+	color: #de0808;
+}
+
+body {
+	background-color: #eef2fe;
+	color: black;
+}
+
+body.nsfw {
+	background-color: #ffffee;
+	color: #820404
+}
+
+h1, h2, h3, h4, h5, h6 {
+	color: #af0a0f;
+}
+
+.popup-box {
+	border: 4px solid #d3caf0;
+	background-color: #eff5ff;
+}
+
+.nsfw .popup-box {
+	border: 4px solid #f0e2d9;
+	background-color: #f9f9e0;
+}
+
+.box {
+	background-color: #eff5ff;
+}
+
+.nsfw .box {
+	background-color: #f9f9e0;
+}
+
+.box-alt {
+	background-color: #d3caf0;
+}
+
+.nsfw .box-alt {
+	background-color: #f0e2d9;
+}
+
+
+.quote {
+	color: #789922;
+}
+
+.post {
+	background-color: #d5daf0;
+}
+
+.nsfw .post {
+	background-color: #f0e0d6;
+}
+
+:target > div > .post {
+	background-color: #d6bad0;
+}
+
+.nsfw :target > div > .post {
+	background-color: #f0c0b0;
+}
+
+.title {
+	color: #0f0c5d;
+}
+
+.name, .tripcode {
+	color: #117743;
+}
+
+a.reply {
+	color: #af0a0f;
+	text-decoration: 1px underline;
+}
+
+.replyLink {
+	color: #000080;
+	font-size: 0.8em;
+}
+
+#newpostbtn {
+	text-align: center;
+	margin-top: 80px;
+}
+
+#postForm {
+  margin: auto;
+}
+
+#postForm tr > td:first-child {
+  background-color: #98e;
+  border: 1px black;
+  padding-left: 0.5em;
+  padding-right: 0.5em;
+}
+
+.nsfw #postForm tr > td:first-child {
+  background-color: #ea8;
+}
+
+#postForm input[type="text"],
+#postForm textarea,
+#reply-name, #reply-options, #reply-comment {
+  box-sizing: border-box;
+  -webkit-box-sizing:border-box;
+  -moz-box-sizing: border-box;
+}
+
+#postForm input[type="text"],
+#postForm textarea,
+#reply-name, #reply-options, #reply-comment {
+  box-sizing: border-box;
+  -webkit-box-sizing:border-box;
+  -moz-box-sizing: border-box;
+}
+
+#reply-comment {
+	min-width: 300px;
+	width: 396px;
+	height: 200px;
+}
+
+#reply-name {
+	width: 75%;
+	float: left;
+}
+
+#reply-options {
+	width: 25%;
+	float: right;
+}
+
+#reply-header {
+	display: inline-block;
+	width: 100%;
+	cursor: move;
+}
+
+#postForm #captcha {
+	display: block;
+	width: 100%;
+}
+
+.popup-box {
+	position: fixed;
+	min-width: 300px;
+	width: min-content;
+	z-index: 9;
+	display: block;
+}
+
+/* TODO: rename */
+.box2 {
+	border: 4px solid #f0e2d9;
+	background-color: #f9f9e0;
+}
+
+.newsbox {
+    padding: 25px;
+    border: 4px solid #f0e2d9;
+    background-color: #f9f9e0;
+}
+
+.newsbox h2 {
+    margin: 0;
+    padding: 0;
+}
+
+.newsbox-news {
+    text-align: left;
+    margin-top: 25px;
+    padding: 25px;
+}
+
+.newsbox-news p,
+.newsbox-news h3 {
+    margin: 0;
+}
+
+#stopTablePost {
+	float: right;
+	display: none;
+}
+
+#boardGrid {
+	display: grid;
+	grid-auto-columns: 1fr;
+	border: 4px solid #820404;
+	background-color: #f9f9e0;
+}
+
+#boardGridHeader {
+	border-bottom: 2px solid #820404;
+	display: inline-grid;
+}
+
+.boardGridCell {
+	white-space: nowrap;
+	display: inline-grid;
+	text-align: left;
+	padding: 5px;
+	border-top: 2px solid #820404;
+	border-left: 2px solid #820404;
+}
+
+/* these may or may not work. my CSS is poor so i just kinda did stuff until it worked. */
+.boardGridCell:nth-child(-n+4) {
+	border-top: none;
+}
+
+.boardGridCell:nth-child(3n+2) {
+	border-left: none;
+}
+
+#threadfooter {
+	width: 100%;
+	table-layout: fixed;
+	border-collapse: collapse;
+}
+
+#threadfooter td {
+	padding: 0;
+	margin: 0;
+}
+
+#threadfooter #threadStats {
+	float: right;
+}
+
+#navlinks, #boardlinks {
+	padding: 0;
+	margin: 0;
+}
+
+#navlinks > li,
+#boardlinks > li {
+	display: inline;
+}
diff --git a/views/css/themes/gruvbox.css b/views/css/themes/gruvbox.css
new file mode 100644
index 0000000..8704482
--- /dev/null
+++ b/views/css/themes/gruvbox.css
@@ -0,0 +1,235 @@
+a, a:link, a:visited, a:active {
+	color: #b16286;
+	text-decoration: none
+}
+
+a.reply {
+	color: #cc241d;
+	text-decoration: 1px underline;
+}
+
+a:hover.reply {
+	color: #fb4934;
+}
+
+body {
+	background: #282828;
+	color: #ebdbb2;
+
+	font-family: monospace, sans-serif;
+	font-size: 0.9em;
+}
+
+.popup-box {
+	border: 4px solid #928374;
+	background-color: #3c3836;
+}
+
+.box, .box-alt {
+	background-color: #3c3836;
+}
+
+.quote {
+	color: #98971a;
+}
+
+.post {
+	background-color: #1d2021;
+}
+
+:target > div > .post {
+	background-color: #504945;
+}
+
+.subject {
+	color: #458588;
+}
+
+.name {
+	color: #b8bb26;
+}
+
+.tripcode {
+	color: #689d6a;
+}
+
+h1,h2,h3,h4,h5,h6 {
+	color: #fb4934;
+	margin-bottom: 0.1em;
+}
+
+.replyLink {
+	color: #83a598;
+	font-size: 0.8em;
+}
+
+#newpostbtn {
+	text-align: center;
+	margin-top: 80px;
+}
+
+input[type="text"] {
+	-webkit-appearance: none;
+	-webkit-border-radius: 0;
+}
+
+#postForm {
+	border: 4px solid #928374;
+	background-color: #3c3836;
+	margin: auto;
+}
+
+#postForm tr > td:first-child {
+	background-color: #504945;
+	padding-left: 0.5em;
+	padding-right: 0.5em;
+}
+
+#postForm input[type="text"],
+#postForm textarea,
+#reply-name, #reply-options, #reply-comment {
+	background-color: #504945;
+	color: #ebdbb2;
+	border: 0;
+	border-bottom: 2px solid #3c3836;
+	font-family: monospace, sans-serif;
+
+	box-sizing: border-box;
+	-webkit-box-sizing:border-box;
+	-moz-box-sizing: border-box;
+}
+
+#postForm input[type="text"]:focus,
+#postForm textarea:focus,
+#reply-name:focus, #reply-options:focus, #reply-comment:focus {
+	outline: none;
+}
+
+#reply-comment {
+	min-width: 300px;
+	width: 396px;
+	height: 200px;
+}
+
+#reply-name {
+	width: 75%;
+	float: left;
+}
+
+#reply-options {
+	width: 25%;
+	border-left: 2px solid #3c3836;
+	float: right;
+}
+
+#reply-header {
+	display: inline-block;
+	width: 100%;
+	cursor: move;
+}
+
+#postForm #captcha {
+	display: block;
+	width: 100%;
+}
+
+.popup-box {
+	position: fixed;
+	min-width: 300px;
+	width: min-content;
+	z-index: 9;
+	display: block;
+}
+
+/* TODO: rename */
+.box2 {
+	border: 4px solid #928374;
+	background-color: #3c3836;
+}
+
+.newsbox {
+	padding: 25px;
+	border: 4px solid #928374;
+	background-color: #3c3836;
+}
+
+.newsbox h2 {
+	margin: 0;
+	padding: 0;
+}
+
+.newsbox-news {
+	text-align: left;
+	background-color: #504945;
+	margin-top: 25px;
+	padding: 25px;
+}
+
+.newsbox-news p,
+.newsbox-news h3 {
+	margin: 0;
+}
+
+#stopTablePost {
+	float: right;
+	display: none;
+}
+
+#boardGrid {
+	display: grid;
+	grid-auto-columns: 1fr;
+	border: 4px solid #928374;
+	background-color: #3c3836;
+}
+
+#boardGridHeader {
+	border-bottom: 2px solid #928374;
+	display: inline-grid;
+}
+
+.boardGridCell {
+	white-space: nowrap;
+	display: inline-grid;
+	text-align: left;
+	padding: 5px;
+	border-top: 2px solid #928374;
+	border-left: 2px solid #928374;
+}
+
+/* these may or may not work. my CSS is poor so i just kinda did stuff until it worked. */
+.boardGridCell:nth-child(-n+4) {
+	border-top: none;
+}
+
+.boardGridCell:nth-child(3n+2) {
+	border-left: none;
+}
+
+#threadfooter {
+	width: 100%;
+	table-layout: fixed;
+	border-collapse: collapse;
+}
+
+#threadfooter td {
+	padding: 0;
+	margin: 0;
+}
+
+#threadfooter #threadStats {
+	float: right;
+}
+
+#navlinks, #boardlinks {
+	padding: 0;
+	margin: 0;
+}
+
+#navlinks > li,
+#boardlinks > li {
+	display: inline;
+}
+
+hr {
+	border: 1px solid #928374;
+}