Website Updatefeature/remove-tailwind

* Full Rewrite
* Removed Tailwind CSS
* Stripdowned to barebone css

1 files changed, 80 insertions, 99 deletions

diff --git a/src/css/styles.css b/src/css/styles.css
index 11ffa9e..73aeb0c 100644
--- a/src/css/styles.css
+++ b/src/css/styles.css
@@ -1,145 +1,126 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap');
 
 @font-face {
-    font-family: supplyRegular;
-    src: url(./fonts/PPSupplyMono-Regular.otf);
+	font-family: 'MarioWorld';
+	src: url("./fonts/Cotory-rgwd9.ttf");
 }
 
-@font-face {
-    font-family: supplyLight;
-    src: url(./fonts/PPSupplyMono-Ultralight.otf);
+html,body {
+	margin: 0;
+	padding: 0;
 }
 
-code[class*="language-"],
-pre[class*="language-"] {
-	color: #657b83; /* base00 */
-	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
-	font-size: 1em;
-	text-align: left;
-	white-space: pre;
-	word-spacing: normal;
-	word-break: normal;
-	word-wrap: normal;
-
-	line-height: 1.5;
+body {
+	font-family: 'IBM Plex Mono', monospace;
+	max-width: 900px;
+	margin: auto;
+	background: #ffffd6;
+}
 
-	-moz-tab-size: 4;
-	-o-tab-size: 4;
-	tab-size: 4;
+footer {
+	bottom: 0px;
+	left: 0;
+	text-align: center;
+	width: 100%;
+}
 
-	-webkit-hyphens: none;
-	-moz-hyphens: none;
-	-ms-hyphens: none;
-	hyphens: none;
+* {
+	box-sizing: border-box;
 }
 
-pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
-code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
-	background: #073642; /* base02 */
+.header {
+	text-align: center;
+}
+.header nav {
+	display: block;
 }
 
-pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
-code[class*="language-"]::selection, code[class*="language-"] ::selection {
-	background: #073642; /* base02 */
+.header ul, footer ul {
+	padding: 0px;
 }
 
-/* Code blocks */
-pre[class*="language-"] {
-	padding: 1em;
-	margin: .5em 0;
-	overflow: auto;
-	border-radius: 0.3em;
+.header ul>li {
+	display: inline-block;
+	padding: 10px;
+	text-align: center;
 }
 
-:not(pre) > code[class*="language-"],
-pre[class*="language-"] {
-	background-color: #fdf6e3; /* base3 */
+.header ul>li a {
+	text-decoration: none;
+	font-size: 15px;
+	color: #000000;
+	font-weight: bold;
 }
 
-/* Inline code */
-:not(pre) > code[class*="language-"] {
-	padding: .1em;
-	border-radius: .3em;
+.text-center {
+	/* text-align: center; */
 }
 
-.token.comment,
-.token.prolog,
-.token.doctype,
-.token.cdata {
-	color: #93a1a1; /* base1 */
+footer ul>li {
+	display: inline-block;
 }
 
-.token.punctuation {
-	color: #586e75; /* base01 */
+footer ul>li>p {
+	margin-block-end: unset;
 }
 
-.token.namespace {
-	opacity: .7;
+
+.logo {
+	text-decoration: none;
+	font-family: 'MarioWorld', sans-serif;
+	font-size: 150%;
+	color: #000000;
 }
 
-.token.property,
-.token.tag,
-.token.boolean,
-.token.number,
-.token.constant,
-.token.symbol,
-.token.deleted {
-	color: #268bd2; /* blue */
+.mt-10 {
+	margin-top: 10px;
 }
 
-.token.selector,
-.token.attr-name,
-.token.string,
-.token.char,
-.token.builtin,
-.token.url,
-.token.inserted {
-	color: #2aa198; /* cyan */
+.font-bold {
+	font-weight: bold;
 }
 
-.token.entity {
-	color: #657b83; /* base00 */
-	background: #eee8d5; /* base2 */
+.font-italics {
+	font-style: italic;
 }
 
-.token.atrule,
-.token.attr-value,
-.token.keyword {
-	color: #859900; /* green */
+table {
+	border-collapse: collapse;
 }
 
-.token.function,
-.token.class-name {
-	color: #b58900; /* yellow */
+th, tr, td {
+	border: 1px solid;
 }
 
-.token.regex,
-.token.important,
-.token.variable {
-	color: #cb4b16; /* orange */
+table tr {
+	padding-bottom: 10px;
 }
 
-.token.important,
-.token.bold {
-	font-weight: bold;
+table th {
+	padding-right: 20px;
 }
-.token.italic {
-	font-style: italic;
+
+table td {
+	padding: 10px;
 }
 
-.token.entity {
-	cursor: help;
+.post-date {
+	font-size: 15px;
+	font-style: italic;
 }
 
-.article-intro::first-letter {
-	font-size: 2rem;
-    font-weight: bold;
+.post-lists li {
+	list-style-type: '◆  ';
+	margin-bottom: 5px;
 }
 
-svg {
-	display: unset;
+@media (max-width:1000px)  {
+    body {
+        font-size: 80%;
+        padding: 3%;
+    }
+    #blog img{
+        max-width: 80%;
+    }
 }