Update app.py

app.py

@@ -179,6 +179,639 @@ def img2img(input_image, denoising, prompt, negative_prompt, model, steps, sampl
 
 css = """
 footer {visibility: hidden !important;}
+#container{
+
+margin: 0 auto;
+
+max-width: 40rem;
+
+}
+
+#intro{
+
+max-width: 100%;
+
+text-align: center;
+
+margin: 0 auto;
+
+}
+
+div.svelte-vt1mxs {
+
+display: flex;
+
+position: relative;
+
+flex-direction: column
+
+}
+
+div.svelte-vt1mxs>*,div.svelte-vt1mxs>.form > * {
+
+width: var(--size-full)
+
+}
+
+.gap.svelte-vt1mxs {
+
+gap: var(--layout-gap)
+
+}
+
+.hide.svelte-vt1mxs {
+
+display: none
+
+}
+
+.compact.svelte-vt1mxs>*,.compact.svelte-vt1mxs .box {
+
+border-radius: 0
+
+}
+
+.compact.svelte-vt1mxs,.panel.svelte-vt1mxs {
+
+border: solid var(--panel-border-width) var(--panel-border-color);
+
+border-radius: var(--container-radius);
+
+background: var(--panel-background-fill);
+
+padding: var(--spacing-lg)
+
+}
+
+div#component-24 {
+
+display: none;
+
+}
+
+div#component-8 {background: #00000024;border: 0;color: #ffffff;backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border-width: 0 !important;}
+
+span.md.svelte-9tftx4 {
+
+display: none;
+
+}
+
+.empty.svelte-lk9eg8.large.unpadded_box {
+
+background: none !important;
+
+}
+
+div#component-26 {
+
+display: none;
+
+}
+
+div#component-7 {
+
+background: none;
+
+}
+
+.wrap.default.full.svelte-119qaqt.hide {
+
+background: none !important;
+
+}
+
+.styler.svelte-iyf88w {
+
+background: none !important;
+
+}
+
+div#component-3 {
+
+background: none !important;
+
+border: 0;
+
+}
+
+input.scroll-hide.svelte-1f354aw {
+
+overflow: hidden !important;
+
+}
+
+div#component-5 {
+
+border-radius: 40px 0px 0px 40px;
+
+background: black !important;
+
+opacity: 0.9;
+
+}
+
+#component-6 {
+
+border-radius: 0px 40px 40px 0px;
+
+background: linear-gradient(358deg, #ff4d0080, #fff0);
+
+color: #ffffffe3;
+
+border: 2px #ffffffc2 dashed;
+
+border-left: 0;
+
+font-size: 30px;
+
+letter-spacing:-1px;
+
+position: relative;
+
+z-index: 1;
+
+backdrop-filter: blur(18px);
+
+-webkit-backdrop-filter: blur(18px);
+
+}
+
+div#component-0 {
+
+max-width: 100% !important;
+
+}
+
+.grid-wrap.svelte-1b19cri.fixed-height {
+
+max-height: 100% !important;
+
+overflow: auto;
+
+}
+
+footer.svelte-1ax1toq {
+
+display: none !important;
+
+}
+
+input.scroll-hide.svelte-1f354aw {
+
+font-size: 26px;
+
+padding: 25px;
+
+}
+
+div#component-4 {
+
+margin-top: 230px;
+
+margin-bottom: 30px;
+
+}
+
+gradio-app {
+
+background-color: transparent !important;
+
+background: url(https://vivawaves.com/wavesweaveslogo.svg) top center no-repeat !important;
+
+margin-top: 77px;
+
+}
+
+label.svelte-1f354aw {
+
+}
+
+.styler.svelte-iyf88w {
+
+}
+
+body {
+
+background: url(https://vivawaves.com/vivatodaybg2.jpg);
+
+background-size: cover;
+
+}
+
+img.svelte-1b19cri {}
+
+.preview.svelte-1b19cri {
+
+background: #0000004d !important;
+
+border-radius: 20px;
+
+padding: 20px;
+
+overflow: hidden;
+
+}
+
+button.svelte-1030q2h {
+
+border-radius: 100%;
+
+}
+
+div.svelte-1030q2h svg {
+
+}
+
+svg path {
+
+}
+
+img.svelte-1b19cri {
+
+border-radius: 10px;
+
+}
+
+.form.svelte-sfqy0y {
+
+background: #fff0;
+
+border-width: 0px;
+
+opacity: 0.8;
+
+}
+
+.gradio-container-3-44-2,.gradio-container-3-44-2 *,.gradio-container-3-44-2 :before,.gradio-container-3-44-2 :after {
+
+box-sizing: border-box;
+
+border-width: 0;
+
+border-style: solid;
+
+}
+
+div#component-13 {
+
+display: none;
+
+}
+
+footer.svelte-mpyp5e {
+
+display: none !important;
+
+}
+
+div#intro {
+
+display: none;
+
+}
+
+div.svelte-15lo0d8 {
+
+display: flex;
+
+flex-wrap: wrap;
+
+gap: 0;
+
+width: var(--size-full);
+
+flex-direction: initial;
+
+justify-content: center;
+
+align-items: baseline;
+
+}
+
+input.svelte-1f354aw.svelte-1f354aw, textarea.svelte-1f354aw.svelte-1f354aw {
+
+display: block;
+
+position: relative;
+
+outline: none !important;
+
+box-shadow: var(--input-shadow);
+
+background: var(--input-background-fill);
+
+padding: var(--input-padding);
+
+width: 100%;
+
+color: var(--body-text-color);
+
+font-weight: var(--input-text-weight);
+
+font-size: large;
+
+line-height: initial;
+
+border: none;
+
+text-size-adjust: auto;
+
+font-size: 23px !important;
+
+}
+
+div#component-24 {
+
+display: none;
+
+}
+
+div#component-8 {background: #00000024;border: 0;color: #ffffff;backdrop-filter: blur(20px);-webkit-backdrop-filter: blur(20px);border-width: 0 !important;}
+
+span.md.svelte-9tftx4 {
+
+display: none;
+
+}
+
+.empty.svelte-lk9eg8.large.unpadded_box {
+
+background: none !important;
+
+}
+
+div#component-26 {
+
+display: none;
+
+}
+
+div#component-7 {
+
+background: none;
+
+}
+
+.wrap.default.full.svelte-119qaqt.hide {
+
+background: none !important;
+
+}
+
+.styler.svelte-iyf88w {
+
+background: none !important;
+
+}
+
+div#component-3 {
+
+background: none !important;
+
+border: 0;
+
+}
+
+input.scroll-hide.svelte-1f354aw {
+
+overflow: hidden !important;
+
+}
+
+div#component-5 {
+
+border-radius: 40px;
+
+background: white !important;
+
+opacity: 0.9;
+
+}
+
+#component-6 {
+
+border-radius: 0px 40px 40px 0px;
+
+background: linear-gradient(358deg, #ff4d0080, #fff0);
+
+color: #ffffffe3;
+
+border: 2px #ffffffc2 dashed;
+
+border-left: 0;
+
+font-size: 30px;
+
+letter-spacing:-1px;
+
+position: relative;
+
+z-index: 1;
+
+backdrop-filter: blur(18px);
+
+-webkit-backdrop-filter: blur(18px);
+
+display: none;
+
+}
+
+div#component-0 {
+
+max-width: 100% !important;
+
+}
+
+.grid-wrap.svelte-1b19cri.fixed-height {
+
+max-height: 100% !important;
+
+overflow: auto;
+
+}
+
+footer.svelte-1ax1toq {
+
+display: none !important;
+
+}
+
+input.scroll-hide.svelte-1f354aw {
+
+font-size: 26px;
+
+padding: 25px;
+
+}
+
+div#component-4 {
+
+margin-top: 230px;
+
+margin-bottom: 30px;
+
+}
+
+gradio-app {
+
+background-color: transparent !important;
+
+background: url(https://vivawaves.com/wavesweaveslogo.svg) top center no-repeat !important;
+
+margin-top: 77px;
+
+}
+
+label.svelte-1f354aw {
+
+}
+
+.styler.svelte-iyf88w {
+
+}
+
+body {
+
+background: url(https://vivawaves.com/vivatodaybg2.jpg);
+
+background-size: cover;
+
+}
+
+img.svelte-1b19cri {}
+
+.preview.svelte-1b19cri {
+
+background: #0000004d !important;
+
+border-radius: 20px;
+
+padding: 20px;
+
+overflow: hidden;
+
+}
+
+button.svelte-1030q2h {
+
+border-radius: 100%;
+
+}
+
+div.svelte-1030q2h svg {
+
+}
+
+svg path {
+
+}
+
+img.svelte-1b19cri {
+
+border-radius: 10px;
+
+}
+
+.form.svelte-sfqy0y {
+
+background: #fff0;
+
+border-width: 0px;
+
+opacity: 0.8;
+
+}
+
+.gradio-container-3-44-2,.gradio-container-3-44-2 *,.gradio-container-3-44-2 :before,.gradio-container-3-44-2 :after {
+
+box-sizing: border-box;
+
+border-width: 0;
+
+border-style: solid;
+
+}
+
+div#component-13 {
+
+display: none;
+
+}
+
+footer.svelte-mpyp5e {
+
+display: none !important;
+
+}
+
+div#intro {
+
+display: none;
+
+}
+
+div.svelte-15lo0d8 {
+
+display: flex;
+
+flex-wrap: wrap;
+
+gap: 0 !important;
+
+width: var(--size-full);
+
+flex-direction: initial;
+
+justify-content: center;
+
+align-items: baseline;
+
+}
+
+input.svelte-1f354aw.svelte-1f354aw, textarea.svelte-1f354aw.svelte-1f354aw {
+
+display: block;
+
+position: relative;
+
+outline: none !important;
+
+box-shadow: var(--input-shadow);
+
+background: var(--input-background-fill);
+
+padding: var(--input-padding);
+
+width: 100%;
+
+color: var(--body-text-color);
+
+font-weight: var(--input-text-weight);
+
+font-size: large;
+
+line-height: initial;
+
+border: none;
+
+text-size-adjust: auto;
+
+font-size: 23px !important;
+
+border-radius: 30px;
+
+background: white !important;
+
+text-align: center;
+
+}
+
+div#component-8 {
+
+margin-bottom: 70px;
+
+}
 """
         
 with gr.Blocks(css=css) as demo: