MediaWiki:Test.css: различия между версиями

Страница интерфейса MediaWiki
Нет описания правки
Нет описания правки
Строка 1: Строка 1:
#ss-art-gallery.ss-wrap{--ss-bg:#0e0f14;--ss-fg:#e9e9e9;--ss-muted:#a9b0bd;--ss-accent:#dca01b;--ss-card:#171a21;--ss-ring:#2b3241;--ss-chip:#1e2330;--ss-shadow:0 10px 28px rgba(0,0,0,.4);background:var(--ss-bg);color:var(--ss-fg);padding:20px;border-radius:18px;font-family:"Segoe UI",sans-serif}
.chem-wrap{display:flex;flex-direction:column;gap:12px}
#ss-art-gallery .ss-header{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;text-align:center}
.chem-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#171717;color:#ddd;padding:8px 10px;border-radius:12px}
#ss-art-gallery .ss-title{font-size:30px;line-height:1.2;font-weight:700;color:var(--ss-accent)}
.chem-input{padding:6px 10px;border:1px solid #333;border-radius:10px;background:#0f0f0f;color:#eee}
#ss-art-gallery .ss-sub{font-size:15px;color:var(--ss-muted)}
.chem-pill{display:inline-block;padding:6px 10px;border-radius:999px;background:#232323;border:1px solid #333;cursor:pointer;user-select:none}
#ss-art-gallery .ss-filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.chem-pill[aria-pressed="true"]{outline:2px solid #555}
#ss-art-gallery .ss-chip{user-select:none;cursor:pointer;background:var(--ss-chip);padding:8px 14px;border-radius:999px;border:1px solid var(--ss-ring);box-shadow:var(--ss-shadow);font-size:13px;transition:all .2s ease}
.chem-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
#ss-art-gallery .ss-chip:hover{background:var(--ss-accent);color:#000}
.chem-card{background:#111;border:1px solid #2a2a2a;border-radius:14px;padding:10px;color:#e8e8e8}
#ss-art-gallery .ss-chip-active{border-color:var(--ss-accent);background:var(--ss-accent);color:#000}
.chem-card h3{margin:0 0 6px 0;font-size:16px}
#ss-art-gallery .ss-section{margin:24px 0}
.chem-meta{font-size:12px;color:#bdbdbd;margin-bottom:6px}
#ss-art-gallery .ss-section-title{font-size:22px;font-weight:700;margin:10px 0 14px;text-align:left;color:var(--ss-accent)}
.chem-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
#ss-art-gallery .ss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.chem-badge{padding:2px 6px;border-radius:8px;border:1px solid #303030;background:#191919;font-size:12px}
#ss-art-gallery .ss-card{background:var(--ss-card);border:1px solid var(--ss-ring);border-radius:16px;box-shadow:var(--ss-shadow);padding:12px;display:flex;flex-direction:column;gap:10px;transform:translateZ(0);transition:transform .2s ease,border-color .2s ease}
.chem-table{width:100%;border-collapse:collapse;margin-top:6px}
#ss-art-gallery .ss-card:hover{transform:translateY(-4px);border-color:var(--ss-accent)}
.chem-table th,.chem-table td{border:1px solid #2a2a2a;padding:6px;text-align:left}
#ss-art-gallery .ss-card-title{font-size:15px;color:var(--ss-muted);text-align:center}
.chem-table th{background:#151515}
#ss-art-gallery .ss-card img{width:100%!important;height:auto!important;border-radius:12px;display:block}
.chem-empty{color:#aaa;padding:8px}
#ss-art-gallery .ss-hidden{display:none!important}
.chem-btn{display:inline-block;padding:6px 10px;border-radius:10px;border:1px solid #333;background:#1a1a1a;cursor:pointer}
#ss-art-gallery .ss-modal{position:fixed;inset:0;background:rgba(0,0,0,.88);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;animation:ss-fade .25s ease}
#ss-art-gallery .ss-modal-img{max-width:92vw;max-height:92vh;border-radius:14px;box-shadow:0 0 24px rgba(0,0,0,.7)}
#ss-art-gallery .ss-modal-close{position:fixed;top:16px;right:18px;background:var(--ss-chip);border:1px solid var(--ss-ring);padding:8px 14px;border-radius:10px;cursor:pointer;transition:all .2s ease}
#ss-art-gallery .ss-modal-close:hover{background:var(--ss-accent);color:#000}
@keyframes ss-fade{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}

Версия от 11:38, 24 августа 2025

.chem-wrap{display:flex;flex-direction:column;gap:12px}
.chem-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#171717;color:#ddd;padding:8px 10px;border-radius:12px}
.chem-input{padding:6px 10px;border:1px solid #333;border-radius:10px;background:#0f0f0f;color:#eee}
.chem-pill{display:inline-block;padding:6px 10px;border-radius:999px;background:#232323;border:1px solid #333;cursor:pointer;user-select:none}
.chem-pill[aria-pressed="true"]{outline:2px solid #555}
.chem-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.chem-card{background:#111;border:1px solid #2a2a2a;border-radius:14px;padding:10px;color:#e8e8e8}
.chem-card h3{margin:0 0 6px 0;font-size:16px}
.chem-meta{font-size:12px;color:#bdbdbd;margin-bottom:6px}
.chem-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.chem-badge{padding:2px 6px;border-radius:8px;border:1px solid #303030;background:#191919;font-size:12px}
.chem-table{width:100%;border-collapse:collapse;margin-top:6px}
.chem-table th,.chem-table td{border:1px solid #2a2a2a;padding:6px;text-align:left}
.chem-table th{background:#151515}
.chem-empty{color:#aaa;padding:8px}
.chem-btn{display:inline-block;padding:6px 10px;border-radius:10px;border:1px solid #333;background:#1a1a1a;cursor:pointer}