Variable BRAND_OVERLAY_PREPAINT_SCRIPTConst
BRAND_OVERLAY_PREPAINT_SCRIPT: "(function () {\n try {\n var id = localStorage.getItem('mj-theme-overlay');\n var raw = id && localStorage.getItem('mj-theme-overlay-css');\n if (!id || !raw) return;\n var entry = JSON.parse(raw);\n if (!entry || entry.id !== id || typeof entry.css !== 'string') return;\n if (document.querySelector('style[data-mj-brand-overlay-preload]')) return;\n var style = document.createElement('style');\n style.setAttribute('data-mj-brand-overlay-preload', id);\n style.textContent = entry.css;\n document.head.appendChild(style);\n document.documentElement.setAttribute('data-theme-overlay', id);\n } catch (e) { /* fail open: the stock frame paints, bootstrap brands it later */ }\n})();" = ...
The inline pre-paint snippet for the org brand overlay — paste it, wrapped in a
<script>, at the TOP of the host'sindex.html<body>, before the app's root element. Not<head>: the snippet appends its<style>to the end of<head>, and it has to land after the app stylesheet link to win the cascade (the overlay's[data-theme-overlay]selectors tie the compiled:roottokens on specificity, so source order decides); Angular injects that link just before</head>, so from<head>the snippet always runs first and loses. It re-injects the overlay CSS that ThemeService.ApplyBrandOverlay persisted, so the static frame BEFORE the Angular bundle boots already carries the brand. Everything Angular renders is covered by ThemeService.RestorePersistedBrandOverlay (explorer-app calls it in its constructor); this snippet covers the one frame that runs before any package code can.Exported as a string so hosts carry a versioned copy rather than a hand-written one, and so the reference host's copy can be pinned by a test. Dependency-free by necessity, fails open, and shares the storage keys and the marker attribute with the service, so the two are idempotent and bootstrap's real stylesheet replaces either.