web: fix text colour on initial load when not in dark mode

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-04-12 12:25:38 +02:00
parent ab7941922f
commit cd1b0c67ea
5 changed files with 7 additions and 4 deletions

View File

@ -10,7 +10,7 @@
{% block body %} {% block body %}
<ak-message-container></ak-message-container> <ak-message-container></ak-message-container>
<ak-interface-admin> <ak-interface-admin>
<section class="pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl"> <section class="ak-initial-load pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
<div class="pf-c-empty-state" style="height: 100vh;"> <div class="pf-c-empty-state" style="height: 100vh;">
<div class="pf-c-empty-state__content"> <div class="pf-c-empty-state__content">
<span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="{% trans 'Loading...' %}"> <span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="{% trans 'Loading...' %}">

View File

@ -10,7 +10,7 @@
{% block body %} {% block body %}
<ak-message-container></ak-message-container> <ak-message-container></ak-message-container>
<ak-flow-executor> <ak-flow-executor>
<section class="pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl"> <section class="ak-initial-load pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
<div class="pf-c-empty-state" style="height: 100vh;"> <div class="pf-c-empty-state" style="height: 100vh;">
<div class="pf-c-empty-state__content"> <div class="pf-c-empty-state__content">
<span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="{% trans 'Loading...' %}"> <span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="{% trans 'Loading...' %}">

View File

@ -97,6 +97,9 @@ html > form > input {
body { body {
background-color: var(--ak-dark-background) !important; background-color: var(--ak-dark-background) !important;
} }
.ak-initial-load h1 {
color: var(--ak-dark-foreground);
}
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {

View File

@ -18,7 +18,7 @@
<body> <body>
<ak-message-container></ak-message-container> <ak-message-container></ak-message-container>
<ak-interface-admin> <ak-interface-admin>
<section class="pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl"> <section class="ak-initial-load pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
<div class="pf-c-empty-state" style="height: 100vh;"> <div class="pf-c-empty-state" style="height: 100vh;">
<div class="pf-c-empty-state__content"> <div class="pf-c-empty-state__content">
<span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="Loading..."> <span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="Loading...">

View File

@ -18,7 +18,7 @@
<body> <body>
<ak-message-container></ak-message-container> <ak-message-container></ak-message-container>
<ak-flow-executor> <ak-flow-executor>
<section class="pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl"> <section class="ak-initial-load pf-c-page__main-section pf-m-no-padding-mobile pf-m-xl">
<div class="pf-c-empty-state" style="height: 100vh;"> <div class="pf-c-empty-state" style="height: 100vh;">
<div class="pf-c-empty-state__content"> <div class="pf-c-empty-state__content">
<span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="Loading..."> <span class="pf-c-spinner pf-m-xl pf-c-empty-state__icon" role="progressbar" aria-valuetext="Loading...">