Upload folder via script

velai/static/css/velai.css

@@ -14,4 +14,72 @@
 
 .vue-flow__resize-control.line {
     border-color: transparent !important;
+}
+
+/* LoRA dialog — match canvas graphite grey (#1c1d20), fit without scroll */
+.velai-lora-dialog {
+    background: #1c1d20 !important;
+    color: #e5e7eb !important;
+    border: 1px solid #3c3e43;
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.55);
+    max-height: min(92vh, 720px) !important;
+    overflow: hidden !important;
+    padding: 12px 16px !important;
+}
+
+.velai-lora-dialog .q-card__section,
+.velai-lora-dialog > .q-card__section--vert {
+    padding: 0;
+}
+
+.velai-lora-train-body {
+    max-height: calc(min(92vh, 720px) - 96px);
+    overflow: hidden;
+}
+
+.velai-lora-upload .q-uploader__list {
+    max-height: 48px;
+    overflow: hidden;
+}
+
+.velai-lora-dialog .q-tab-panels,
+.velai-lora-dialog .q-tab-panel {
+    background: transparent !important;
+    color: inherit;
+}
+
+.velai-lora-dialog .q-tabs {
+    background: transparent;
+}
+
+.velai-lora-dialog .q-tab {
+    color: #9ca3af;
+}
+
+.velai-lora-dialog .q-tab--active {
+    color: #e5e7eb;
+}
+
+.velai-lora-dialog .q-field__control,
+.velai-lora-dialog .q-field__native,
+.velai-lora-dialog .q-field__label {
+    color: #e5e7eb;
+}
+
+.velai-lora-dialog .q-uploader {
+    background: #2b2c2f;
+    color: #e5e7eb;
+    border: 1px solid #3c3e43;
+}
+
+.velai-lora-log {
+    background: #232427 !important;
+    color: #e5e7eb !important;
+    border: 1px solid #3c3e43;
+}
+
+.velai-lora-entry {
+    background: #2b2c2f !important;
+    color: #e5e7eb !important;
+    border: 1px solid #3c3e43;
 }

velai/ui/training.py

@@ -22,74 +22,57 @@ class TrainingDialog:
         self.zip_name: str = ""
         self.uploaded_files: List[tuple[str, bytes]] = []
         self.is_ready_to_train = False
-        self._advanced_open = False
         self.on_library_changed = on_library_changed
 
         self.dialog = ui.dialog().props("persistent")
 
-        with self.dialog, ui.card().classes("w-[680px] max-w-[95vw]"):
-            with ui.row().classes("w-full items-center justify-between"):
+        with self.dialog, ui.card().classes("w-[720px] max-w-[95vw] velai-lora-dialog"):
+            with ui.row().classes("w-full items-center justify-between mb-1"):
                 with ui.column().classes("gap-0"):
-                    ui.label("Train / Manage LoRA").classes("text-xl font-bold")
-                    ui.label("Krea 2 Trainer").classes("text-sm text-gray-500")
+                    ui.label("Train / Manage LoRA").classes("text-lg font-bold")
+                    ui.label("Krea 2 Trainer").classes("text-xs text-gray-400")
                 ui.button(icon="close", on_click=self.dialog.close).props("flat round dense")
 
             with ui.tabs().classes("w-full") as tabs:
                 train_tab = ui.tab("Train")
                 library_tab = ui.tab("My LoRAs")
 
-            with ui.tab_panels(tabs, value=train_tab).classes("w-full"):
-                with ui.tab_panel(train_tab):
+            with ui.tab_panels(tabs, value=train_tab).classes("w-full bg-transparent"):
+                with ui.tab_panel(train_tab).classes("p-0"):
                     self._build_train_tab()
-                with ui.tab_panel(library_tab):
+                with ui.tab_panel(library_tab).classes("p-0"):
                     self._build_library_tab()
 
     def _build_train_tab(self) -> None:
