fabio286
/
antares
mirror of https://github.com/Fabio286/antares.git
1
1
Fork 0
Code Issues Releases Wiki Activity

fix: missing accent color change

This commit is contained in:
Fabio Di Stasio 2024-05-02 18:00:07 +02:00
parent 9bcd874e80
commit 09c274a724
2 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/renderer/components/TheFooter.vue
View File

@ -1,8 +1,8 @@
<template>
<div
id="footer"
:class="[lightColors.includes(footerColor) ? 'text-dark' : 'text-light']"
:style="`background-color: ${footerColor};`"
:class="[lightColors.includes(accentColor) ? 'text-dark' : 'text-light']"
:style="`background-color: ${accentColor};`"
>
<div class="footer-left-elements">
<ul class="footer-elements">
@ -118,7 +118,7 @@ const { getWorkspace } = workspacesStore;
const { getConnectionFolder, getConnectionByUid } = connectionsStore;
const workspace = computed(() => getWorkspace(workspaceUid.value));
const footerColor = computed(() => {
const accentColor = computed(() => {
if (getConnectionFolder(workspaceUid.value)?.color)
return getConnectionFolder(workspaceUid.value).color;
return '#E36929';
@ -134,12 +134,17 @@ const versionString = computed(() => {
return '';
});
watch(footerColor, () => {
document.querySelector<HTMLBodyElement>(':root').style.setProperty('--primary-color', footerColor.value);
document.querySelector<HTMLBodyElement>(':root').style.setProperty('--primary-color-shadow', hexToRGBA(footerColor.value, 0.2));
watch(accentColor, () => {
changeAccentColor();
});
const openOutside = (link: string) => shell.openExternal(link);
const changeAccentColor = () => {
document.querySelector<HTMLBodyElement>(':root').style.setProperty('--primary-color', accentColor.value);
document.querySelector<HTMLBodyElement>(':root').style.setProperty('--primary-color-shadow', hexToRGBA(accentColor.value, 0.2));
};
changeAccentColor();
</script>
<style lang="scss">

12
src/renderer/scss/main.scss
View File

@ -24,6 +24,10 @@ body {
a {
color: var(--primary-color);
&:hover {
color: var(--primary-color-dark)
}
}
::selection,
@ -199,6 +203,14 @@ option:checked {
animation: rotation 0.8s infinite linear;
}
.loading {
&::after {
border: 0.1rem solid var(--primary-color);
border-right-color: transparent;
border-top-color: transparent;
}
}
/* Override */
.modal {
.modal-container,