correct theme style at settings page

This commit is contained in:
lukas 2020-07-27 21:14:56 +02:00
parent aa741c5a90
commit 0ec4954ec5
5 changed files with 34 additions and 5 deletions

View File

@ -1,3 +1,7 @@
/**
* The coloring elements for dark theme
*/
.backgroundcolor{
background-color: #141520;
}
@ -6,6 +10,10 @@
color: white;
}
.subtextcolor{
color: #dedad6;
}
.navitem::after {
background: white;
}

View File

@ -1,3 +1,7 @@
/**
* The coloring elements for light theme
*/
.navitem::after {
background: black;
}
@ -10,6 +14,10 @@
color: black;
}
.subtextcolor {
color: #212529;
}
.hrcolor {
border-color: rgba(0, 0, 0, 0.1);
}

View File

@ -1,7 +1,13 @@
class GlobalInfos {
#darktheme = false;
isDarkTheme() {
return true;
return this.#darktheme;
};
enableDarkTheme(enable = true){
this.#darktheme = enable;
}
}
const StaticInfos = new GlobalInfos();

View File

@ -1,6 +1,9 @@
import React from "react";
import {Button, Col, Form} from "react-bootstrap";
import style from "./GeneralSettings.module.css"
import StaticInfos from "../../GlobalInfos";
import darktheme from "../../AppDarkTheme.module.css";
import lighttheme from "../../AppLightTheme.module.css";
class GeneralSettings extends React.Component {
constructor(props) {
@ -37,9 +40,10 @@ class GeneralSettings extends React.Component {
}
render() {
const themeStyle = StaticInfos.isDarkTheme() ? darktheme : lighttheme;
return (
<>
<div className={style.GeneralForm}>
<div className={style.GeneralForm + ' ' + themeStyle.subtextcolor}>
<Form data-testid='mainformsettings' onSubmit={(e) => {
e.preventDefault();
this.saveSettings();

View File

@ -3,8 +3,11 @@
float: left;
width: 10%;
background-color: #d3dcef;
min-height: calc(100vh - 56px);
min-height: calc(100vh - 62px);
min-width: 110px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
.SettingsSidebarTitle {