Hello everyone,
Do you know how to change the color around the fields or delete them? (See screenshot circled in pink)
It all depends on the background color. I find this gray color spoils everything.
If what you mean is changing the background color around the fields, I think there isn’t any support yet, but you still can do that, through a simple hacky solution:
description ... width = min(750px, 100%); background: #cd3838 // this is where the ; will be inserted negative ... width = ; background: #cd3838
Essentially you could insert any CSS after the
width
value (or just usewidth = ; <css>
without specifying the width as well), just omit the;
at the end because the t2i framework will append that after the value.Though, this way, upon testing on the regular AI image generator, it only works on the description and the negative prompt fields. But there’s another way, using some scripts. First, define a function in the list:
setupColors() => // some magic that make all of that work for (let el of [...document.querySelectorAll(".input-inner")]) { inputChild = el.querySelector(".input-wrapper *"); inputName = inputChild.dataset.name; if (Object.keys(colors).includes(inputName)) { el.style.backgroundColor = colors[inputName]; } }
And then put this at the bottom of the HTML panel:
<script> // Here you can define the colors of the fields that you can associate with the respective userInputs list names on the left let colors = { "artStyle": "#8b574d", "numImages": "#014765" // add more input names here if you want to } </script>[setupColors(), ""]
Thank you so much, you’ve really helped me. 👍 👍 👍
You’re welcome. Also, it’s a good idea to reply to somebody that have helped so they’ll get noticed.
Thank you so much for sharing this tip.
width = min(750px, 100%); background: #cd3838 works great.
But what do you mean by “First, define a function in the list”?
I have to put the last 2 codes on the bottom right? I did that but I didn’t succeed?
But what do you mean by “First, define a function in the list”?
What I mean is you put the
setupColors()
function in the list panel on the left side and then put the last one (the<script>
one) at the bottom HTML panel.