From b21202497fbc7aa8a221fe8c4b060f2eb0a22657 Mon Sep 17 00:00:00 2001
From: edbrz9 <ed@brz9.devd>
Date: Fri, 30 Dec 2022 15:16:40 +0100
Subject: [PATCH] CSS file split

---
 proj/y2t/assets/css/colors.css | 14 ++++++++++
 proj/y2t/assets/css/fonts.css  | 29 ++++++++++++++++++++
 proj/y2t/assets/css/layout.css | 46 +++++++++++++++++++++++++++++--
 proj/y2t/assets/css/style.css  | 49 ++++------------------------------
 proj/y2t/assets/css/ux.css     |  7 +++++
 5 files changed, 99 insertions(+), 46 deletions(-)
 create mode 100644 proj/y2t/assets/css/colors.css
 create mode 100644 proj/y2t/assets/css/fonts.css
 create mode 100644 proj/y2t/assets/css/ux.css

diff --git a/proj/y2t/assets/css/colors.css b/proj/y2t/assets/css/colors.css
new file mode 100644
index 0000000..2e9f824
--- /dev/null
+++ b/proj/y2t/assets/css/colors.css
@@ -0,0 +1,14 @@
+:root {
+    --black: #232D37;
+    --white: #FAE2D3;
+  }
+
+body {
+    color: var(--black);
+    background-color: var(--white);
+}
+
+a {
+    color: inherit;
+    text-decoration: none;
+}
\ No newline at end of file
diff --git a/proj/y2t/assets/css/fonts.css b/proj/y2t/assets/css/fonts.css
new file mode 100644
index 0000000..5e4c41a
--- /dev/null
+++ b/proj/y2t/assets/css/fonts.css
@@ -0,0 +1,29 @@
+@font-face{
+    font-family: inter;
+    src: url("https://file.brz9.dev/cdn/fonts/serv/Inter/Inter-Regular.woff");
+    font-style: normal;
+    font-weight: 400;
+}
+
+@font-face{
+    font-family: inter;
+    src: url("https://file.brz9.dev/cdn/fonts/serv/Inter/Inter-Italic.woff");
+    font-style: italic;
+    font-weight: 400;
+}
+
+@font-face{
+    font-family: inter;
+    src: url("https://file.brz9.dev/cdn/fonts/serv/Inter/Inter-Bold.woff");
+    font-style: normal;
+    font-weight: 600;
+}
+
+body {
+    font-family: inter;
+    font-weight: 600;
+}
+
+a {
+    text-decoration: none;
+}
\ No newline at end of file
diff --git a/proj/y2t/assets/css/layout.css b/proj/y2t/assets/css/layout.css
index 59516c9..246c35c 100644
--- a/proj/y2t/assets/css/layout.css
+++ b/proj/y2t/assets/css/layout.css
@@ -1,3 +1,45 @@
-div {
-    color: red;
+div#root {
+    display: flex;
+    flex-direction: column;
+    min-height: 90vh;
+}
+
+main {
+    flex: 1;
+    max-width: 50vw;
+    margin-left: auto;
+    margin-right: auto;
+    text-align: center;
+}
+
+footer {
+    flex: 0;
+    bottom: 10px;
+    width: 100%;
+    text-align: center;
+}
+
+
+div.y2t-output {
+    display: flow-root;
+}
+
+div.y2t-output button {
+    margin-bottom: 20px;
+    display:block;
+}
+
+div.y2t-output div {    
+    max-height: 120px;
+    overflow-y: scroll;
+    display:block;
+}
+
+
+@media only screen and (max-width: 800px) {
+    main {
+        max-width: 80vw;
+        margin-left: 10vw;
+        margin-right: 10vw;
+    }
 }
\ No newline at end of file
diff --git a/proj/y2t/assets/css/style.css b/proj/y2t/assets/css/style.css
index 68942a4..bd49483 100644
--- a/proj/y2t/assets/css/style.css
+++ b/proj/y2t/assets/css/style.css
@@ -1,45 +1,6 @@
+@import url("https://file.brz9.dev/web/css/normalize.css");
+@import url("https://file.brz9.dev/cdn/fonts/byl-iconfont-v4.0/icons.css");
 @import url("./layout.css");
-
-html {
-    min-height: 100vh;
-    position: relative;
-  }
-  
-body {
-    /* white to black linear noise gradient spanning from top to bottom */
-    background-image:
-        url('https://ed.brz9.dev/assets/svg/noise.svg'),
-        linear-gradient(to bottom right, #2e3551, #0d747d);
-}
-
-@font-face{
-    font-family: inter;
-    src: url("https://ed.brz9.dev/assets/fonts/inter/Inter-Regular.woff");
-    font-style: normal;
-    font-weight: normal;
-}
-
-body {
-    font-family: inter;
-    color: #e9d2d2;
-    height: 100%;
-}
-
-div.y2t-output {
-    display: flow-root;
-}
-
-div.y2t-output button {
-    margin-bottom: 20px;
-    display:block;
-}
-
-div.y2t-output div {    
-    max-height: 120px;
-    overflow-y: scroll;
-    display:block;
-}
-
-input {
-    width: 400px;
-}
\ No newline at end of file
+@import url("./colors.css");
+@import url("./fonts.css");
+@import url("./ux.css");
\ No newline at end of file
diff --git a/proj/y2t/assets/css/ux.css b/proj/y2t/assets/css/ux.css
new file mode 100644
index 0000000..90f09cb
--- /dev/null
+++ b/proj/y2t/assets/css/ux.css
@@ -0,0 +1,7 @@
+a {
+    cursor: pointer;
+}
+
+input, select {
+    cursor: pointer;
+}
\ No newline at end of file