Image upload widget
This commit is contained in:
@@ -78,7 +78,7 @@
|
||||
<div class="animation-wrapper"
|
||||
class:hidden={hidden}
|
||||
animate:flip={{duration:flipDurationMs}}
|
||||
style={item?.attrs?.flexGrow ? `flex-grow: ${item.attrs.flexGrow}` : ""}
|
||||
style={item?.attrs?.style || ""}
|
||||
>
|
||||
<WidgetContainer dragItem={item} zIndex={zIndex+1} {isMobile} />
|
||||
{#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
|
||||
@@ -183,6 +183,7 @@
|
||||
.animation-wrapper {
|
||||
position: relative;
|
||||
flex-grow: 100;
|
||||
flex-basis: 0;
|
||||
}
|
||||
|
||||
.handle-widget:hover {
|
||||
|
||||
@@ -80,7 +80,7 @@
|
||||
<div class="animation-wrapper"
|
||||
class:hidden={hidden}
|
||||
animate:flip={{duration:flipDurationMs}}
|
||||
style={item?.attrs?.flexGrow ? `flex-grow: ${item.attrs.flexGrow}` : ""}
|
||||
style={item?.attrs?.style || ""}
|
||||
>
|
||||
<WidgetContainer dragItem={item} zIndex={zIndex+1} {isMobile} />
|
||||
{#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}
|
||||
@@ -238,6 +238,7 @@
|
||||
.animation-wrapper {
|
||||
position: relative;
|
||||
flex-grow: 100;
|
||||
flex-basis: 0;
|
||||
}
|
||||
|
||||
.handle-hidden {
|
||||
|
||||
@@ -715,7 +715,8 @@ export default class ComfyApp {
|
||||
comfyInput.config.values = def["input"]["required"][comfyInput.name][0];
|
||||
const inputNode = node.getInputNode(index)
|
||||
|
||||
if (inputNode && "doAutoConfig" in inputNode) {
|
||||
if (inputNode && "doAutoConfig" in inputNode && comfyInput.widgetNodeType === inputNode.type) {
|
||||
console.debug("[ComfyApp] Reconfiguring combo widget", inputNode.type, comfyInput.config.values)
|
||||
const comfyComboNode = inputNode as nodes.ComfyComboNode;
|
||||
comfyComboNode.doAutoConfig(comfyInput)
|
||||
if (!comfyInput.config.values.includes(get(comfyComboNode.value))) {
|
||||
|
||||
@@ -92,7 +92,7 @@
|
||||
<div class="animation-wrapper"
|
||||
class:hidden={hidden}
|
||||
animate:flip={{duration:flipDurationMs}}
|
||||
style={item?.attrs?.flexGrow ? `flex-grow: ${item.attrs.flexGrow}` : ""}>
|
||||
style={item?.attrs?.style || ""}>
|
||||
<Block>
|
||||
<label for={String(item.id)}>
|
||||
<BlockTitle><strong>Tab {i+1}:</strong> {tabName}</BlockTitle>
|
||||
@@ -198,6 +198,7 @@
|
||||
.animation-wrapper {
|
||||
position: relative;
|
||||
flex-grow: 100;
|
||||
flex-basis: 0;
|
||||
}
|
||||
|
||||
.handle-widget:hover {
|
||||
|
||||
38
src/lib/components/gradio/app/UploadText.svelte
Normal file
38
src/lib/components/gradio/app/UploadText.svelte
Normal file
@@ -0,0 +1,38 @@
|
||||
<script lang="ts">
|
||||
export let type: "video" | "image" | "audio" | "file" | "csv" = "file";
|
||||
|
||||
const defs = {
|
||||
image: "interface.drop_image",
|
||||
video: "interface.drop_video",
|
||||
audio: "interface.drop_audio",
|
||||
file: "interface.drop_file",
|
||||
csv: "interface.drop_csv"
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="wrap">
|
||||
{"Drop Image here"}
|
||||
<span class="or">- {"or"} -</span>
|
||||
{"Click to Upload"}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
min-height: var(--size-60);
|
||||
color: var(--block-label-text-color);
|
||||
line-height: var(--line-md);
|
||||
}
|
||||
|
||||
.or {
|
||||
color: var(--body-text-color-subdued);
|
||||
}
|
||||
|
||||
@media (--screen-md) {
|
||||
.wrap {
|
||||
font-size: var(--text-lg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user