From ed7efdcaa3611e839344b64555ff07b2a6ee1e59 Mon Sep 17 00:00:00 2001 From: CentreMetre Date: Mon, 1 Jun 2026 21:29:56 +0100 Subject: [PATCH] Improve Styling --- public/index.html | 47 ++++++++++++++++++++++++---------------------- public/style.css | 48 +++++++++++++++++++++++++++++++++++++++-------- 2 files changed, 65 insertions(+), 30 deletions(-) diff --git a/public/index.html b/public/index.html index 801ac61..f2138f7 100644 --- a/public/index.html +++ b/public/index.html @@ -7,28 +7,31 @@ HTML 5 Boilerplate - -

CodeList

-
-

Generate new list

-
- - -
-
- - -
-
-
-

- Output -

-
-
+ +
+

CodeList

+
+

Generate new list

+
+ + +
+
+ + +
+
+

+ Output +

+
+
+
+
+
diff --git a/public/style.css b/public/style.css index d235930..a8101cc 100644 --- a/public/style.css +++ b/public/style.css @@ -1,22 +1,54 @@ -#output-area { - border-right: 2px solid grey; - border-top: 1px solid grey; - border-bottom: 1px solid grey; - width: 30ch; +body { + font-family: sans-serif; } -#output-area:focus { - outline: none; +.layer-0 { + background-color: #F2F4F6; +} + +.layer-1 { + background-color: #F7F9FB; +} + +.content { + padding-left: 2rem; + padding-right: 2rem; + + margin-left: 1rem; + margin-right: 1rem; + border: 1px solid #dcd9e5; + border-radius: .5rem; +} + +#output-area { + border-right: 2px solid #DCDBE6; + border-top: 1px solid #DCDBE6; + border-bottom: 1px solid #DCDBE6; + border-left: 1px solid #DCDBE6; + /* border-radius: .5rem; */ + + width: 30ch; + + font-family: 'Courier New', Courier, monospace; } .gutter-row { - background-color: rgb(179, 179, 179); + background-color: #F2F4F6; + height: 4ch; + padding-right: 0.4rem; + padding-left: 2rem; } .output-row { display: flex; + background-color: white; } .strike { text-decoration: line-through; +} + +.content-row { + padding-top: 0.1rem; + padding-left: .5rem; } \ No newline at end of file