Updates for mobile

src/lib/components/ComfyApp.svelte

@@ -22,6 +22,7 @@
  import ComfyUnlockUIButton from "./ComfyUnlockUIButton.svelte";
 	import ComfyGraphView from "./ComfyGraphView.svelte";
 	import { download } from "$lib/utils";
+	import notify from "$lib/notify";
 
  export let app: ComfyApp = undefined;
  let imageViewer: ImageViewer;
@@ -141,7 +142,7 @@
          return;
 
      app.saveStateToLocalStorage();
-     toast.push("Saved to local storage.")
+     notify("Saved to local storage.")
      //
      //      const date = new Date();
      //      const formattedDate = date.toISOString().replace(/:/g, '-').replace(/\.\d{3}/g, '').replace('T', '_').replace("Z", "");
@@ -165,7 +166,7 @@
 
  $: if ($uiState.uiUnlocked && !hasShownUIHelpToast) {
      hasShownUIHelpToast = true;
-     toast.push("Right-click to open context menu.")
+     notify("Right-click to open context menu.")
  }
 
  if (debugLayout) {

src/lib/components/ComfyApp.ts

@@ -28,6 +28,7 @@ import { ComfyBackendNode } from "$lib/nodes/ComfyBackendNode";
 import { get } from "svelte/store";
 import uiState from "$lib/stores/uiState";
 import { promptToGraphVis, workflowToGraphVis } from "$lib/utils";
+import notify from "$lib/notify";
 
 export const COMFYBOX_SERIAL_VERSION = 1;
 
@@ -601,11 +602,7 @@ export default class ComfyApp {
                     } catch (error) {
                         // this.ui.dialog.show(error.response || error.toString());
                         const mes = error.response || error.toString()
-                        toast.push(`Error queuing prompt:\n${mes}`, {
-                            theme: {
-                                '--toastBackground': 'var(--color-red-500)',
-                            }
-                        })
+                        notify(`Error queuing prompt:\n${mes}`, null, "error")
                         console.error(promptToGraphVis(p))
                         console.error("Error queuing prompt", mes, num, p)
                         break;
@@ -643,7 +640,7 @@ export default class ComfyApp {
                 }
                 else {
                     console.error("No metadata found in image file.", pngInfo)
-                    toast.push("No metadata found in image file.")
+                    notify("No metadata found in image file.")
                 }
             }
         } else if (file.type === "application/json" || file.name.endsWith(".json")) {

src/lib/components/ComfyQueue.svelte

@@ -1,15 +1,7 @@
 <script lang="ts">
  import queueState from "$lib/stores/queueState";
  import ProgressBar from "./ProgressBar.svelte";
-
- function getNodeInfo(nodeId: number): string {
-     let app = (window as any).app;
-     if (!app)
-         return String(nodeId);
-
-     const title = app.lGraph.getNodeById(nodeId)?.title || String(nodeId);
-     return title + " (" + nodeId + ")"
- }
+ import { getNodeInfo } from "$lib/utils"
 
  const entries = [
      {

src/lib/components/ProgressBar.svelte

@@ -23,15 +23,17 @@
 
 <style>
  .progress {
+     width: 100%;
+     height: 100%;
      text-align: center;
      background-color: lightgrey;
-     padding: 3px;
+     padding: 0px;
      position: relative;
  }
 
  .bar {
+     height: 100%;
      background-color: #B3D8A9;
-     height: 20px;
  }
 
  .label {