style.css

#title {
    font-size: 50px;
    font-weight: bolder;
    color: #031af0;
    text-align: center;
    font-family: Georgia, 'Times New Roman', Times, serif;
}

/* 版面最上面的大log图像*/
.gradio-container-3-47-1 .prose * {
    color: var(--body-text-color);
    display: block;
    margin: 0 auto; /*居中*/
    width: 100%; /* 使得图片宽度响应式地适应容器宽度 */
    height: auto; /* 保持图片的原始长宽比 */
    object-fit: contain;/* 保持图片的长宽比并使其完全适应容器 */
    /* box-shadow: 0 2px 20px rgba(0, 0, 0, 0.5) !important;
    border-radius: 20px; */
}

#show_box3 {
    border-style: solid;
    overflow: visible;
    min-width: min(0px, 100%);
    border-width: var(--block-border-width);
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #9900ff !important;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

/* 背景颜色设置白色/刷新button/markdown字体 */
.gap.svelte-vt1mxs {
    gap: var(--layout-gap);
    background: #fff;
    /* justify-content: center; */
}

#button_param {
    background: #0d02ea !important;
    color: white !important;
    border-radius: 3px !important;
}
/*刷新button1*/
#button_param1 {
    flex-grow: unset;
    flex-shrink: unset;
    flex-basis: unset;
    margin: auto;
    width: unset;
    padding: unset;
    box-shadow:unset;
}


/* 左侧输入图像显示框 */
#show_window_image {
    border-color: #9d9d9d !important;
    box-shadow: 0 3px 5px rgba(159, 159, 159, 0.5);
    align-items: center !important;
    height: 245px !important;
}

/* 左侧输入模板视频显示框 */
#show_window_video {
    border-color: #909090 !important;
    box-shadow: 0 3px 5px rgba(118, 118, 118, 0.5);
    align-items: center !important;
    height: 245px !important;
}


/* 左侧图像example列表/模板视频dataset列表/选择框边框蓝色 */
.gallery.svelte-13hsdno.svelte-13hsdno.svelte-13hsdno {
    display: flex;
    flex-wrap: wrap;
    gap: 0px !important;
    flex-direction: row;
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #c1c2c3 !important;
    width: 220px !important;
}

/* 右侧examples横向居中 */
.hide-container.svelte-90oupt {
    margin: 0;
    box-shadow: none;
    --block-border-width: 0;
    background: transparent;
    padding: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-content: space-around;
}

/* 单个图片examples缩略图 */
.gallery.svelte-gqt00k {
    border: 0px solid var(--border-color-primary);
    width: 70px;
    height: 80px;
}
/* 单个视频examples缩略图 */
.gallery.svelte-1tntsc1 {
    border: 0px solid var(--border-color-primary);
    /* max-height: var(--size-20); */
    /* object-fit: cover; */
    width: 70px;
    height: 95px;
}
/*tab宽度*/
.tab-nav.svelte-kqij2n {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--border-color-primary);
}

/* 图像example列表顶部的label条部分 */
.label.svelte-13hsdno.svelte-13hsdno.svelte-13hsdno {
    display: none !important;
    /*label隐藏*/
    align-items: center;
    margin-bottom: var(--size-2);
    color: var(--block-label-text-color);
    font-weight: var(--block-label-text-weight);
    font-size: var(--block-label-text-size);
    line-height: var(--line-sm);
}


/* pages */
.paginate.svelte-13hsdno.svelte-13hsdno.svelte-13hsdno {
    display: none !important;
    justify-content: center;
    align-items: center;
    gap: var(--spacing-sm);
    margin-top: var(--size-2);
    color: var(--block-label-text-color);
    font-size: var(--text-sm);
}



.gallery.svelte-gqt00k {
    /* border: 2px solid var(--border-color-primary); */
    /* max-height: var(--size-20); */
    object-fit: contain;
}


.gallery.svelte-1tntsc1 {
    /* max-height: var(--size-20); */
    object-fit: contain;
}

/* 左侧侧图片显示框边框蓝色 */
.flex.svelte-116rqfv {
    display: flex;
    justify-content: center;
    align-items: center;
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #b6b6b7 !important;
}

/* 右侧结果视频显示框 */
.show_window_result {
    border-color: #fbfbfd;
    box-shadow: 0 3px 5px rgba(252, 251, 252, 0.5);
    /* align-items: center !important; */
    /* height: 290.24px !important; */
    height: 240px !important;
    /* margin-top: 27px; */
    margin: 1px !important;
}

/* 最下面视频显示框 */
#show_box {
    border-style: solid;
    overflow: visible;
    min-width: min(0px, 100%);
    border-width: var(--block-border-width);
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #9900ff !important;
    /* width: 547px !important; */
}
/* 最下面视频显示框 */
#show_box1 {
    border-style: solid;
    overflow: visible;
    min-width: min(0px, 100%);
    border-width: var(--block-border-width);
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #e0dede !important;
    /* width: 547px !important; */
}
/* 最下面视频显示框 */
#show_box2 {
    border-style: solid;
    overflow: visible;
    min-width: min(0px, 100%);
    border-width: var(--block-border-width);
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #9900ff !important;
    /* width: 547px !important; */
    /* height: min(618.48px, 100%) !important; */
    min-height: min(618.48px,100%);
    /* margin: 0 auto !important; */
    display: flex;
    flex-wrap: wrap;
        
}

