2 lines
11 KiB
CSS
2 lines
11 KiB
CSS
|
.app{min-height:100vh;display:flex;flex-direction:column;max-width:1200px;margin:0 auto;padding:0 1.25rem 2rem}.app-header{padding:2rem 0 1.5rem;border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:1rem;text-align:left}.logo{font-size:2.5rem;line-height:1}.app-header h1{font-family:var(--font-display);font-size:clamp(1.75rem,4vw,2.25rem);font-weight:700;margin:0;color:var(--ink);letter-spacing:-.02em}.tagline{margin:.25rem 0 0;font-size:.95rem;color:var(--ink-muted)}.app-main{display:grid;grid-template-columns:minmax(280px,340px) 1fr;gap:2rem;align-items:start;padding-top:1.75rem;flex:1}@media(max-width:840px){.app-main{grid-template-columns:1fr}}.sidebar{position:sticky;top:1rem}@media(max-width:840px){.sidebar{position:static}}.book-form{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.35rem;box-shadow:var(--shadow);text-align:left}.book-form h2{font-family:var(--font-display);font-size:1.15rem;margin:0 0 1rem;color:var(--ink)}.form-grid{display:grid;gap:.85rem}.book-form label{display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;font-weight:600;color:var(--ink-muted);text-transform:uppercase;letter-spacing:.04em}.book-form input[type=text],.book-form input[type=number],.book-form input[type=search]{font:inherit;padding:.55rem .65rem;border:1px solid var(--border);border-radius:8px;background:var(--paper);color:var(--ink)}.book-form input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.checkbox-row{flex-direction:row!important;align-items:center;gap:.5rem!important;margin-top:.75rem;text-transform:none!important;font-weight:500!important;color:var(--ink)!important}.form-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.1rem}.btn{font:inherit;cursor:pointer;border-radius:8px;border:1px solid var(--border);padding:.5rem 1rem;background:var(--card);color:var(--ink);transition:background .15s,border-color .15s,color .15s}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}@media(prefers-color-scheme:dark){.btn.primary{color:#1c1917}}.btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn.ghost{background:transparent}.btn.ghost:hover{background:var(--accent-soft);border-color:var(--accent)}.btn.small{padding:.35rem .65rem;font-size:.85rem}.btn.danger{color:var(--danger);border-color:transparent;background:var(--danger-soft)}.btn.danger:hover{border-color:var(--danger)}.book-list-section{text-align:left}.toolbar{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.25rem}.search{font:inherit;width:100%;padding:.65rem .85rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--card);color:var(--ink)}.search:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.filter-tabs{display:flex;flex-wrap:wrap;gap:.35rem}.tab{font:inherit;cursor:pointer;padding:.4rem .85rem;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--ink-muted)}.tab:hover{color:var(--ink);border-color:var(--ink-muted)}.tab.active{background:var(--accent-soft);border-color:var(--accent);color:var(--ink);font-weight:600}.empty-state{color:var(--ink-muted);padding:2rem 0;margin:0}.book-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}.book-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem 1.1rem;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:.35rem}.book-card-top{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.badge{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:.2rem .5rem;border-radius:4px}.badge.read{background:var(--accent-soft);color:var(--accent)}.badge.unread{background:var(--border);color:var(--ink-muted)}.genre{font-size:.8rem;color:var(--ink-muted)}.book-card h3{font-family:var(--font-display);font-size:1.05rem;margin:.25rem 0 0;line-he
|