diff --git a/ComfyUI_vibe/public/assets/card_images/228616f4-12ad-426d-84fb-f20e488ba7ee.webp b/ComfyUI_vibe/public/assets/card_images/228616f4-12ad-426d-84fb-f20e488ba7ee.webp new file mode 100644 index 000000000..d7ed1ee4d Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/228616f4-12ad-426d-84fb-f20e488ba7ee.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/2690a78c-c210-4a52-8c37-3cb5bc4d9e71.webp b/ComfyUI_vibe/public/assets/card_images/2690a78c-c210-4a52-8c37-3cb5bc4d9e71.webp new file mode 100644 index 000000000..caf780709 Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/2690a78c-c210-4a52-8c37-3cb5bc4d9e71.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/28e9f7ea-ef00-48e8-849d-8752a34939c7.webp b/ComfyUI_vibe/public/assets/card_images/28e9f7ea-ef00-48e8-849d-8752a34939c7.webp new file mode 100644 index 000000000..2bb8b6c8d Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/28e9f7ea-ef00-48e8-849d-8752a34939c7.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/683255d3-1d10-43d9-a6ff-ef142061e88a.webp b/ComfyUI_vibe/public/assets/card_images/683255d3-1d10-43d9-a6ff-ef142061e88a.webp new file mode 100644 index 000000000..1a50a2b42 Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/683255d3-1d10-43d9-a6ff-ef142061e88a.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/91f1f589-ddb4-4c4f-b3a7-ba30fc271987.webp b/ComfyUI_vibe/public/assets/card_images/91f1f589-ddb4-4c4f-b3a7-ba30fc271987.webp new file mode 100644 index 000000000..8631c0d3b Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/91f1f589-ddb4-4c4f-b3a7-ba30fc271987.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/bacb46ea-7e63-4f19-a253-daf41461e98f.webp b/ComfyUI_vibe/public/assets/card_images/bacb46ea-7e63-4f19-a253-daf41461e98f.webp new file mode 100644 index 000000000..9ad1051c4 Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/bacb46ea-7e63-4f19-a253-daf41461e98f.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/can-you-rate-my-comfyui-workflow-v0-o9clchhji39c1.webp b/ComfyUI_vibe/public/assets/card_images/can-you-rate-my-comfyui-workflow-v0-o9clchhji39c1.webp new file mode 100644 index 000000000..99be19e5b Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/can-you-rate-my-comfyui-workflow-v0-o9clchhji39c1.webp differ diff --git a/ComfyUI_vibe/public/assets/card_images/comfyui_workflow.jpg b/ComfyUI_vibe/public/assets/card_images/comfyui_workflow.jpg new file mode 100644 index 000000000..06d66eecf Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/comfyui_workflow.jpg differ diff --git a/ComfyUI_vibe/public/assets/card_images/dda28581-37c8-44da-8822-57d1ccc2118c_2130x1658.png b/ComfyUI_vibe/public/assets/card_images/dda28581-37c8-44da-8822-57d1ccc2118c_2130x1658.png new file mode 100644 index 000000000..88b1ff098 Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/dda28581-37c8-44da-8822-57d1ccc2118c_2130x1658.png differ diff --git a/ComfyUI_vibe/public/assets/card_images/workflow_01.webp b/ComfyUI_vibe/public/assets/card_images/workflow_01.webp new file mode 100644 index 000000000..16dfa873b Binary files /dev/null and b/ComfyUI_vibe/public/assets/card_images/workflow_01.webp differ diff --git a/ComfyUI_vibe/public/comfy-logo-blue.svg b/ComfyUI_vibe/public/comfy-logo-blue.svg new file mode 100644 index 000000000..cb178bd31 --- /dev/null +++ b/ComfyUI_vibe/public/comfy-logo-blue.svg @@ -0,0 +1,146 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/ComfyUI_vibe/public/comfy-logo-yellow.svg b/ComfyUI_vibe/public/comfy-logo-yellow.svg new file mode 100644 index 000000000..1d6610fff --- /dev/null +++ b/ComfyUI_vibe/public/comfy-logo-yellow.svg @@ -0,0 +1,146 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/ComfyUI_vibe/public/thumbnails/asset-1.jpg b/ComfyUI_vibe/public/thumbnails/asset-1.jpg new file mode 100644 index 000000000..e9ea08e40 Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/asset-1.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/asset-2.jpg b/ComfyUI_vibe/public/thumbnails/asset-2.jpg new file mode 100644 index 000000000..2d9d396e5 Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/asset-2.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/canvas-1.jpg b/ComfyUI_vibe/public/thumbnails/canvas-1.jpg new file mode 100644 index 000000000..209ba5200 Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/canvas-1.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/canvas-2.jpg b/ComfyUI_vibe/public/thumbnails/canvas-2.jpg new file mode 100644 index 000000000..f7bed8cfb Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/canvas-2.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/project-1.jpg b/ComfyUI_vibe/public/thumbnails/project-1.jpg new file mode 100644 index 000000000..a4bf9217b Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/project-1.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/project-2.jpg b/ComfyUI_vibe/public/thumbnails/project-2.jpg new file mode 100644 index 000000000..8c9f4acd4 Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/project-2.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/workflow-1.jpg b/ComfyUI_vibe/public/thumbnails/workflow-1.jpg new file mode 100644 index 000000000..301aec003 Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/workflow-1.jpg differ diff --git a/ComfyUI_vibe/public/thumbnails/workflow-2.jpg b/ComfyUI_vibe/public/thumbnails/workflow-2.jpg new file mode 100644 index 000000000..d574fe7f7 Binary files /dev/null and b/ComfyUI_vibe/public/thumbnails/workflow-2.jpg differ diff --git a/ComfyUI_vibe/src/assets/css/main.css b/ComfyUI_vibe/src/assets/css/main.css index 7d2932883..848f19f91 100644 --- a/ComfyUI_vibe/src/assets/css/main.css +++ b/ComfyUI_vibe/src/assets/css/main.css @@ -337,3 +337,15 @@ body { --p-tooltip-background: #18181b; --p-tooltip-color: #fafafa; } + +/* ===================== PrimeVue Popover Overrides ===================== */ +@layer primevue { + .p-popover { + --p-popover-background: #18181b; + --p-popover-border-color: #3f3f46; + --p-popover-border-radius: 0.5rem; + --p-popover-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1); + --p-popover-padding: 0; + --p-popover-content-padding: 0; + } +} diff --git a/ComfyUI_vibe/src/components.d.ts b/ComfyUI_vibe/src/components.d.ts index 247f7e18b..305898cc1 100644 --- a/ComfyUI_vibe/src/components.d.ts +++ b/ComfyUI_vibe/src/components.d.ts @@ -63,7 +63,9 @@ declare module 'vue' { WidgetText: typeof import('./components/v2/nodes/widgets/WidgetText.vue')['default'] WidgetToggle: typeof import('./components/v2/nodes/widgets/WidgetToggle.vue')['default'] WorkflowsTab: typeof import('./components/v2/workspace/WorkflowsTab.vue')['default'] + WorkspaceCard: typeof import('./components/v2/workspace/WorkspaceCard.vue')['default'] WorkspaceEmptyState: typeof import('./components/v2/workspace/WorkspaceEmptyState.vue')['default'] + WorkspaceFilterSelect: typeof import('./components/v2/workspace/WorkspaceFilterSelect.vue')['default'] WorkspaceLayout: typeof import('./components/v2/layout/WorkspaceLayout.vue')['default'] WorkspaceSearchInput: typeof import('./components/v2/workspace/WorkspaceSearchInput.vue')['default'] WorkspaceSidebar: typeof import('./components/v2/layout/WorkspaceSidebar.vue')['default'] diff --git a/ComfyUI_vibe/src/components/v2/layout/WorkspaceSidebar.vue b/ComfyUI_vibe/src/components/v2/layout/WorkspaceSidebar.vue index ef6c127c9..042513611 100644 --- a/ComfyUI_vibe/src/components/v2/layout/WorkspaceSidebar.vue +++ b/ComfyUI_vibe/src/components/v2/layout/WorkspaceSidebar.vue @@ -1,9 +1,23 @@ + + diff --git a/ComfyUI_vibe/src/components/v2/workspace/WorkspaceFilterSelect.vue b/ComfyUI_vibe/src/components/v2/workspace/WorkspaceFilterSelect.vue new file mode 100644 index 000000000..b68648f97 --- /dev/null +++ b/ComfyUI_vibe/src/components/v2/workspace/WorkspaceFilterSelect.vue @@ -0,0 +1,30 @@ + + + diff --git a/ComfyUI_vibe/src/components/v2/workspace/index.ts b/ComfyUI_vibe/src/components/v2/workspace/index.ts index 16b068068..c46a919c8 100644 --- a/ComfyUI_vibe/src/components/v2/workspace/index.ts +++ b/ComfyUI_vibe/src/components/v2/workspace/index.ts @@ -3,4 +3,6 @@ export { default as WorkspaceEmptyState } from './WorkspaceEmptyState.vue' export { default as WorkspaceViewToggle } from './WorkspaceViewToggle.vue' export { default as WorkspaceSearchInput } from './WorkspaceSearchInput.vue' export { default as WorkspaceSortSelect } from './WorkspaceSortSelect.vue' +export { default as WorkspaceFilterSelect } from './WorkspaceFilterSelect.vue' +export { default as WorkspaceCard } from './WorkspaceCard.vue' export { default as CreateProjectDialog } from './CreateProjectDialog.vue' diff --git a/ComfyUI_vibe/src/main.ts b/ComfyUI_vibe/src/main.ts index 67a964453..1653ad217 100644 --- a/ComfyUI_vibe/src/main.ts +++ b/ComfyUI_vibe/src/main.ts @@ -47,6 +47,11 @@ const ComfyPreset = definePreset(Aura, { }, select: { borderRadius: '8px' + }, + popover: { + borderRadius: '8px', + shadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1)', + padding: '0' } } }) diff --git a/ComfyUI_vibe/src/router.ts b/ComfyUI_vibe/src/router.ts index 3c4de070c..024ddf213 100644 --- a/ComfyUI_vibe/src/router.ts +++ b/ComfyUI_vibe/src/router.ts @@ -54,6 +54,11 @@ const v2Routes: RouteRecordRaw[] = [ name: 'workspace-recents', component: () => import('./views/v2/workspace/RecentsView.vue') }, + { + path: 'templates', + name: 'workspace-templates', + component: () => import('./views/v2/workspace/TemplatesView.vue') + }, { path: 'trash', name: 'workspace-trash', diff --git a/ComfyUI_vibe/src/views/v2/workspace/AssetsView.vue b/ComfyUI_vibe/src/views/v2/workspace/AssetsView.vue index 948235d52..79e7cc906 100644 --- a/ComfyUI_vibe/src/views/v2/workspace/AssetsView.vue +++ b/ComfyUI_vibe/src/views/v2/workspace/AssetsView.vue @@ -1,13 +1,14 @@ @@ -89,33 +90,31 @@ const starterTemplates = [

Start from a template

-
+ +
+ + + 803+ workflows, models, nodes by Comfy & community + +
diff --git a/ComfyUI_vibe/src/views/v2/workspace/ProjectsView.vue b/ComfyUI_vibe/src/views/v2/workspace/ProjectsView.vue index a6383ba65..67e4667a9 100644 --- a/ComfyUI_vibe/src/views/v2/workspace/ProjectsView.vue +++ b/ComfyUI_vibe/src/views/v2/workspace/ProjectsView.vue @@ -8,6 +8,7 @@ import { WorkspaceSearchInput, WorkspaceSortSelect, CreateProjectDialog, + WorkspaceCard, } from '@/components/v2/workspace' const route = useRoute() @@ -31,10 +32,10 @@ const sortOptions = [ // Projects data const projects = ref([ - { id: 'img-gen', name: 'Image Generation', description: 'AI image generation workflows', canvasCount: 5, modelCount: 12, updatedAt: '2 hours ago', updatedTimestamp: Date.now() - 2 * 60 * 60 * 1000 }, - { id: 'video-proc', name: 'Video Processing', description: 'Video enhancement and editing', canvasCount: 3, modelCount: 8, updatedAt: '1 day ago', updatedTimestamp: Date.now() - 24 * 60 * 60 * 1000 }, - { id: 'audio-enh', name: 'Audio Enhancement', description: 'Audio processing pipelines', canvasCount: 2, modelCount: 4, updatedAt: '3 days ago', updatedTimestamp: Date.now() - 3 * 24 * 60 * 60 * 1000 }, - { id: 'upscale', name: 'Upscaling', description: 'Image and video upscaling', canvasCount: 4, modelCount: 6, updatedAt: '1 week ago', updatedTimestamp: Date.now() - 7 * 24 * 60 * 60 * 1000 } + { id: 'img-gen', name: 'Image Generation', description: 'AI image generation workflows', canvasCount: 5, modelCount: 12, updatedAt: '2 hours ago', updatedTimestamp: Date.now() - 2 * 60 * 60 * 1000, thumbnail: '/thumbnails/project-1.jpg' }, + { id: 'video-proc', name: 'Video Processing', description: 'Video enhancement and editing', canvasCount: 3, modelCount: 8, updatedAt: '1 day ago', updatedTimestamp: Date.now() - 24 * 60 * 60 * 1000, thumbnail: '/thumbnails/project-2.jpg' }, + { id: 'audio-enh', name: 'Audio Enhancement', description: 'Audio processing pipelines', canvasCount: 2, modelCount: 4, updatedAt: '3 days ago', updatedTimestamp: Date.now() - 3 * 24 * 60 * 60 * 1000, thumbnail: '/assets/card_images/28e9f7ea-ef00-48e8-849d-8752a34939c7.webp' }, + { id: 'upscale', name: 'Upscaling', description: 'Image and video upscaling', canvasCount: 4, modelCount: 6, updatedAt: '1 week ago', updatedTimestamp: Date.now() - 7 * 24 * 60 * 60 * 1000, thumbnail: '/assets/card_images/comfyui_workflow.jpg' } ]) // Create dialog @@ -125,42 +126,19 @@ const emptyStateDescription = computed(() => v-else-if="viewMode === 'grid'" class="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5" > -
-
-
-
- -
- -
-
-

{{ project.name }}

-

- {{ project.description }} -

-
- - - {{ project.canvasCount }} - - - - {{ project.modelCount }} - -
-
-
-
+ />
diff --git a/ComfyUI_vibe/src/views/v2/workspace/RecentsView.vue b/ComfyUI_vibe/src/views/v2/workspace/RecentsView.vue index 842381b2a..59c718a12 100644 --- a/ComfyUI_vibe/src/views/v2/workspace/RecentsView.vue +++ b/ComfyUI_vibe/src/views/v2/workspace/RecentsView.vue @@ -1,6 +1,15 @@ diff --git a/ComfyUI_vibe/src/views/v2/workspace/SettingsView.vue b/ComfyUI_vibe/src/views/v2/workspace/SettingsView.vue index 0b013be68..b0c5f18bb 100644 --- a/ComfyUI_vibe/src/views/v2/workspace/SettingsView.vue +++ b/ComfyUI_vibe/src/views/v2/workspace/SettingsView.vue @@ -46,29 +46,28 @@ const sections = computed(() => {

-
- -
diff --git a/ComfyUI_vibe/src/views/v2/workspace/TemplatesView.vue b/ComfyUI_vibe/src/views/v2/workspace/TemplatesView.vue new file mode 100644 index 000000000..9ca39875c --- /dev/null +++ b/ComfyUI_vibe/src/views/v2/workspace/TemplatesView.vue @@ -0,0 +1,180 @@ + + + diff --git a/ComfyUI_vibe/src/views/v2/workspace/WorkflowsView.vue b/ComfyUI_vibe/src/views/v2/workspace/WorkflowsView.vue index 4ba0bb38a..93bb167a6 100644 --- a/ComfyUI_vibe/src/views/v2/workspace/WorkflowsView.vue +++ b/ComfyUI_vibe/src/views/v2/workspace/WorkflowsView.vue @@ -1,6 +1,7 @@