Minor polish

This commit is contained in:
johnqiao 2023-11-17 17:58:56 -07:00
parent ddf64ba12b
commit 1a5b2dc36a
2 changed files with 61 additions and 41 deletions

View File

@ -206,21 +206,21 @@ export class ShareDialogChooser extends ComfyDialog {
key: "openart",
textContent: "OpenArt AI",
website: "https://openart.ai/workflows/",
description: "Best place to share your workflow and art.",
description: "Share ComfyUI workflows and art on OpenArt.ai",
onclick: handleShowOpenArtShareDialog
},
{
key: "matrix",
textContent: "Matrix Server",
website: "https://app.element.io/#/room/%23comfyui_space%3Amatrix.org",
description: "Share your art on the official ComfyUI matrix server.",
description: "Share your art on the official ComfyUI matrix server",
onclick: handleShowShareDialog
},
{
key: "comfyworkflows",
textContent: "ComfyWorkflows",
website: "https://comfyworkflows.com",
description: "Share ComfyUI art: Download & drop any image into ComfyUI to load its workflow.",
description: "Share ComfyUI art on comfyworkflows.com",
onclick: handleShowShareDialog
},
];
@ -262,9 +262,8 @@ export class ShareDialogChooser extends ComfyDialog {
const description = $el("p", {
textContent: b.description,
style: {
'text-align': 'center',
'text-align': 'left',
color: 'white',
'font-style': 'italic',
'font-size': '14px',
'margin-bottom': '10px',
},

View File

@ -68,7 +68,7 @@ export class OpenArtShareDialog extends ComfyDialog {
display: "block",
marginBottom: "15px",
fontWeight: "bold",
fontSize: "20px",
fontSize: "14px",
};
const labelStyle = {
@ -135,18 +135,37 @@ export class OpenArtShareDialog extends ComfyDialog {
},
});
// LinkSection
this.communityLink = $el("a", {
style: hyperLinkStyle,
href: DEFAULT_HOMEPAGE_URL,
target: "_blank"
}, ["👉 Check out thousands of workflows shared from the community"])
this.getAPIKeyLink = $el("a", {
style: {
...hyperLinkStyle,
color: "#59E8C6"
},
href: DEFAULT_HOMEPAGE_URL,
target: "_blank"
}, ["👉 Get your API key here"])
const LinkSection = $el(
"div",
{
style: {
marginTop: "10px",
display: "flex",
flexDirection: "column",
},
},
[
this.communityLink,
this.getAPIKeyLink,
]
);
// Account Section
const AccountSection = $el("div", { style: sectionStyle }, [
$el(
"a",
{ style: hyperLinkStyle, href: DEFAULT_HOMEPAGE_URL, target: "_blank" },
["Check out 1000+ workflows others have uploaded."]
),
$el(
"a",
{ style: hyperLinkStyle, href: DEFAULT_HOMEPAGE_URL, target: "_blank" },
["You can get API key at here."]
),
$el("label", { style: labelStyle }, ["OpenArt API Key"]),
this.keyInput,
]);
@ -161,6 +180,20 @@ export class OpenArtShareDialog extends ComfyDialog {
this.descriptionInput,
]);
// Message Section
this.message = $el(
"div",
{
style: {
color: "#ff3d00",
textAlign: "center",
padding: "10px",
fontSize: "20px",
},
},
[]
);
this.shareButton = $el("button", {
type: "submit",
textContent: "Share",
@ -197,21 +230,9 @@ export class OpenArtShareDialog extends ComfyDialog {
]
);
// Message Section
this.message = $el(
"div",
{
style: {
color: "#ff3d00",
textAlign: "center",
padding: "10px",
fontSize: "20px",
},
},
[]
);
// Composing the full layout
const layout = [
LinkSection,
AccountSection,
additionalInputsSection,
this.message,