chore: deploy styles

src/client/Deploy.jsx

@@ -1,8 +1,30 @@
 import { Value } from './Inspect.jsx'
 
+// const GitRef = ({ type, value }) => {
+//     return type === 'default' ? (
+//         <div class="git-ref">default</div>
+//     ) : (
+//         <div class={'git-ref ' + type}>{value}</div>
+//     )
+// }
+
+// const BaseDeploy = ({ name, ...rest }) => <>
+//     <div class="name">{name}</div>
+//     <div class="url">
+//         <div class="material-symbols-outlined">commit</div>
+//         <div class="value">{url}</div>
+//     </div>
+//     <GitRef {...ref} />
+// </>
+
 export const Deploy = ({ deploy }) => {
     return (
         <div class="deploy">
+            <div class="name">{deploy.name}</div>
+            <div class="type">{deploy.type}</div>
+            <div class="type">{deploy.type}</div>
+            <div class="type">{deploy.type}</div>
+
             <Value value={deploy} borderless />
         </div>
     )

src/config.ts

@@ -7,7 +7,9 @@ import { Mutex } from 'async-mutex'
 import { debug } from './logger'
 
 export const GitRef = z.union([
-    z.object({ type: z.literal('default') }),
+    z.object({
+        type: z.literal('default'),
+    }),
     z.object({
         type: z.union([z.literal('branch'), z.literal('branch'), z.literal('branch')]),
         value: z.string(),

src/styles/main.scss

@@ -297,9 +297,15 @@ form {
 .deploy {
     width: 100%;
 
-    border: 1px solid #ddd;
+    background: $accent-400;
     padding: 1rem;
     border-radius: 1rem;
+
+    display: grid;
+
+    // border: 1px solid #ddd;
+    // padding: 1rem;
+    // border-radius: 1rem;
 }
 
 //