-        ui.label("1. Upload dataset (.zip)").classes("font-bold mt-2")
-        ui.label(
-            f"Zip of PNG/JPG/WebP images. Optional same-stem .txt captions "
-            f"(e.g. 001.jpg + 001.txt). Max {MAX_DATASET_ZIP_MB} MB "
-            f"(fal accepts larger archives; we cap uploads here for reliability)."
-        ).classes("text-xs text-gray-500 mb-2")
-
-        self.upload = (
-            ui.upload(
-                label="Upload zip",
-                auto_upload=True,
-                on_upload=self.handle_upload,
-                multiple=False,
-            )
-            .props("accept=.zip,application/zip")
-            .classes("w-full")
-        )
-
-        self.file_list_label = ui.label("No zip uploaded yet").classes("text-xs text-gray-500 mt-1")
-
-        ui.label("2. Configuration").classes("font-bold mt-4")
-        with ui.grid(columns=2).classes("w-full gap-4"):
-            self.lora_name = ui.input("LoRA name", value="My Krea LoRA").classes("w-full")
-            self.steps = ui.select(
-                {1000: "1000 steps (default)", 2000: "2000 steps"},
-                value=1000,
-                label="Training steps",
-            ).classes("w-full")
-            self.trigger_phrase = ui.input(
-                "Trigger phrase",
-                placeholder="e.g. ohwx person",
-            ).classes("w-full col-span-2")
+        with ui.column().classes("w-full gap-2 velai-lora-train-body"):
             ui.label(
-                "Required if images have no .txt captions and auto-captioning is Off."
-            ).classes("text-xs text-gray-500 col-span-2")
-
-        with ui.expansion("Advanced options", icon="tune").classes("w-full mt-2") as advanced:
-            advanced.bind_value(self, "_advanced_open")
-            with ui.grid(columns=2).classes("w-full gap-4"):
-                self.learning_rate = ui.number("Learning rate", value=0.0005, format="%.5f", min=0.00001, max=0.01)
-                self.resolution = ui.select(
-                    {768: "768", 1024: "1024"},
-                    value=768,
-                    label="Resolution",
+                f"Dataset zip (PNG/JPG/WebP, optional .txt captions). Max {MAX_DATASET_ZIP_MB} MB."
+            ).classes("text-xs text-gray-400")
+
+            self.upload = (
+                ui.upload(
+                    label="Upload zip",
+                    auto_upload=True,
+                    on_upload=self.handle_upload,
+                    multiple=False,
                 )
+                .props("accept=.zip,application/zip dense")
+                .classes("w-full velai-lora-upload")
+            )
+            self.file_list_label = ui.label("No zip uploaded yet").classes("text-xs text-gray-400")
+
+            with ui.grid(columns=2).classes("w-full gap-x-3 gap-y-2"):
+                self.lora_name = ui.input("LoRA name", value="My LoRA").classes("w-full").props("dense")
+                with ui.column().classes("w-full gap-0 justify-end"):
+                    self.steps_label = ui.label("Training steps: 1000").classes("text-xs")
+                    self.steps = ui.slider(min=1000, max=2000, step=1000, value=1000).props("w-full")
+                    self.steps.on_value_change(
+                        lambda e: setattr(self.steps_label, "text", f"Training steps: {int(e.value)}")
+                    )
+                self.trigger_phrase = ui.input(
+                    "Trigger phrase",
+                    placeholder="e.g. ohwx person",
+                ).classes("w-full").props("dense")
                 self.auto_captioning = ui.select(
                     {
                         "Off": "Off",
@@ -99,29 +82,43 @@ class TrainingDialog:
                     },
                     value="Off",
                     label="Auto captioning",
-                ).classes("col-span-2")
+                ).classes("w-full").props("dense")
+                self.learning_rate = (
+                    ui.number("Learning rate", value=0.0005, format="%.5f", min=0.00001, max=0.01)
+                    .classes("w-full")
+                    .props("dense")
+                )
+                self.resolution = ui.select(
+                    {768: "768", 1024: "1024"},
+                    value=768,
+                    label="Resolution",
+                ).classes("w-full").props("dense")
 
