Promote offcanvas variables to :root theme files and document in CSS Variables tab

- Move --offcanvas-* definitions from component-scoped .offcanvas selector in
  template.css into :root[data-bs-theme] blocks in light.standard.css and
  dark.standard.css so they are overridable via user.css at root level
- Fix two bugs in the old definitions: --offcanvas-bg was incorrectly set to
  var(--body-color) (text colour); corrected to var(--body-bg); and
  --offcanvas-color had a spurious 'color:' prefix
- Dark theme uses a heavier box-shadow (0.3 alpha) for better depth perception
- Add css_vars_offcanvas field to templateDetails.xml CSS Variables tab
- Add en-US and en-GB language strings for the new Offcanvas Panel section
- Rebuild all .min CSS files

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-17 22:54:55 -05:00
parent 63c88ede64
commit b043ccc099
9 changed files with 35 additions and 13 deletions

View File

@@ -532,6 +532,18 @@ color-scheme: light;
--hero-overlay-padding: 1em;
--hero-overlay-text-align: center;
--hero-overlay-text-color: var(--body-color);
/* ===== OFFCANVAS ===== */
--offcanvas-zindex: 1045;
--offcanvas-width: 400px;
--offcanvas-height: 30vh;
--offcanvas-padding-x: 1rem;
--offcanvas-padding-y: 1rem;
--offcanvas-color: var(--body-color);
--offcanvas-bg: var(--body-bg);
--offcanvas-border-width: 1px;
--offcanvas-border-color: var(--border-color-translucent);
--offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.btn {