added stuff

nyx/docs/templates/scss/base.scss

@@ -0,0 +1,178 @@
+*,
+::before,
+::after {
+	box-sizing: border-box;
+}
+
+// Base styles
+h1 {
+	font-family: $font-family-secondary;
+	line-height: 1.15;
+}
+
+body {
+	font-size: 20px;
+	line-height: 1.5;
+	font-family: $font-family-primary;
+	margin: 0;
+	padding: 0;
+	background-color: $primary;
+	display: flex;
+	flex-direction: column;
+	min-height: 100vh;
+
+	@media (max-width: $screen-tablet) {
+		font-size: 18px;
+	}
+}
+
+header {
+	background-color: $primary;
+	color: $secondary;
+	padding: 10px 25px;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	max-width: 80ch;
+	width: 100%;
+	margin: 0 auto;
+
+	@media (max-width: $screen-tablet) {
+		font-size: 14px;
+		padding: 8px 4px;
+	}
+}
+
+nav {
+	ul {
+		list-style-type: none;
+		margin: 0;
+		padding: 0;
+		display: flex;
+
+		li {
+			a {
+				color: $secondary;
+				text-decoration: none;
+			}
+		}
+	}
+}
+
+main {
+	text-align: left;
+	color: $secondary;
+	padding: 10px 30px;
+	flex: 1;
+	margin: 0 auto;
+	max-width: Min(80ch, 100%);
+
+	a {
+		&:hover,
+		&:link,
+		&:visited,
+		&:active {
+			color: $hover-color;
+			text-decoration: none;
+		}
+	}
+
+	@media (max-width: $screen-tablet) {
+		padding: 12px;
+	}
+}
+
+// Buttons
+/*
+.primary-buttons,
+.secondary-buttons,
+*/
+.dropbtn,
+.nav-button {
+	font-weight: 800;
+	background-color: $primary;
+	color: $secondary;
+	cursor: pointer;
+	font-weight: 800;
+	background-color: $primary;
+	color: $secondary;
+	cursor: pointer;
+	font-weight: 800;
+	font-family: "Roboto Slab", Roboto, Arial, sans-serif;
+	font-size: 20px;
+	line-height: 1.5;
+	border: none;
+	align-items: center;
+	margin: 0px 5px;
+
+	&:hover {
+		color: lighten($secondary, 5%);
+	}
+}
+
+// Dropdown Button
+.dropbtn:hover {
+	color: lighten($secondary, 5%);
+}
+
+.dropdown {
+	position: relative;
+	display: inline-block;
+
+	.dropdown-content {
+		display: none;
+		position: absolute;
+		background-color: $primary;
+		min-width: 240px;
+		box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
+		z-index: 1;
+
+		a {
+			color: $secondary;
+			padding: 12px 16px;
+			text-decoration: none;
+			display: block;
+
+			&:hover {
+				background-color: #2b282d;
+			}
+		}
+	}
+
+	&:hover .dropdown-content {
+		display: block;
+	}
+}
+
+main aside {
+	overflow: scroll;
+}
+
+// Footer Styles
+footer {
+	color: white;
+	padding: 7px 5px 7px 5px;
+	text-align: center;
+	margin-top: auto;
+	position: relative;
+
+	.footer-divider {
+		position: absolute;
+		top: 0;
+		left: 50%;
+		transform: translateX(-50%);
+		width: 20%;
+		height: 1px;
+		background-color: white;
+	}
+
+	.footer-icons {
+		margin: 15px 5px;
+
+		a {
+			color: white;
+			text-decoration: none;
+			margin-bottom: 5px;
+		}
+	}
+}

nyx/docs/templates/scss/components/code.scss

@@ -0,0 +1,9 @@
+div.sourceCode {
+	border: 1px solid #3b373d;
+	padding: 8px;
+	text-align: left;
+	background-color: lighten($primary, 3%);
+	overflow: scroll;
+	max-width: 100%;
+	border-radius: 8px;
+}

nyx/docs/templates/scss/components/table.scss

@@ -0,0 +1,21 @@
+table {
+	border-collapse: collapse;
+	width: 100%;
+	margin: 30px 0px;
+
+	th,
+	td {
+		border: 1px solid #3b373d;
+		padding: 8px;
+		text-align: left;
+	}
+
+	th {
+		background-color: #141215;
+		color: white;
+	}
+
+	tr:nth-child(even) {
+		background-color: #2b282d;
+	}
+}

nyx/docs/templates/scss/components/toc.scss

@@ -0,0 +1,30 @@
+// Table Of Content element injected by Pandoc
+#TOC {
+	// better spacing
+	margin: 20px;
+	padding: 10px;
+
+	// TOC elements are considered links
+	// so the below styling applies to all items
+	a {
+		text-decoration: none;
+		color: $secondary;
+
+		&:hover {
+			color: lighten($secondary, 5%);
+		}
+	}
+
+	// make sure all items are properly aligned in separate lines
+	li,
+	ul {
+		list-style-type: square;
+		margin-left: 20px;
+		display: block;
+	}
+
+	// hide the TOC on mobile devices
+	@media screen and (max-width: 768px) {
+		display: none;
+	}
+}

nyx/docs/templates/scss/main.scss

@@ -0,0 +1,6 @@
+@import "modern-normalize.css";
+@import "variables";
+@import "base";
+@import "components/toc";
+@import "components/table";
+@import "components/code";

nyx/docs/templates/scss/variables.scss

@@ -0,0 +1,7 @@
+// Define variables for colors and fonts
+$primary: #17181c;
+$secondary: #dee2e6;
+$hover-color: #66b3ff;
+$font-family-primary: "Roboto Slab", Roboto, Arial, sans-serif;
+$font-family-secondary: "Courier Prime", Roboto, Arial, serif;
+$screen-tablet: 768px;