Работа над ночным режимом

This commit is contained in:
Book Pauk
2023-01-11 14:33:16 +07:00
parent bf4f5bc88b
commit a89572f85f
2 changed files with 39 additions and 11 deletions

View File

@@ -53,6 +53,9 @@ class App {
'--bg-loader-color', '--bg-input-color', '--bg-btn-color1',
'--bg-header-color1', '--bg-header-color2', '--bg-header-color3',
'--bg-menu-color1', '--bg-menu-color2', '--text-menu-color',
'--text-tb-normal', '--bg-tb-normal', '--bg-tb-hover',
'--text-tb-active', '--bg-tb-active', '--bg-tb-active-hover',
'--text-tb-disabled', '--bg-tb-disabled',
];
let root = document.querySelector(':root');
@@ -235,6 +238,15 @@ export default vueComponent(App);
--bg-menu-color2: #e0e0e0;
--text-menu-color: #757575;
--text-tb-normal: #3e843e;
--bg-tb-normal: #e6edf4;
--bg-tb-hover: #fff;
--text-tb-active: #fff;
--bg-tb-active: #8ab45f;
--bg-tb-active-hover: #81c581;
--text-tb-disabled: #d3d3d3;
--bg-tb-disabled: #808080;
/* light */
--bg-app-color-light: #fff;
--text-app-color-light: #000;
@@ -249,6 +261,15 @@ export default vueComponent(App);
--bg-menu-color2-light: #e0e0e0;
--text-menu-color-light: #757575;
--text-tb-normal-light: #3e843e;
--bg-tb-normal-light: #e6edf4;
--bg-tb-hover-light: #fff;
--text-tb-active-light: #fff;
--bg-tb-active-light: #8ab45f;
--bg-tb-active-hover-light: #81c581;
--text-tb-disabled-light: #d3d3d3;
--bg-tb-disabled-light: #808080;
/* dark */
--bg-app-color-dark: #222;
--text-app-color-dark: #ccc;
@@ -263,6 +284,14 @@ export default vueComponent(App);
--bg-menu-color2-dark: #424242;
--text-menu-color-dark: #858585;
--text-tb-normal-dark: #3e843e;
--bg-tb-normal-dark: #c6cde4;
--bg-tb-hover-dark: #ddd;
--text-tb-active-dark: #ddd;
--bg-tb-active-dark: #7aa44f;
--bg-tb-active-hover-dark: #71b571;
--text-tb-disabled-dark: #d3d3d3;
--bg-tb-disabled-dark: #808080;
}
a {

View File

@@ -1704,8 +1704,8 @@ export default vueComponent(Reader);
.tool-button {
margin: 0px 2px 7px 2px;
padding: 0;
color: #3E843E;
background-color: #E6EDF4;
color: var(--text-tb-normal);
background-color: var(--bg-tb-normal);
min-height: 38px;
min-width: 38px;
height: 38px;
@@ -1717,34 +1717,33 @@ export default vueComponent(Reader);
}
.tool-button:hover {
background-color: white;
background-color: var(--bg-tb-hover);
cursor: pointer;
}
.tool-button-active {
box-shadow: 0 0 0;
color: white;
background-color: #8AB45F;
color: var(--text-tb-active);
background-color: var(--bg-tb-active);
position: relative;
top: 1px;
left: 1px;
}
.tool-button-active:hover {
color: white;
background-color: #81C581;
background-color: var(--bg-tb-active-hover);
cursor: pointer;
}
.tool-button-disabled {
color: lightgray;
background-color: gray;
color: var(--text-tb-disabled);
background-color: var(--bg-tb-disabled);
cursor: default;
}
.tool-button-disabled:hover {
color: lightgray;
background-color: gray;
color: var(--text-tb-disabled);
background-color: var(--bg-tb-disabled);
cursor: default;
}