MokoConsulting/MokoOnyx
1
0
Fork 0
Code Issues 5 Pull Requests 1 Releases 5 Wiki Activity

feat(offline): header background on offline page + fix header ::before stacking #174

Merged
jmiller merged 4 commits from feature/offline-header-background into dev 2026-07-18 23:48:08 +00:00
Conversation 0 Commits 4 Files Changed 11
+47 -130
jmiller commented 2026-07-18 21:51:50 +00:00
Owner
Copy Link
Copy Source

⚠️ HOLD — for review & client-side testing, do not merge yet

Offline page inherits header background

  • .moko-offline-wrap now consumes the full --header-background-* set (color, image, size, repeat, position, attachment, opacity, filter).
  • Image moved to .moko-offline-wrap::before so --header-background-opacity / --header-background-filter fade the image only, not the offline card/content.
  • Dark-theme darkening overlay moved from ::before → ::after (image z-index 0 < overlay z-index 1 < content z-index 2).
  • Full inheritance chosen: offline mirrors the header (#dfdfdf/#1a1f2b backdrop, 0.35 opacity, dark invert).

Fix: header/offline background image not painting

  • The .container-header::before header image (z-index:-1) could fail to paint when the header didn't reliably form its own stacking context, letting the negative-z-index layer fall behind an ancestor.
  • Added isolation: isolate to .container-header and .moko-offline-wrap to guarantee a self-contained stacking context.
  • Note: the header repaint fix touches code already released in v02.31.00 — flagged for review.

Cleanup

  • Removed unused bg.svg (superseded by header-background.svg) and hero.jpg (unreferenced).

Testing checklist

  • Header background image paints in light and dark (sticky and static)
  • Offline page shows background image + card readable in both themes
  • Dark offline overlay darkens correctly; card backdrop-blur intact
## ⚠️ HOLD — for review & client-side testing, do not merge yet ### Offline page inherits header background - `.moko-offline-wrap` now consumes the full `--header-background-*` set (color, image, size, repeat, position, attachment, opacity, filter). - Image moved to `.moko-offline-wrap::before` so `--header-background-opacity` / `--header-background-filter` fade the **image only**, not the offline card/content. - Dark-theme darkening overlay moved from `::before` → `::after` (image z-index 0 < overlay z-index 1 < content z-index 2). - Full inheritance chosen: offline mirrors the header (#dfdfdf/#1a1f2b backdrop, 0.35 opacity, dark invert). ### Fix: header/offline background image not painting - The `.container-header::before` header image (z-index:-1) could fail to paint when the header didn't reliably form its own stacking context, letting the negative-z-index layer fall behind an ancestor. - Added `isolation: isolate` to `.container-header` **and** `.moko-offline-wrap` to guarantee a self-contained stacking context. - **Note:** the header repaint fix touches code already released in v02.31.00 — flagged for review. ### Cleanup - Removed unused `bg.svg` (superseded by `header-background.svg`) and `hero.jpg` (unreferenced). ### Testing checklist - [ ] Header background image paints in light and dark (sticky and static) - [ ] Offline page shows background image + card readable in both themes - [ ] Dark offline overlay darkens correctly; card backdrop-blur intact
jmiller marked the pull request as work in progress 2026-07-18 21:52:40 +00:00
jmiller marked the pull request as ready for review 2026-07-18 23:46:12 +00:00
jmiller added 3 commits 2026-07-18 23:47:40 +00:00
feat(offline): apply header background variables to offline page b221777f43 
Offline wrap now consumes the full --header-background-* set (color, image, size, repeat, position, attachment, opacity, filter). Image moved to .moko-offline-wrap::before so opacity/filter fade the image only; dark overlay moved to ::after; content lifted above both layers.
chore: remove unused bg.svg and hero.jpg images 1b6be8827a 
bg.svg superseded by header-background.svg (no remaining references); hero.jpg unreferenced.
fix(template): isolate header/offline stacking so background image paints
Universal: Auto Version Bump / Version Bump (push) Successful in 20s
Details
Universal: PR Check / Branch Policy (pull_request) Successful in 2s
Details
Generic: Project CI / Lint & Validate (pull_request) Successful in 18s
Details
Universal: PR Check / Secret Scan (pull_request) Successful in 7s
Details
Joomla: Metadata Validation / Validate Joomla Metadata (pull_request) Failing after 9s
Details
Universal: PR Check / Validate PR (pull_request) Failing after 21s
Details
Generic: Project CI / Tests (pull_request) Has been cancelled
Details
Universal: PR Check / Build RC Package (pull_request) Has been cancelled
Details
Universal: PR Check / Report Issues (pull_request) Has been cancelled
Details
a824f3761a 
The .container-header::before (z-index:-1) header image could fail to paint when the header did not reliably form its own stacking context, letting the negative-z-index layer fall behind an ancestor. Add isolation:isolate to .container-header and .moko-offline-wrap to guarantee a self-contained stacking context.
jmiller force-pushed feature/offline-header-background from 6eadb817e5 to a824f3761a 2026-07-18 23:47:40 +00:00 Compare
jmiller added 1 commit 2026-07-18 23:48:01 +00:00
chore(version): auto-bump patch 02.31.02-dev [skip ci]
Branch Cleanup / Delete merged branch (pull_request) Successful in 2s
Details
RC Revert / Rename rc/ back to dev/ (pull_request) Has been skipped
Details
98494d3dc9
jmiller merged commit f5c5f8e9aa into dev 2026-07-18 23:48:08 +00:00
jmiller deleted branch feature/offline-header-background 2026-07-18 23:48:09 +00:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
Clear labels
automation
Automated processes or scripts
 breaking-change
Breaking API or functionality change
 build
Build system changes
 ci-cd
CI/CD pipeline changes
 config
Configuration file changes
 css
CSS/styling changes
 dependencies
Dependency updates
 deploy-failure
Automated deploy failure tracking
 docker
Docker configuration changes
 documentation
Documentation changes
 dolibarr
Dolibarr module or extension
 generic
Generic project or library
 good first issue
Good for newcomers
 health-check
Repository health check results
 health: excellent
Health score 90-100
 health: fair
Health score 50-69
 health: good
Health score 70-89
 health: poor
Health score below 50
 help wanted
Extra attention needed
 html
HTML template changes
 javascript
JavaScript code changes
 joomla
Joomla extension or component
 major-release
Major version release
 minor-release
Minor version release
 mokostandards
MokoStandards compliance
 needs-review
Awaiting code review
 patch-release
Patch version release
 php
PHP code changes
 push-failure
File push failure requiring attention
 python
Python code changes
 release-candidate
Release candidate build
 security
Security-related changes
 size/l
Large change (101-300 lines)
 size/m
Medium change (31-100 lines)
 size/s
Small change (11-30 lines)
 size/xl
Extra large change (301-1000 lines)
 size/xs
Extra small change (1-10 lines)
 size/xxl
Extremely large change (1000+ lines)
 standards-drift
Repository drifted from MokoStandards
 standards-update
MokoStandards sync update
 sync-failure
Bulk sync failure requiring attention
 sync-report
Bulk sync run report
 template-validation-failure
Template workflow validation failure
 tests
Test suite changes
 type: bug
Something isn't working
 type: chore
Maintenance tasks
 type: enhancement
Enhancement to existing feature
 type: feature
New feature or request
 type: refactor
Code refactoring
 type: version
Version-related change
 typescript
TypeScript code changes
 version
Version bump or release
 version-drift
Version mismatch detected
 work-in-progress
Work in progress, not ready for merge
bug
Something is not working
 duplicate
This issue or pull request already exists
 enhancement
New feature
 help wanted
Need some help
 invalid
Something is wrong
 question
More information is needed
 wontfix
This won't be fixed
No labels
Priority -
Type -
Milestone
No items
No Milestone
Assignees
Clear assignees
jmiller (Jonathan Miller)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: MokoConsulting/MokoOnyx#174
Delete Branch "feature/offline-header-background"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?