Spaces:
Running
on
Zero
Running
on
Zero
.accordion { | |
--block-border-width: 0px; | |
background-color: transparent; | |
padding: 0px; | |
} | |
.accordion > button { | |
margin-bottom: 16px; | |
justify-content: flex-start; | |
color: var(--body-text-color-subdued); | |
} | |
.accordion > button:hover { | |
color: var(--body-text-color); | |
} | |
.accordion > button > span:first-child { | |
width: auto; | |
margin-right: 4px; | |
} | |
.accordion .tabitem > div { | |
--block-border-width: 1px; | |
} | |
.gallery { | |
background-color: var(--bg); | |
} | |
.gallery:is(.dark *) { | |
background-color: var(--bg-dark); | |
} | |
.gallery > .grid-wrap { | |
overflow-y: auto; | |
} | |
.gallery, .gallery > .grid-wrap { | |
height: 100%; | |
max-height: 574px; | |
} | |
@media (min-width: 640px) { | |
.gallery, .gallery > .grid-wrap { | |
height: 574px; | |
max-height: none; | |
} | |
} | |
.icon-button { | |
max-width: 42px; | |
} | |
.popover { | |
position: relative; | |
} | |
.popover:hover::after { | |
white-space: nowrap; | |
position: absolute; | |
left: 50%; | |
bottom: calc(100% + 8px); | |
transform: translateX(-50%); | |
padding: 4px 8px; | |
border-radius: 4px; | |
border-width: 1px; | |
border-color: var(--button-secondary-border-color-hover); | |
background: var(--button-secondary-background-fill-hover); | |
color: var(--button-secondary-text-color-hover); | |
font-weight: var(--section-header-text-weight); | |
font-size: var(--section-header-text-size); | |
} | |
.popover#clear:hover::after { | |
content: 'Clear gallery'; | |
} | |
.popover#random:hover::after { | |
/* see config.py for default seed */ | |
content: var(--seed, "-1"); | |
} | |
#intro { | |
margin-bottom: 8px ; | |
} | |
#intro > div { | |
display: flex; | |
} | |
#intro > div > h1 > span { | |
font-style: italic; | |
color: #047857 ; | |
} | |
#intro > div > h1 > span:is(.dark *) { | |
color: #10b981 ; | |
} | |
#intro > div > svg { | |
width: 1.5rem; | |
height: 1.5rem; | |
margin-top: 0.25rem; | |
margin-left: 0.5rem; | |
align-self: center; | |
fill: #047857 ; | |
animation: spin 3s linear infinite reverse; | |
} | |
#intro > div > svg:is(.dark *) { | |
fill: #10b981 ; | |
} | |
@keyframes spin { | |
100% { transform: rotate(360deg); } | |
} | |
.tabs, .tabitem, .tab-nav, .tab-nav > .selected { | |
border-width: 0px; | |
} | |
.tabitem { | |
max-height: 516px; | |
overflow-x: hidden; | |
overflow-y: auto; | |
padding: 0 0 8px; | |
} | |
.tab-nav { | |
margin-bottom: 16px; | |
} | |
.tab-nav > button { | |
padding-bottom: 8px; | |
} | |