Журнал изменений

Follow-up to the semantic HTML commit: switches section labelling from aria-labelledby + IDs to plain aria-label, removes the now-redundant id="upper" from the wordmark anchor, and collapses the double-div foot-menu wrapper now that the CSS handles full-bleed directly.

Core changes:

1. app.html / home.html:

2. section#demo-line: aria-labelledby → aria-label; drop id="demo-line-title" from h2 (ID was only needed for the labelledby reference)

3. footer .sl-upper-wordmark: remove id="upper" (CSS now targets .sl-upper-wordmark)
4. section Технологии / Контакты: aria-labelledby → aria-label; drop IDs from h2

5. Remove div#foot-menu + inner div.sl-wrp wrapper; nav.sl-fmenu is now a direct child of footer via div.sl-wrp.sl-clrfix (full-bleed handled in CSS)

Benefits: - Cleaner HTML: fewer IDs, shallower nesting in the footer - ARIA labels still present; labelledby pattern not needed when label text is static

Replaces all hardcoded hex values in theme.css with semantic CSS variables, declared in a new canonical color palette in base.css. Establishes a single source of truth for the lite theme's color system, making future theming and dark-mode preparation trivial.

Core changes:

1. base.css:

2. Add 31 canonical color-role variables (--sl-color-bg, --sl-color-surface, --sl-color-brand, --sl-color-text-muted, --sl-color-on-dark, etc.)

3. Add 3 shadow tokens (--sl-shadow-soft, --sl-shadow-medium, --sl-shadow-strong)
4. theme.css:
5. Replace every hardcoded #hex with the matching --sl-color- or --sl-shadow- token
6. Rename #upper ID selector → .sl-upper-wordmark class selector (matches HTML)

7. Merge #foot-menu rule into #footbox > .sl-wrp.sl-clrfix with full-bleed background trick (100vw + negative margin) to eliminate the wrapper div

8. Remove duplicate background-color declaration in .sl-site-link
9. Fix tab-indented active-tab selectors to flush indentation
10. docs/LITE_THEME_CSS_SIMPLIFICATION_PROMPT.md:
11. Add prompt document that captured the CSS simplification requirements

Benefits: - Zero hardcoded colors remain in theme.css; all values resolve through tokens - Shadow values unified via token; border-radius tokens already in place - Full-bleed footer menu background achieved without extra wrapper div

Upgrades the lite template layout to use meaningful HTML5 sectioning elements throughout header, footer, demo strip and navigation, improving document outline, accessibility and machine-readability. CSS selectors updated and minor property fixes applied in sync.

Core changes:

1. app.html / home.html (layouts):

2. div#hmenu → nav#hmenu with aria-label="Главное меню" * form.sl-search-form gains role="search"

3. div#demo-line → section#demo-line aria-labelledby="demo-line-title" * b.sl-demo-line-title → h2#demo-line-title (correct heading level)

4. div#footbox → footer#footbox; foot-menu moved inside it * nested footer.sl-grid → section.sl-grid aria-label="SLAED CMS" * div.sl-grid (Технологии) → section aria-labelledby + h2 * div.sl-grid (Контакты) → section aria-labelledby + h2 * ul.sl-block-contact wrapped in address * nav.sl-fmenu gets aria-label="Нижнее меню" * protocol-relative URL //slaed.net → https://slaed.net

5. menu.html (partial):
6. nav#topmenu → div#topmenu (already inside nav#hmenu; avoids nested nav)
7. theme.css:
8. #demo-line: add background-position/repeat/size defaults
9. .demo-line-title: add font-weight:700; margin shorthand
10. .sl-list-item > li: margin-top → margin-bottom
11. #footbox: padding shorthand; address { font-style:normal }
12. .sl-f-title: margin shorthand
13. Responsive: update #footbox selectors to .sl-wrp > .sl-grid:first-child
14. Mobile: add overflow/ellipsis rules for .sl-list-item inside #footbox

Benefits: - Proper document outline with h2 headings in demo-line and footer sections - Screen-reader landmarks: nav, footer, section, address, role="search" - CSS remains in sync with the restructured DOM; no visual regressions