-        self.train_button = ui.button("Start Training", on_click=self.start_training).classes("w-full mt-6")
-        self.train_button.bind_enabled_from(self, "is_ready_to_train")
+            ui.label(
+                "Trigger phrase required if images have no .txt captions and auto-captioning is Off."
+            ).classes("text-xs text-gray-400")
 
-        ui.label("3. Progress & logs").classes("font-bold mt-4")
-        self.log = ui.log().classes("w-full h-48 bg-gray-100 p-2 rounded text-xs font-mono")
+            self.train_button = ui.button("Start Training", on_click=self.start_training).classes("w-full")
+            self.train_button.bind_enabled_from(self, "is_ready_to_train")
 
-        self.result_container = ui.column().classes("w-full mt-4")
-        self.result_container.set_visibility(False)
-        with self.result_container:
-            ui.label("Training complete — LoRA saved to your library.").classes(
-                "text-lg font-bold text-green-600"
-            )
-            with ui.row().classes("w-full gap-2"):
-                self.download_lora_btn = ui.button("Download LoRA", icon="download")
-                self.download_config_btn = ui.button("Download Config", icon="download")
+            ui.label("Progress").classes("text-xs font-bold")
+            self.log = ui.log().classes("w-full h-28 velai-lora-log p-2 rounded text-xs font-mono")
+
+            self.result_container = ui.column().classes("w-full gap-1")
+            self.result_container.set_visibility(False)
+            with self.result_container:
+                ui.label("Training complete — LoRA saved to your library.").classes(
+                    "text-sm font-bold text-green-400"
+                )
+                with ui.row().classes("w-full gap-2"):
+                    self.download_lora_btn = ui.button("Download LoRA", icon="download").props("dense")
+                    self.download_config_btn = ui.button("Download Config", icon="download").props("dense")
 
     def _build_library_tab(self) -> None:
-        ui.label("LoRAs linked to this browser session").classes("text-sm text-gray-500 mb-2")
+        ui.label("LoRAs linked to this browser session").classes("text-sm text-gray-400 mb-2")
         ui.label(
             "They persist across reloads via your session cookie. Upload a .safetensors file or train a new one."
-        ).classes("text-xs text-gray-500 mb-2")
+        ).classes("text-xs text-gray-400 mb-2")
 
         self.lora_upload = (
             ui.upload(
@@ -145,17 +142,17 @@ class TrainingDialog:
         entries = list_loras(self._user_storage())
         with self.library_container:
             if not entries:
-                ui.label("No LoRAs yet. Train one or upload weights.").classes("text-sm text-gray-500")
+                ui.label("No LoRAs yet. Train one or upload weights.").classes("text-sm text-gray-400")
                 return
             for entry in entries:
-                with ui.card().classes("w-full"):
+                with ui.card().classes("w-full velai-lora-entry"):
                     with ui.row().classes("w-full items-center justify-between"):
                         with ui.column().classes("gap-0"):
                             ui.label(entry.name).classes("font-bold")
                             meta = f"{entry.source} · {entry.created_at[:19]}"
                             if entry.trigger_phrase:
                                 meta += f" · trigger: {entry.trigger_phrase}"
-                            ui.label(meta).classes("text-xs text-gray-500")
+                            ui.label(meta).classes("text-xs text-gray-400")
                         with ui.row().classes("gap-1"):
                             ui.button(
                                 icon="download",
@@ -309,7 +306,7 @@ class TrainingDialog:
             original_name=lora_file.get("file_name") or "krea_lora.safetensors",
             mime_type="application/octet-stream",
         )
-        name = (self.lora_name.value or "My Krea LoRA").strip()
+        name = (self.lora_name.value or "My LoRA name").strip()
         add_lora(
             self._user_storage(),
             name=name,