From 26c6f751259e574416afcd6a63a84ae464ef6137 Mon Sep 17 00:00:00 2001
From: Sophie Axebane <ideleted@system64.dev>
Date: Mon, 31 Jul 2023 17:16:29 -0500
Subject: [PATCH] Rewrite button stylesheet

---
 styles/button_style.css | 137 ++++++++++------------------------------
 1 file changed, 34 insertions(+), 103 deletions(-)

diff --git a/styles/button_style.css b/styles/button_style.css
index 9af5e17..6d760cb 100644
--- a/styles/button_style.css
+++ b/styles/button_style.css
@@ -1,124 +1,55 @@
-/* CSS for System64.dev buttons, by IDeletedSystem64. Under MIT License (v4.14.23) */
-/* Loosely based from 98css, Check it out here: https://jdan.github.io/98.css/ */
-@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@600&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');
-/* Import dem fonts */
+/* CSS for System64.dev v2, by IDeletedSystem64. Under MIT License (7.31.23) */
+@font-face { font-family: 'Share Tech'; src: url(../fonts/Share-Tech/ShareTech-Regular.ttf) format('woff2'); }
+@font-face { font-family: 'Share Tech Mono'; src: url(../fonts/Share-Tech/ShareTechMono-Regular.ttf) format('woff2'); }
+/* Get those fonts */
+
+/* 
+CSS rule items are seperated depending on what they do around here,
+For example: Text/font related rules are grouped together
+while the height/width is in its own group, with white space 
+seperating the groups; They are also seperated with comments.
+*/
+
+/* Input / Buttons */
 
 input {
     -webkit-appearance: none;
     appearance: none;
+
     background: #c3c3c3;
     box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;
 
-    min-width:  200px;
+    top: -1px;
+    min-width: 200px; 
     min-height: 16px;
     
-    color: black;
-    font-size: 17pt;
-    font-family: 'Share Tech Mono', monospace;
-}
-input.taskbar {
-    -webkit-appearance: none;
-    appearance: none;
-    background: #c3c3c3;
-    box-shadow: inset -1px -1px #0a0a0a,inset 1px 1px #fff,inset -2px -2px grey,inset 2px 2px #dfdfdf;
-
     font-family: 'Share Tech Mono', 'monospace';
     font-size: 13pt;
     font-weight: bold;
-
-    height: 26px;
-    min-width: 170px;
-    max-width: 230px;
-    margin-top: 1px;
-    margin-left: 2px;
-}
-
-input.taskbar:active {
-    background: #acacac; 
-    background-position: 2px;
-}
-
-input.start {
-    height: 28px;
-    min-width: 130px;
-    max-width: 230px;
-    margin-top: 1px;
-    margin-left: 2px;
-
-    background: url(/img/taskbar/blueberry_pt.png) left no-repeat;
-    padding-left: 25px; 
-    background-position: 3px;
-    font-size: 17px;
-    font-weight: bold;
-}
-
-input.start:active {
- background-color: #acacac;
- background-image: url(/img/taskbar/blueberry_pt.png) left no-repeat;   
 }
 
 input:active {
-    background: #acacac;
-    box-shadow: inset 0em 0em
+    background: #dadada;
+    box-shadow: inset 0em 0em;
 }
 
-.button {
-    display: inline-flex;
-    font-size: 16px;
-    text-align: center;
-    border: none;
-    border-radius: 4px;
-    outline: none;
-    box-shadow: none;
-    cursor: pointer;
-    transition: 0.3s ease-in-out;
+/* Inputs for Taskbar */
+
+input.start {
+    /* Yes, the home button is called the "Start" button inside, sue us, Microsoft! */
+    height: 29px;
+    min-width: 130px;
+    max-width: 230px;
+
+    padding-left: 25px;
+    
+    background: url(/img/taskbar/blueberry_pt.png) no-repeat, left;
+    background-position: 3px;
 }
 
-.button.button1 {
-    border-radius: 0;
-    box-sizing: border-box;
-    min-height: 23px;
-    color: #000;
-    padding: 0 2px 2px 0;
-    border-top: 1px solid #CCCCCC;
-    border-right: 0.1px solid transparent;
-    border-bottom: 1px solid #333333;
-    border-left: 1px solid #CCCCCC;
-    background-color: #979797;
-    width: 15%;
-}
 
-.button.button1 span {
-    -webkit-appearance: none;
-    appearance: none;
-    margin-left: auto;
-    margin-right: auto;
-    display: block;
-    width: 100%;
-    background: #dad9d9;
-    font-size: 170%;
-    font-family: 'Share Tech Mono', monospace;
-    box-shadow: inset -0.05em -0.05em black;
-}
-
-.button.button1 span:hover,
-.button.button1:hover + .button.button1 span {
-    background-color: #ACACAC;
-    border-top: 1px solid transparent;
-    border-right: 0.1px solid #dad9d9;
-    border-bottom: 1px solid #dad9d9;
-    border-left: 1px solid transparent;
-    box-shadow: inset -0.05em -0.05em transparent;}
-.button.button1:hover {
-    background-color: #ACACAC;
-}
-/* *vomits* */
-
-@media (max-width: 64em) {
-input {
-    min-height: 70px;
-    min-width: 250px;
-    font-size: 32pt;
-}
+input.taskbar{
+    height: 29px;
+    min-width: 170px;
+    max-width: 230px;
 }
\ No newline at end of file