Bootstrap persisted theme before hydration
This commit is contained in:
@@ -12,6 +12,8 @@
|
||||
<link rel="stylesheet" href="@Assets["lib/bootstrap/dist/css/bootstrap.min.css"]" />
|
||||
<link rel="stylesheet" href="@Assets["app.css"]" />
|
||||
<link rel="stylesheet" href="@Assets["RolemasterDb.App.styles.css"]" />
|
||||
<script src="@Assets["theme.js"]"></script>
|
||||
<script>window.rolemasterTheme?.init("rolemaster.theme.mode");</script>
|
||||
<ImportMap />
|
||||
<link rel="icon" type="image/png" href="favicon.png" />
|
||||
<HeadOutlet />
|
||||
@@ -20,7 +22,6 @@
|
||||
<body>
|
||||
<Routes @rendermode="InteractiveServer" />
|
||||
<ReconnectModal />
|
||||
<script src="@Assets["theme.js"]"></script>
|
||||
<script src="@Assets["tables.js"]"></script>
|
||||
<script src="@Assets["_framework/blazor.web.js"]"></script>
|
||||
</body>
|
||||
|
||||
@@ -1,5 +1,23 @@
|
||||
window.rolemasterTheme = {
|
||||
storageKey: "rolemaster.theme.mode",
|
||||
|
||||
apply(mode) {
|
||||
document.documentElement.dataset.theme = mode || "system";
|
||||
},
|
||||
|
||||
init(storageKey) {
|
||||
if (storageKey) {
|
||||
this.storageKey = storageKey;
|
||||
}
|
||||
|
||||
let mode = "system";
|
||||
|
||||
try {
|
||||
mode = localStorage.getItem(this.storageKey) || "system";
|
||||
} catch {
|
||||
mode = "system";
|
||||
}
|
||||
|
||||
this.apply(mode);
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user