Replaced plain-text author/date line in forum teaser items with a structured meta row using Bootstrap Icons, visually-hidden labels and dedicated CSS classes for accessibility and visual consistency.

Core changes:

1. Fragment (forum-teaser-item.html):
2. Replaced bare span with sl-forum-meta / sl-forum-meta-item structure
3. Added bi-person-circle and bi-clock-history icons with aria-hidden
4. Added sl-visually-hidden labels for screen readers
5. Controller (index.php):
6. Split when into when_label (_DATE) and when (formatted time only)
7. Styles (theme.css):
8. Added sl-forum-meta, sl-forum-meta-item, sl-forum-meta-icon classes
9. Added sl-visually-hidden utility
10. Minor fixes: contacts padding, partners margin, demo-line float

Benefits: - Accessible icon-based meta row with screen-reader fallbacks - Reusable CSS utilities aligned with sl-* naming convention

Decoupled debug output from the foot-controls partial by passing it directly as a layout variable, so each layout controls its own placement without bloating the generic foot-controls partial.

Core changes:

1. Backend (core/system.php):
2. Removed $debug from getFootControls() call
3. Added debug_html to the layout variable map
4. Partial (foot-controls.html):
5. Removed debug_html block (no longer responsible for it)
6. Reordered: license before time
7. Layouts (app.html, home.html, main.html):
8. Added conditional debug_html block at page bottom

Benefits: - Cleaner separation of concerns between partial and layout - Debug block is layout-controlled, not buried in a partial

Converted magistralb-wf and magistralr-wf from WOFF to WOFF2 using fonttools with glyph bounding-box recalculation to eliminate browser warnings. Removed obsolete EOT, TTF, SVG and WOFF fallbacks.

Core changes:

1. Font files (templates/lite/assets/css/fonts/):
2. Added magistralb-wf.woff2 and magistralr-wf.woff2 (bboxes fixed)
3. Deleted magistral.woff, magistral.svg (no longer needed)
4. Font declarations (base.css):
5. Replaced multi-format src stack with single WOFF2 src
6. Removed dead references to EOT, TTF, SVG files

Benefits: - Eliminates "glyph bbox was incorrect" browser warnings on cold load - Smaller file size (~18 % reduction vs WOFF) - Simpler, future-proof @font-face declarations

Technical notes: - WOFF2 support: >97 % of browsers, no fallback required - Conversion: WOFF → TTF (custom Node script) → fonttools recalcBounds → WOFF2

Replace generic .sl-but-login, .sl-but-primary and .sl-dropdown-* selectors with scoped semantic names (.sl-login-top--head, .sl-login-toggle, .sl-login-profile, .sl-login-avatar, .sl-login-dropdown-form) and extract all magic numbers into CSS custom properties under :root in base.css.

Core changes:

1. CSS variables for login section (base.css):

2. Add 30 --sl-login-* custom properties for colors, sizes, padths, and layout * Colors: --sl-login-link-color, --sl-login-pill-bg, --sl-login-avatar-border-color * Layout: --sl-login-dropdown-width, --sl-login-field-width, --sl-login-avatar-size

3. Login CSS refactoring (theme.css):
4. Rename .sl-login-top → .sl-login-top--head for header context
5. Replace .sl-dropdown-form with .sl-login-dropdown-form (fully self-contained)
6. Replace .sl-ava-min / .ava-min with .sl-login-avatar (variable-driven)
7. Responsive overrides use CSS variable overrides instead of property repetition
8. Adjust #header padding: 36px → 24px; #container padding: 50px → 24px
9. Template updates (button.html, link.html, list.html, block-user-info.html, login-nav.html):
10. is_login_submit → class sl-login-submit (no longer inherits button gradients)
11. is_login_button → sl-login-link sl-login-link-top
12. is_login_profile → sl-login-profile (pill bg applied via CSS, not button base)
13. is_login_avatar → sl-login-avatar
14. login-nav.html: inline form fields and hidden inputs, remove fragment indirection
15. Fix typo: is_sl-logged → is_logged in list.html condition
16. Add .sl-login-top--block modifier to block-user-info.html

