correct theme style at settings page
This commit is contained in:
parent
aa741c5a90
commit
0ec4954ec5
@ -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;
|
||||
}
|
||||
|
@ -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);
|
||||
}
|
||||
|
@ -1,7 +1,13 @@
|
||||
class GlobalInfos {
|
||||
#darktheme = false;
|
||||
|
||||
isDarkTheme() {
|
||||
return true;
|
||||
return this.#darktheme;
|
||||
};
|
||||
|
||||
enableDarkTheme(enable = true){
|
||||
this.#darktheme = enable;
|
||||
}
|
||||
}
|
||||
|
||||
const StaticInfos = new GlobalInfos();
|
||||
|
@ -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();
|
||||
|
@ -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 {
|
||||
|
Loading…
Reference in New Issue
Block a user