264 lines
7.8 KiB
CSS
264 lines
7.8 KiB
CSS
|
|
.gradio-container > .flex > div.mx-auto.container,
|
|
div.main > div.wrap > div.contain {
|
|
display: flex;
|
|
}
|
|
|
|
#tabs, div.main > div.wrap > div.contain > * {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.extra-network-cards .card .previewXD-button::before {
|
|
content: "℗"
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info .img-prop-container {
|
|
width: min-content;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info details summary {
|
|
cursor: pointer;
|
|
display: inline list-item;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info details > :not(:first-child) {
|
|
text-indent: 0em;
|
|
margin-left: 1.5em;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info details[open] {
|
|
padding-bottom: 1em;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info .description {
|
|
margin-left: 1.5em;
|
|
white-space: break-spaces;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info .description iframe {
|
|
width: revert-layer;
|
|
height: revert-layer;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info ul li {
|
|
list-style-type: none;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info ul {
|
|
margin-left: 1em;
|
|
margin-top: 0;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info .img-prop-container .img-properties-list {
|
|
word-break: break-word;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .civitai-info ul ul {
|
|
font-size: 100%;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface {
|
|
position: relative;
|
|
flex: 1;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[style*="display: block"] {
|
|
display: grid !important;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface code {
|
|
overflow: auto;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface > div {
|
|
position: relative;
|
|
height: 100%;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface #modelpreview_xd_setting {
|
|
position: absolute;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface > div > .tabs {
|
|
height: 100%;
|
|
max-height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface > div > .tabs > .tabitem {
|
|
flex: 1;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface > div > .tabs > .tabitem > div {
|
|
height: 100%;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_row {
|
|
flex: 1;
|
|
overflow: auto;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div > .transition,
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div > div:nth-of-type(2),
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div {
|
|
height: 100%;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface iframe {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_hidden_ui {
|
|
display: none;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_flexcolumn_row {
|
|
flex-direction: column;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[limit-height] .modelpreview_xd_html_row {
|
|
position: relative;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[limit-height] .modelpreview_xd_html_row > .modelpreview_xd_flexcolumn_row {
|
|
position: absolute;
|
|
height: 100%;
|
|
flex-wrap: nowrap;
|
|
display: grid;
|
|
grid-template-rows: min-content auto;
|
|
grid-template-columns: auto;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[limit-height] .modelpreview_xd_html_row > .modelpreview_xd_flexcolumn_row:has(> .hidden) {
|
|
grid-template-rows: auto;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .footer-tags {
|
|
font-size: 85%;
|
|
opacity: 0.85;
|
|
border-top: 2px solid #e5e7eb;
|
|
}
|
|
|
|
/* column view styling */
|
|
#tab_modelpreview_xd_interface[column-view] .model_preview_xd_tab > div {
|
|
display: grid;
|
|
grid-template-rows: auto auto 1fr min-content auto min-content;
|
|
grid-template-columns: minmax(min-content, 600px) minmax(210px, auto);
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[column-view] .modelpreview_xd_control_row {
|
|
/* div 1 - model select */
|
|
grid-area: 1 / 1 / span 1 / span 1;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[column-view] .modelpreview_xd_prompts_row {
|
|
/* div 3 .prompts */
|
|
grid-area: 2 / 1 / span 1 / span 1;
|
|
}
|
|
#tab_modelpreview_xd_interface[column-view] .modelpreview_xd_notes_row {
|
|
/* div 4 - .txt */
|
|
grid-area: 3 / 1 / span 2 / span 1;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[column-view] .modelpreview_xd_html_row {
|
|
/* div 5 - preview images and .md or civitai.info or .html */
|
|
grid-area: 1 / 2 / span 4 / span 1;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[column-view] .modelpreview_xd_markdown_div {
|
|
flex:1000;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface[column-view] .modelpreview_xd_tags_row {
|
|
/* div 6 - .tags */
|
|
grid-area: 5 / 1 / span 1 / span 2;
|
|
}
|
|
|
|
/* Prompt file style */
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_prompts_row {
|
|
flex-wrap: nowrap;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_prompts_row > * {
|
|
flex: 0;
|
|
flex-basis: max-content;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_prompts_list > span {
|
|
display: none;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_prompts_copy_button {
|
|
min-width: max-content;
|
|
}
|
|
|
|
/* Meta Copy Styling */
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-meta {
|
|
display: none;
|
|
}
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-meta-ico::before {
|
|
content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23ffffff' width='1em' x='0px' y='0px' viewBox='0 0 115.77 122.88' style='enable-background:new 0 0 115.77 122.88' xml:space='preserve'%3E%3Cstyle type='text/css'%3E.st0%7Bfill-rule:evenodd;clip-rule:evenodd;%7D%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M89.62,13.96v7.73h12.19h0.01v0.02c3.85,0.01,7.34,1.57,9.86,4.1c2.5,2.51,4.06,5.98,4.07,9.82h0.02v0.02 v73.27v0.01h-0.02c-0.01,3.84-1.57,7.33-4.1,9.86c-2.51,2.5-5.98,4.06-9.82,4.07v0.02h-0.02h-61.7H40.1v-0.02 c-3.84-0.01-7.34-1.57-9.86-4.1c-2.5-2.51-4.06-5.98-4.07-9.82h-0.02v-0.02V92.51H13.96h-0.01v-0.02c-3.84-0.01-7.34-1.57-9.86-4.1 c-2.5-2.51-4.06-5.98-4.07-9.82H0v-0.02V13.96v-0.01h0.02c0.01-3.85,1.58-7.34,4.1-9.86c2.51-2.5,5.98-4.06,9.82-4.07V0h0.02h61.7 h0.01v0.02c3.85,0.01,7.34,1.57,9.86,4.1c2.5,2.51,4.06,5.98,4.07,9.82h0.02V13.96L89.62,13.96z M79.04,21.69v-7.73v-0.02h0.02 c0-0.91-0.39-1.75-1.01-2.37c-0.61-0.61-1.46-1-2.37-1v0.02h-0.01h-61.7h-0.02v-0.02c-0.91,0-1.75,0.39-2.37,1.01 c-0.61,0.61-1,1.46-1,2.37h0.02v0.01v64.59v0.02h-0.02c0,0.91,0.39,1.75,1.01,2.37c0.61,0.61,1.46,1,2.37,1v-0.02h0.01h12.19V35.65 v-0.01h0.02c0.01-3.85,1.58-7.34,4.1-9.86c2.51-2.5,5.98-4.06,9.82-4.07v-0.02h0.02H79.04L79.04,21.69z M105.18,108.92V35.65v-0.02 h0.02c0-0.91-0.39-1.75-1.01-2.37c-0.61-0.61-1.46-1-2.37-1v0.02h-0.01h-61.7h-0.02v-0.02c-0.91,0-1.75,0.39-2.37,1.01 c-0.61,0.61-1,1.46-1,2.37h0.02v0.01v73.27v0.02h-0.02c0,0.91,0.39,1.75,1.01,2.37c0.61,0.61,1.46,1,2.37,1v-0.02h0.01h61.7h0.02 v0.02c0.91,0,1.75-0.39,2.37-1.01c0.61-0.61,1-1.46,1-2.37h-0.02V108.92L105.18,108.92z'/%3E%3C/g%3E%3C/svg%3E");
|
|
color: white;
|
|
text-shadow: 1px 1px 1px black;
|
|
padding: 0 6px;
|
|
font-size: 22px;
|
|
cursor: pointer;
|
|
background: #f000;
|
|
border-radius: 5px;
|
|
display: grid;
|
|
justify-content: center;
|
|
align-content: center;
|
|
overflow: inherit;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
width: 30px;
|
|
height: 30px;
|
|
transition: background-color 0.3s;
|
|
}
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-meta-ico {
|
|
display: inline-block;
|
|
}
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-container .img-meta-ico:hover::before {
|
|
background: #f00;
|
|
}
|
|
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-container-set {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
width: max-content;
|
|
justify-content: center;
|
|
gap: 10px;
|
|
align-content: center;
|
|
align-items: stretch;
|
|
overflow: auto;
|
|
margin: auto;
|
|
max-width: 100%;
|
|
}
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-container-set .img-container {
|
|
position: relative;
|
|
border: 1px solid grey;
|
|
width: 293px;
|
|
height: 294px;
|
|
overflow: hidden;
|
|
background: #333;
|
|
}
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-container-set .img-container img {
|
|
object-fit: contain;
|
|
height: 100%;
|
|
width: 100%;
|
|
object-position: center;
|
|
cursor: zoom-in;
|
|
}
|
|
|
|
@media (max-height: 1000px), (max-width: 1300px) {
|
|
#tab_modelpreview_xd_interface .modelpreview_xd_html_div .img-container-set .img-container {
|
|
width: 193px;
|
|
height: 194px;
|
|
}
|
|
} |