Merge pull request 'ui-fixups' (#3436) from hsjobeki/clan-core:ui-fixups into main

Reviewed-on: https://git.clan.lol/clan/clan-core/pulls/3436

pkgs/webview-ui/app/eslint.config.mjs

@@ -18,7 +18,7 @@ export default tseslint.config(
         },
       ],
       "tailwindcss/no-custom-classname": [
-        "warn",
+        "error",
         {
           callees: ["cx"],
           whitelist: ["material-icons"],

pkgs/webview-ui/app/src/components/Sidebar/css/sidebar.css

@@ -23,4 +23,8 @@
   /* background-color: rgba(var(--clr-bg-inv-3) / 0.9); */
   @apply bg-primary-800/90;
   border-radius: theme(borderRadius.md);
+
+  ::marker {
+    content: "";
+  }
 }

pkgs/webview-ui/app/src/routes/machines/avatar.tsx

@@ -10,11 +10,11 @@ export const MachineAvatar = (props: AvatarProps) => {
       <div class="">
         <div
           class={cx(
-            "rounded-lg border p-2 bg-def-1 border-def-3 size-36",
+            "rounded-lg border p-2 bg-def-1 border-def-3 h-fit",
             props.class,
           )}
         >
-          <RndThumbnail name={props.name || ""} />
+          <RndThumbnail name={props.name || ""} height={120} width={220} />
         </div>
       </div>
     </figure>

pkgs/webview-ui/app/src/routes/machines/create.tsx

@@ -73,16 +73,17 @@ export function CreateMachine() {
       <Header title="Create Machine" />
       <div class="flex w-full p-4">
         <div class="mt-4 w-full self-stretch px-2">
-          <Form onSubmit={handleSubmit} class="">
+          <Form onSubmit={handleSubmit} class="gap-2 flex flex-col">
             <Field
               name="opts.machine.name"
               validate={[required("This field is required")]}
             >
               {(field, props) => (
                 <>
-                  <div class="flex justify-center">
+                  <div class="flex justify-center mb-4 pb-4 border-b">
                     <MachineAvatar name={field.value} />
                   </div>
+
                   <TextInput
                     inputProps={props}
                     value={`${field.value}`}
@@ -105,31 +106,6 @@ export function CreateMachine() {
                 />
               )}
             </Field>
-            <Field name="opts.machine.tags" type="string[]">
-              {(field, props) => (
-                <div class="p-2">
-                  <DynForm
-                    initialValues={{ tags: ["all"] }}
-                    components={{
-                      before: <div>Tags</div>,
-                    }}
-                    schema={{
-                      type: "object",
-                      properties: {
-                        tags: {
-                          type: "array",
-                          items: {
-                            title: "Tag",
-                            type: "string",
-                          },
-                          uniqueItems: true,
-                        },
-                      },
-                    }}
-                  />
-                </div>
-              )}
-            </Field>
             <div class=" " tabindex="0">
               <input type="checkbox" />
               <div class="  font-medium ">Deployment Settings</div>