Adjust loading screen color based on theme

This commit is contained in:
Martin Kleinschrodt 2021-10-09 17:23:05 +02:00
parent cce917af7e
commit ba2fe6f874
5 changed files with 9 additions and 12 deletions

View File

@ -203,6 +203,7 @@ body {
/* APP */
--backdrop-background: var(--color-background-darker);
--backdrop-color: var(--color-highlight);
/* LAYOUT */

View File

@ -193,7 +193,8 @@ export class App extends ServiceWorker(StateMixin(AutoSync(ErrorHandling(AutoLoc
.offline-indicator {
background: var(--color-negative);
color: var(--color-white);
color: var(--color-background);
--button-transparent-color: var(--color-background);
padding: var(--spacing);
text-align: center;
z-index: 100;

View File

@ -17,12 +17,12 @@
<style>
html,
body {
background: linear-gradient(rgb(89, 198, 255), rgb(7, 124, 185));
background: var(--backdrop-background);
color: var(--backdrop-color);
width: 100%;
height: 100%;
margin: 0;
overscroll-behavior: none;
color: #fff;
position: fixed;
}

View File

@ -8,17 +8,17 @@
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="apple-touch-icon" href="/assets/favicon.png">
<link rel="apple-touch-icon" href="/assets/favicon.png" />
<style>
html,
body {
background: linear-gradient(rgb(89, 198, 255), rgb(7, 124, 185));
background: var(--backdrop-background);
color: var(--backdrop-color);
width: 100%;
height: 100%;
margin: 0;
overscroll-behavior: none;
color: #fff;
position: fixed;
}
@ -61,7 +61,6 @@
rotate linear 1.2s infinite;
}
</style>
</head>
<body>
<svg viewBox="0 0 100 100" class="spinner">

View File

@ -62,11 +62,7 @@ module.exports = {
meta: {
"Content-Security-Policy": {
"http-equiv": "Content-Security-Policy",
content: `default-src 'self' ${serverUrl} ${
process.env.PL_BILLING_ENABLED ? "https://*.stripe.com" : ""
} blob:; style-src 'self' 'unsafe-inline'; object-src 'self' blob:; frame-src 'self' blob: ${
process.env.PL_BILLING_ENABLED ? "https://*.stripe.com" : ""
}; img-src 'self' blob: data:`,
content: `default-src 'self' ${serverUrl} blob:; style-src 'self' 'unsafe-inline'; object-src 'self' blob:; frame-src 'self'; img-src 'self' blob: data:`,
},
},
}),