.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; } #embeddings .token { border-radius: 4px; } .gallery { background-color: var(--bg); } .gallery:is(.dark *) { background-color: var(--bg-dark); } .gallery .grid-wrap { overflow-y: auto; } .gallery, .gallery .grid-wrap { height: calc(100vh - 360px); max-height: none; } .icon-button { max-width: 42px; } .image-container { max-height: calc(100vh - 480px); } .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#random:hover::after { content: 'Random prompt'; } .popover#clear:hover::after { content: 'Clear gallery'; } .popover#refresh:hover::after { /* see config.py for default seed */ content: var(--seed, "-1"); } #intro { margin-bottom: 8px !important; } #intro > div { display: flex; } #intro > div > h1 > span { font-style: italic; color: #047857 !important; } #intro > div > h1 > span:is(.dark *) { color: #10b981 !important; } #intro > div > svg { width: 1.5rem; height: 1.5rem; margin-top: 0.25rem; margin-left: 0.5rem; align-self: center; fill: #047857 !important; animation: spin 3s linear infinite reverse; } #intro > div > svg:is(.dark *) { fill: #10b981 !important; } @keyframes spin { 100% { transform: rotate(360deg); } } .tabs, .tabitem, .tab-nav, .tab-nav > .selected { border-width: 0px; } .tabitem { max-height: calc(100vh - 260px); overflow-x: hidden; overflow-y: auto; padding: 0 0 8px; } .tab-nav { margin-bottom: 16px; } .tab-nav > button { padding-bottom: 8px; }