Benefits: - Semantic class names make intent clear without reading CSS - CSS variables allow responsive breakpoint overrides via single rule block - Reduced coupling: login styles no longer depend on button base classes

Technical notes: - .sl-login-top class retained for backward compatibility in non-head contexts - Old .sl-ava-min, .ava-min selectors removed (replaced by .sl-login-avatar) - .sl-but-login selector removed from shared inline-flex group

Migrates layout dimensions (container, sidebar, gutter, content width) to CSS variables, consolidates circular button styling into a reusable .sl-circle-action component, and replaces the legacy home-icon sprite with a Bootstrap Icon in the nav menu.

Core changes:

1. Layout token system (base.css, theme.css):

2. Add --sl-container, --sl-sidebar, --sl-gutter, --sl-content to :root * Sidebar, container padding and #sidebar margins now reference these tokens * .sl-fullview children constrained to --sl-content max-width

3. Add --sl-size- and --sl-icon-size- / --sl-control-size scale tokens * Used by .sl-circle-action, nav controls and contact icon

4. .sl-circle-action component (theme.css):

5. New shared class for all circular action buttons (social, nav, search) * Replaces per-selector sizing on .sl-top-social .sl-thd * Hover gloss applied via .sl-circle-action:hover rule

6. .sl-search-form replaces #qSearch id; search button now icon-only with aria-label
7. Nav menu home link (menu.html, theme.css):

8. Replace .sl-ico.sl-i-home CSS sprite with bi-house-door-fill Bootstrap Icon * New class .sl-home-link.sl-circle-action with hover color inversion

9. #topmenu > ul > li > a uses --sl-nav-control-size for height/line-height/border-radius
10. Social link semantics (app.html, home.html):
11. rel="nofollow" → rel="me noopener"; RSS link gets rel="alternate" type="application/rss+xml"
12. Added aria-label on all social anchors and search button
13. "Мы в Twitter" title corrected to "Мы в X"

Benefits: - Single source of truth for sidebar/gutter dimensions — one token change resizes the layout - .sl-circle-action eliminates duplicated sizing rules across social, search, and nav controls - Improved accessibility via aria-label on icon-only interactive elements

Technical notes: - .sl-thd class retained on social anchors for backward compatibility with JS hooks - min() replaces width+max-width pair for .sl-wrp at all responsive breakpoints - 560px breakpoint gains d-pane, footer grid, partners, and marquee responsive fixes

Remove the legacy String.prototype.AddMail JS method (email is now a plain mailto: link). Replace setTimeout string-eval in FlyBasket with a proper closure. Update site_logo to wordmark variant and rotate sitekey. Add is_account_button: true to register_link so the template renders it with the neutral button style.

Core changes:

1. global-func.js:
2. Remove String.prototype.AddMail (anti-spam obfuscation no longer needed)
3. Replace setTimeout('FlyBasket("'+productId+'")', 10) with closure form
4. config/global.php:
5. site_logo: mark → wordmark SVG variant
6. sitekey: rotated to new value
7. core/system.php (setHead):

8. register_link: add 'is_account_button' => true so button.html/link.html renders it with sl-but-neutral class

Replace color-literal class names with their semantic equivalents as defined by the new CSS button system. Also update login-button markup to use sl-but-primary directly instead of the legacy sl-ico sl-login-btn approach, and map is_footer_button to sl-but-warning.

Mapping: sl-but → sl-but-neutral sl-but-blue → sl-but-primary sl-but-green → sl-but-success sl-but-red → sl-but-danger sl-but-back → sl-but-accent sl-but-foot → sl-but-warning sl-ico sl-login-btn → sl-but-primary sl-login-btn (profile) → sl-but-login sl-but-primary

Core changes:

1. Fragments (button.html, link.html, span.html, inline-badge.html, comment-action-ajax.html, editor-action-menu.html, block-login-form.html, block-search-form.html):

2. Apply full rename mapping to all conditional class expressions

3. Partials (account-profile.html, block-user-info.html, login-nav.html, main-slider.html, toastui-upload-panel.html):

4. Apply rename mapping consistently

Benefits: - All templates now reference semantic class names only - Removes dependency on color-named CSS classes