Mermutef/LMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI fixes: learn rows on one line, offcanvas header/brand/user layout, users column, code color, badge padding, sticky footer; class-based selectors

Browse Source
This commit is contained in:
Vladislav Kopnin
2026-10-03 00:24:48 +03:00
parent f65a60462e
commit 5856c0b479
10 changed files with 47 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
web/src/main/resources/static/css/app.css
View File

@@ -131,6 +131,7 @@ p { margin-top: 0; }
/* ===== B3-тема поверх Bootstrap: navbar, offcanvas, кнопки, ссылки ===== */
code { --bs-code-color: var(--c-text); color: var(--c-text); }
.b3-navbar { background: var(--c-surface); border-bottom: 1px solid var(--c-border); }
.b3-navbar .container, .page-main.container { max-width: 1200px; }
.b3-navbar .navbar-brand { color: var(--c-text); font-weight: 700; font-size: 1rem; }
@@ -141,10 +142,10 @@ p { margin-top: 0; }
.nav-link.active { color: var(--c-accent) !important; font-weight: 700; }
.navbar-close { border: 0; background: none; color: var(--c-text-muted); font-size: 1.1rem; line-height: 1; }
.navbar-close:hover { color: var(--c-text); }
#mobileNav { --bs-offcanvas-width: 17rem; --bs-offcanvas-bg: var(--c-surface); --bs-offcanvas-color: var(--c-text); --bs-offcanvas-border-color: var(--c-border); }
#mobileNav .offcanvas-header { border-bottom: 1px solid var(--c-border); }
#mobileNav .navbar-nav { gap: 0.25rem; }
#mobileNav .nav-link { padding: 0.5rem 0.25rem; font-size: 1rem; }
.app-offcanvas { --bs-offcanvas-width: 17rem; --bs-offcanvas-bg: var(--c-surface); --bs-offcanvas-color: var(--c-text); --bs-offcanvas-border-color: var(--c-border); }
.app-offcanvas .offcanvas-header { border-bottom: 1px solid var(--c-border); justify-content: space-between; gap: 1rem; }
.app-offcanvas .navbar-nav { gap: 0.25rem; }
.app-offcanvas .nav-link { padding: 0.5rem 0.25rem; font-size: 1rem; }
@media (max-width: 767.98px) {
#mobileNav .offcanvas-body { display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; }
}
@@ -202,7 +203,7 @@ a { --bs-link-color: var(--c-accent); --bs-link-hover-color: var(--c-accent-hove
/* Badges — «этикетки»: строгая рамка, разрядка капсом; только индикаторы статуса */
.badge {
display: inline-flex; align-items: center;
border-radius: var(--radius-xs); padding: 0.1rem 0.5rem;
border-radius: var(--bs-btn-border-radius, var(--radius-sm)); padding: 0.5rem 1rem;
font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
border: 1px solid transparent;
}
@@ -233,7 +234,7 @@ tr:last-child td { border-bottom: none; }
.group-title { margin: 0 0 0.5rem; font-size: 1rem; font-weight: 600; }
.inline-form { display: inline-flex; align-items: center; gap: 0.375rem; margin: 0; }
/* Селект фокуса на лабу в тулбаре ведомости — по содержимому, не на всю ширину */
#lab-focus { width: auto; min-width: 11rem; }
.input-lab-focus { width: auto; min-width: 11rem; }
.input-score { width: 4.5rem; }
.inline-form .input-score, input[type="number"].input-score { width: 4.5rem; min-width: 4.5rem; flex: 0 0 auto; }
@@ -480,7 +481,7 @@ dialog.dlg.dlg-lg .dlg-body { max-height: 88vh; min-height: 62vh; }
/* Материалы: ряды и ручки перетаскивания слева, одним столбцом */
.sort-row { display: flex; align-items: center; gap: 0.5rem; min-width: 0; }
.sort-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sort-actions { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.sort-actions { margin-left: auto; display: flex; flex-wrap: nowrap; align-items: center; gap: 0.35rem; }
.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; }
@@ -735,8 +736,8 @@ th.th-filterable { padding-bottom: 0.35rem; }
/* Материалы на мобильных: действия переносятся под заголовок */
@media (max-width: 720px) {
.sort-row, .sort-list > li { flex-wrap: wrap; row-gap: 0.35rem; }
.sort-row .sort-actions, .sort-list > li .sort-actions { margin-left: 2.4rem; width: calc(100% - 2.4rem); justify-content: flex-start; }
.sort-row .sort-title { flex: 1 1 auto; }
.sort-row .sort-actions, .sort-list > li .sort-actions { margin-left: auto; flex-wrap: nowrap; justify-content: flex-end; }
.sort-row .sort-title, .sort-list > li .sort-title { flex: 1 1 auto; }
}