Dantes (обсуждение | вклад) Нет описания правки |
Dantes (обсуждение | вклад) Нет описания правки |
||
| Строка 1: | Строка 1: | ||
#ss-art-gallery.ss-wrap{--ss-bg:#0f1115;--ss-fg:#e6e6e6;--ss-muted:#a9b0bd;--ss-accent:#dca01b;--ss-card:#171a21;--ss-ring:#2b3241;--ss-chip:#1e2330;--ss-shadow:0 8px 24px rgba(0,0,0,.35);background:var(--ss-bg);color:var(--ss-fg);padding:16px 20px;border-radius:16px} | |||
. | #ss-art-gallery .ss-header{display:flex;flex-direction:column;gap:8px;margin-bottom:16px} | ||
. | #ss-art-gallery .ss-title{font-size:28px;line-height:1.15;font-weight:700} | ||
#ss-art-gallery .ss-sub{font-size:14px;color:var(--ss-muted)} | |||
#ss-art-gallery .ss-filters{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px} | |||
#ss-art-gallery .ss-chip{user-select:none;cursor:pointer;background:var(--ss-chip);padding:8px 12px;border-radius:999px;border:1px solid var(--ss-ring);box-shadow:var(--ss-shadow);font-size:13px} | |||
} | #ss-art-gallery .ss-chip-active{border-color:var(--ss-accent);outline:2px solid transparent} | ||
#ss-art-gallery .ss-section{margin:20px 0} | |||
#ss-art-gallery .ss-section-title{font-size:20px;font-weight:700;margin:8px 0 12px 2px} | |||
. | #ss-art-gallery .ss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px} | ||
#ss-art-gallery .ss-card{background:var(--ss-card);border:1px solid var(--ss-ring);border-radius:14px;box-shadow:var(--ss-shadow);padding:10px;display:flex;flex-direction:column;gap:8px;transform:translateZ(0)} | |||
} | #ss-art-gallery .ss-card-title{font-size:14px;color:var(--ss-muted)} | ||
#ss-art-gallery .ss-card img{width:100%!important;height:auto!important;border-radius:10px;display:block} | |||
#ss-art-gallery .ss-card:hover{border-color:var(--ss-accent)} | |||
. | #ss-art-gallery .ss-hidden{display:none!important} | ||
#ss-art-gallery .ss-modal{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:9999} | |||
} | #ss-art-gallery .ss-modal.open{display:flex} | ||
#ss-art-gallery .ss-modal-inner{max-width:92vw;max-height:92vh} | |||
#ss-art-gallery .ss-modal-img{max-width:92vw;max-height:92vh;border-radius:12px} | |||
. | #ss-art-gallery .ss-modal-close{position:fixed;top:14px;right:16px;background:var(--ss-chip);border:1px solid var(--ss-ring);padding:8px 12px;border-radius:10px;cursor:pointer} | ||
} | |||
. | |||
} | |||
. | |||
} | |||
Версия от 09:49, 24 августа 2025
#ss-art-gallery.ss-wrap{--ss-bg:#0f1115;--ss-fg:#e6e6e6;--ss-muted:#a9b0bd;--ss-accent:#dca01b;--ss-card:#171a21;--ss-ring:#2b3241;--ss-chip:#1e2330;--ss-shadow:0 8px 24px rgba(0,0,0,.35);background:var(--ss-bg);color:var(--ss-fg);padding:16px 20px;border-radius:16px}
#ss-art-gallery .ss-header{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
#ss-art-gallery .ss-title{font-size:28px;line-height:1.15;font-weight:700}
#ss-art-gallery .ss-sub{font-size:14px;color:var(--ss-muted)}
#ss-art-gallery .ss-filters{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
#ss-art-gallery .ss-chip{user-select:none;cursor:pointer;background:var(--ss-chip);padding:8px 12px;border-radius:999px;border:1px solid var(--ss-ring);box-shadow:var(--ss-shadow);font-size:13px}
#ss-art-gallery .ss-chip-active{border-color:var(--ss-accent);outline:2px solid transparent}
#ss-art-gallery .ss-section{margin:20px 0}
#ss-art-gallery .ss-section-title{font-size:20px;font-weight:700;margin:8px 0 12px 2px}
#ss-art-gallery .ss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
#ss-art-gallery .ss-card{background:var(--ss-card);border:1px solid var(--ss-ring);border-radius:14px;box-shadow:var(--ss-shadow);padding:10px;display:flex;flex-direction:column;gap:8px;transform:translateZ(0)}
#ss-art-gallery .ss-card-title{font-size:14px;color:var(--ss-muted)}
#ss-art-gallery .ss-card img{width:100%!important;height:auto!important;border-radius:10px;display:block}
#ss-art-gallery .ss-card:hover{border-color:var(--ss-accent)}
#ss-art-gallery .ss-hidden{display:none!important}
#ss-art-gallery .ss-modal{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:9999}
#ss-art-gallery .ss-modal.open{display:flex}
#ss-art-gallery .ss-modal-inner{max-width:92vw;max-height:92vh}
#ss-art-gallery .ss-modal-img{max-width:92vw;max-height:92vh;border-radius:12px}
#ss-art-gallery .ss-modal-close{position:fixed;top:14px;right:16px;background:var(--ss-chip);border:1px solid var(--ss-ring);padding:8px 12px;border-radius:10px;cursor:pointer}