/* 右侧视频显示框边框蓝色 */
.empty.svelte-lk9eg8 {
    display: flex;
    justify-content: center;
    align-items: center;
    /* margin-top: calc(0px - var(--size-6)); */
    height: var(--size-full);
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #c4c3c4 !important;
}

/* Textbox边框color设置 */
.container.svelte-1f354aw>input.svelte-1f354aw,
.container.svelte-1f354aw>textarea.svelte-1f354aw {
    /* border: var(--input-border-width) solid var(--input-border-color); */
    /* border-radius: var(--input-radius); */
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #909090 !important;
    box-shadow: 0 3px 5px rgba(118, 118, 118, 0.5);
    align-items: center !important;
    /* width: 477px!important; */
}

/* Textbox边框padding设置 */
div.svelte-sfqy0y .block {
    box-shadow: none !important;
    border-width: 0px !important;
    border-radius: 0 !important;
    padding: 0px !important;
}

/* 右侧视频显示背景色修改 */
video.svelte-w5wajl.svelte-w5wajl {
    position: inherit;
    background-color: rgba(0, 0, 0, .1);
    width: var(--size-full);
    height: var(--size-full);
    object-fit: contain;
}

.gradio-container-3-47-1 img,
.gradio-container-3-47-1 video {
    max-width: 100%;
    height: auto;
    margin: 0;
}

/* 左侧模板视频选择框边框蓝色 */
div.svelte-19hvt5v {
    display: flex;
    position: relative;
    border: 1px solid var(--border-color-primary);
    border-top: none;
    border-bottom-right-radius: var(--container-radius);
    border-bottom-left-radius: var(--container-radius);
    padding: var(--block-padding);
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #acacad !important;
    /* width: 520px!important; */
}

/* droupbox竖向拉长 */
input.svelte-tq78c3.svelte-tq78c3 {
    margin: var(--spacing-sm);
    outline: none;
    border: none;
    background: inherit;
    width: var(--size-full);
    color: var(--body-text-color);
    font-size: var(--input-text-size);
    height: 80px;
}


#release_note {
    color: #624AFF;
    font-weight: 600;
}

/* tab标签背景颜色 */
.selected.svelte-kqij2n {
    border-color: var(--border-color-primary);
    background: var(--background-fill-primary);
    color: var(--body-text-color);
    background: #371ceb !important;
    color: white !important;
}

/* markdown字体 */
/* #font_style {
    font-size: 16px;
    font-style: inherit;
    font-weight: 800;
    font-family: system-ui;
    text-align: -webkit-center;
    display: flex;
    align-content: center !important;
    justify-content: center !important;
    align-items: center !important;
} */
#font_style {
    font-size: 16px;
    font-style: inherit;
    font-weight: 800;
    font-family: system-ui;
    text-align: -webkit-center;
}
/* markdown字体 */
#font_style1 {
    font-size: 16px;
    font-style: inherit;
    font-weight: 800;
    font-family: system-ui;
    text-align: -webkit-left;
    justify-content: center
}

/* checkbox勾选框颜色 */
input.svelte-1ojmf70.svelte-1ojmf70.svelte-1ojmf70 {
    --ring-color: transparent;
    position: relative;
    box-shadow: var(--input-shadow);
    border: 1px solid #0354f5;
    border-radius: var(--checkbox-border-radius);
    background-color: #e9f1f9;
    line-height: var(--line-sm);
}

/* 左侧图片显示框使得图片自适应窗口 */
.gradio-container-3-47-1 img,
.gradio-container-3-47-1 video {
    max-width: 100%;
    height: -webkit-fill-available;
    margin: 0;
}

/*模板prompt框*/
.container.svelte-1f354aw>input.svelte-1f354aw,
.container.svelte-1f354aw>textarea.svelte-1f354aw {
    border-top-width: 1px !important;
    border-right-width: 1px !important;
    border-bottom-width: 1px !important;
    border-left-width: 1px !important;
    border-color: #dddbdb !important;
    box-shadow: 0 3px 5px rgba(118, 118, 118, 0.5);
    align-items: center !important;
}
/*刷新提示语框*/
/* .container.svelte-1f354aw>input.svelte-1f354aw,
.container.svelte-1f354aw>textarea.svelte-1f354aw {
    border-top-width: 0px !important;
    border-right-width: 0px !important;
    border-bottom-width: 0px !important;
    border-left-width: 0px !important;
} */

/*微信群/钉钉群*/
#css_img_QRCode {
    max-height: 250px !important;
    display: flex !important;
    justify-content: center !important;
}

/*微信群/钉钉群文字*/
#css_img_QRCode_text {
    text-align: center;
}
/*标题文字加粗*/
.gradio-container-3-47-1 .prose p {
    margin-bottom: var(--spacing-sm);
    line-height: var(--line-lg);
    font-weight: 800;
}

/*刷新提示语*/
#text_style11 {
    .container.svelte-1f354aw>input.svelte-1f354aw,
    .container.svelte-1f354aw>textarea.svelte-1f354aw {
        border-top-width: 0px !important;
        border-right-width: 0px !important;
        border-bottom-width: 0px !important;
        border-left-width: 0px !important;
        border-color: #dddbdb !important;
        -webkit-text-fill-color: #060df6;
        padding: unset;
        /* line-height: 25px; */
        /* box-shadow: unset; */
        padding-top: 9px;
    }
}

#box_show4 {
    border-style: solid;
    overflow: visible;
    min-width: min(0px, 100%);
    border-width: var(--block-border-width);
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}