style tweaks

2025-11-03 15:58:48 -05:00 · 2025-11-03 15:58:48 -05:00 · 11bc2e1d99
commit 11bc2e1d99
parent 66f0d22970
3 changed files with 56 additions and 8 deletions
--- a/app.js
+++ b/app.js
@ -171,7 +171,7 @@ function Desks(inDesks)
                            )
                        );
                    }),
-                    DOM.td("⇉"),
+                    DOM.td(Div.Icon("⇉")),
                    desk.make.map((part, index, array)=>
                    {
                        const partPass = part.pass.get(pass);
--- a/index.html
+++ b/index.html
@ -3,6 +3,46 @@
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
+    <style>
+/* Basic CSS Reset */
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+html, body {
+  height: 100%;
+  font-family: sans-serif;
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+img, picture, video, canvas, svg {
+  display: block;
+  max-width: 100%;
+}
+
+input, button, textarea, select {
+  font: inherit;
+}
+
+a {
+  text-decoration: none;
+  color: inherit;
+}
+
+ul, ol {
+  list-style: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+    </style>
 </head>
 <body>
    <script>
--- a/styles.js
+++ b/styles.js
@ -9,23 +9,31 @@ export default Gale({
        display: `flex`,
        flexWrap: `wrap`
    },
+    Icon:{
+        background:"black",
+        color:"white",
+        borderRadius:"2rem",
+        fontWeight:"bolder",
+        padding:"0 0.8rem",
+        margin:"0 1rem"
+    },
    Part:{
        border: `1px solid black`,
        borderRadius: `5px`,
-        padding: `1rem`,
+        padding: `0.5rem 1rem`,
+        minHeight: "2rem",
    },
    PartGood:{
        background:"#009b2e",
        color:"white",
-        fontWeight: "bolder",
    },
    PartEmpty:{
-        background:"gray"
+        background:"#ddd"
    },
    PartDirty:{
-        background:"tomato",
-        color:"black",
-        fontWeight:"bolder"
+        background:"red",
+        color:"white",
+        fontWeight:"bold"
    },
    PartCaution:{
        background:"yellow",
@ -47,7 +55,7 @@ export default Gale({
    },
    GapHorizontal:{
        borderCollapse:"separate",
-        borderSpacing:"0 2rem",
+        borderSpacing:"0.3rem 2rem",
    },
    GapVertical:{
        borderCollapse:"separate",