1
0
mirror of https://github.com/amir20/dozzle.git synced 2025-12-24 06:28:42 +01:00

Updates themes to use vars (#541)

* Adds vars for themeing

* Uses correct color vars

* Adds more vars

* Adds other variables

* Use data attribute only

* Adds animation and unifies color

* Fixes tests

* Fixes search

* Adds docker ignore

* Fixes search text

* Fixes int tests

* Fixes int tests again
This commit is contained in:
Amir Raminfar
2020-06-27 14:32:34 -07:00
committed by GitHub
parent 3d68a8ddb0
commit 8fa672edd1
16 changed files with 153 additions and 160 deletions

View File

@@ -83,7 +83,7 @@ export default {
document.documentElement.classList.add("has-custom-scrollbars");
}
if (this.hasLightTheme) {
document.documentElement.classList.add("has-light-theme");
document.documentElement.setAttribute("data-theme", "light");
}
this.menuWidth = this.settings.menuWidth;
},
@@ -97,11 +97,11 @@ export default {
},
hasLightTheme(newValue, oldValue) {
if (newValue) {
document.documentElement.classList.add("has-light-theme");
document.documentElement.setAttribute("data-theme", "light");
} else {
document.documentElement.classList.remove("has-light-theme");
document.documentElement.removeAttribute("data-theme");
}
}
},
},
computed: {
...mapState(["activeContainers", "isMobile", "settings"]),
@@ -132,9 +132,9 @@ export default {
<style scoped lang="scss">
::v-deep .splitpanes--vertical > .splitpanes__splitter {
min-width: 3px;
background: #666;
background: var(--border-color);
&:hover {
background: rgb(255, 221, 87);
background: var(--border-hover-color);
}
}
@@ -159,18 +159,6 @@ export default {
&:hover {
left: -25px;
}
html.has-light-theme & {
background-color: #7d7d68;
}
}
}
</style>
<style lang="scss">
html.has-light-theme .splitpanes--vertical > .splitpanes__splitter {
background: #DCDCDC;
&:hover {
background: #d8f0ca;
}
}
</style>