New Menu & Workflow Management (#3112)

* menu

* wip

* wip

* wip

* wip

* wip

* workflow saving/loading

* Support inserting workflows
Move buttosn to top of lists

* fix session storage
implement renaming

* temp

* refactor, better workflow instance management

* wip

* progress on progress

* added send to workflow
various fixes

* Support multiple image loaders

* Support dynamic size breakpoints based on content

* various fixes
add close unsaved warning

* Add filtering tree

* prevent renaming unsaved

* fix zindex on hover

* fix top offset

* use filename as workflow name

* resize on setting change

* hide element until it is drawn

* remove glow

* Fix export name

* Fix test, revert accidental changes to groupNode

* Fix colors on all themes

* show hover items on smaller screen (mobile)

* remove debugging code

* dialog fix

* Dont reorder open workflows
Allow elements around canvas

* Toggle body display on setting change

* Fix menu disappearing on chrome

* Increase delay when typing, remove margin on Safari, fix dialog location

* Fix overflow issue on iOS

* Add reset view button
Prevent view changes causing history entries

* Bottom menu wip

* Various fixes

* Fix merge

* Fix breaking old menu position

* Fix merge adding restore view to loadGraphData
This commit is contained in:
pythongosssss
2024-06-25 11:49:25 +01:00
committed by GitHub
parent eab211bb1e
commit 90aebb6c86
35 changed files with 3986 additions and 312 deletions

View File

@@ -1,3 +1,5 @@
@import url("scripts/ui/menu/menu.css");
:root {
--fg-color: #000;
--bg-color: #fff;
@@ -10,12 +12,24 @@
--border-color: #4e4e4e;
--tr-even-bg-color: #222;
--tr-odd-bg-color: #353535;
--primary-bg: #236692;
--primary-fg: #ffffff;
--primary-hover-bg: #3485bb;
--primary-hover-fg: #ffffff;
--content-bg: #e0e0e0;
--content-fg: #000;
--content-hover-bg: #adadad;
--content-hover-fg: #000;
}
@media (prefers-color-scheme: dark) {
:root {
--fg-color: #fff;
--bg-color: #202020;
--content-bg: #4e4e4e;
--content-fg: #fff;
--content-hover-bg: #222;
--content-hover-fg: #fff;
}
}
@@ -26,11 +40,41 @@ body {
overflow: hidden;
background-color: var(--bg-color);
color: var(--fg-color);
grid-template-columns: auto 1fr auto;
grid-template-rows: auto auto 1fr auto;
min-height: -webkit-fill-available;
max-height: -webkit-fill-available;
min-width: -webkit-fill-available;
max-width: -webkit-fill-available;
}
.comfyui-body-top {
order: 0;
grid-column: 1/-1;
z-index: 10;
}
.comfyui-body-left {
order: 1;
z-index: 10;
}
#graph-canvas {
width: 100%;
height: 100%;
order: 2;
grid-column: 1/-1;
}
.comfyui-body-right {
order: 3;
z-index: 10;
}
.comfyui-body-bottom {
order: 4;
grid-column: 1/-1;
z-index: 10;
}
.comfy-multiline-input {
@@ -364,6 +408,37 @@ dialog::backdrop {
background: rgba(0, 0, 0, 0.5);
}
.comfy-dialog.comfyui-dialog {
top: 0;
}
.comfy-dialog.comfy-modal {
font-family: Arial, sans-serif;
border-color: var(--bg-color);
box-shadow: none;
border: 2px solid var(--border-color);
}
.comfy-dialog .comfy-modal-content {
flex-direction: row;
flex-wrap: wrap;
gap: 10px;
color: var(--fg-color);
}
.comfy-dialog .comfy-modal-content h3 {
margin-top: 0;
}
.comfy-dialog .comfy-modal-content > p {
width: 100%;
}
.comfy-dialog .comfy-modal-content > .comfyui-button {
flex: 1;
justify-content: center;
}
#comfy-settings-dialog {
padding: 0;
width: 41rem;