Learn: section actions on the title row, scrollable tables, copy code

This commit is contained in:
2026-09-17 20:16:35 +03:00
parent 78b72267a8
commit 22b732633c
7 changed files with 189 additions and 67 deletions

View File

@@ -218,7 +218,21 @@ dialog.modal::backdrop { background: rgba(0,0,0,0.55); }
.md-body details.spoiler { border: 1px solid var(--c-border); border-radius: 0.5rem; padding: 0.5rem 0.75rem; margin: 0.5rem 0; }
.md-body details.spoiler summary { cursor: pointer; font-weight: 500; color: var(--c-text-link); }
.md-body img { max-width: 100%; }
.md-body table { margin: 0.5rem 0; }
.md-body table { margin: 0; }
/* Таблицы в статьях прокручиваются по горизонтали, как блоки кода */
.table-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0.5rem 0; }
/* Блок кода: кнопка копирования в правом верхнем углу */
.md-code-wrap { position: relative; margin: 0.5rem 0; }
.md-code-wrap pre { margin: 0; }
.md-copy {
position: absolute; top: 0.4rem; right: 0.4rem;
font: inherit; font-size: 0.72rem; line-height: 1;
padding: 0.25rem 0.5rem; cursor: pointer;
color: var(--c-text-muted); background: var(--c-surface);
border: 1px solid var(--c-border); border-radius: 0.35rem; opacity: 0.85;
}
.md-copy:hover { color: var(--c-text); opacity: 1; }
.md-copy.copied { color: var(--c-text-link); }
/* Empty state */
.empty { text-align: center; color: var(--c-text-muted); padding: 1.5rem; }
@@ -253,12 +267,22 @@ code.code { padding: 0.125rem 0.5rem; border-radius: 0.25rem; font-family: monos
.sort-list { list-style: none; margin: 0; padding: 0; }
.sort-list > li { display: flex; align-items: center; gap: 0.5rem; min-width: 0; padding: 0.15rem 0; }
.chapter-card { padding: 0.75rem 1rem; }
details.sub-acc { margin-top: 0.25rem; border-top: 1px solid var(--c-border); }
[data-section-list] > details.sub-acc:first-of-type { border-top: none; }
details.sub-acc > summary.sub-head { list-style: none; cursor: pointer; padding: 0.4rem 0; }
details.sub-acc > summary::-webkit-details-marker { display: none; }
.sub-arrow { flex: 0 0 auto; width: 8px; height: 8px; border-right: 2px solid var(--c-text-muted); border-bottom: 2px solid var(--c-text-muted); transform: rotate(45deg); transition: transform 0.2s; }
details.sub-acc[open] > summary .sub-arrow { transform: rotate(-135deg); }
.sub-acc { margin-top: 0.25rem; border-top: 1px solid var(--c-border); }
[data-section-list] > .sub-acc:first-of-type { border-top: none; }
.sub-acc > .sub-head { padding: 0.4rem 0; }
.sub-acc.collapsed > .section-body { display: none; }
.sub-toggle {
display: inline-flex; align-items: center; justify-content: center;
flex: 0 0 auto; width: 1rem; height: 1rem; padding: 0; border: none;
background: none; cursor: pointer; color: var(--c-text-muted);
}
.sub-toggle:hover { color: var(--c-text); }
.sub-arrow {
flex: 0 0 auto; width: 8px; height: 8px;
border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
transform: rotate(-135deg); transition: transform 0.2s;
}
.sub-acc.collapsed .sub-arrow { transform: rotate(45deg); }
.section-body { padding-bottom: 0.4rem; }
/* ---- Матрица группы и карточки защиты ---- */