Client - update icon for ligth theme mode
This commit is contained in:
parent
82d7001e15
commit
6be93dae12
@ -83,8 +83,15 @@
|
|||||||
:title="$t('user.TOGGLE_THEME')"
|
:title="$t('user.TOGGLE_THEME')"
|
||||||
>
|
>
|
||||||
<i
|
<i
|
||||||
class="fa nav-button-fa"
|
v-if="darkTheme"
|
||||||
:class="themeIcon"
|
class="fa nav-button-fa fa-moon"
|
||||||
|
aria-hidden="true"
|
||||||
|
/>
|
||||||
|
<img
|
||||||
|
v-else
|
||||||
|
class="clear-theme"
|
||||||
|
src="/img/weather/clear-day.svg"
|
||||||
|
alt=""
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
/>
|
/>
|
||||||
<span class="nav-button-text">{{ $t('user.TOGGLE_THEME') }}</span>
|
<span class="nav-button-text">{{ $t('user.TOGGLE_THEME') }}</span>
|
||||||
@ -137,9 +144,6 @@
|
|||||||
() => store.getters[ROOT_STORE.GETTERS.DARK_MODE]
|
() => store.getters[ROOT_STORE.GETTERS.DARK_MODE]
|
||||||
)
|
)
|
||||||
const darkTheme: ComputedRef<boolean> = computed(() => getDarkTheme())
|
const darkTheme: ComputedRef<boolean> = computed(() => getDarkTheme())
|
||||||
const themeIcon: ComputedRef<string> = computed(() =>
|
|
||||||
darkTheme.value ? 'fa-moon' : 'fa-sun'
|
|
||||||
)
|
|
||||||
|
|
||||||
onBeforeMount(() => setTheme())
|
onBeforeMount(() => setTheme())
|
||||||
|
|
||||||
@ -311,6 +315,12 @@
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.clear-theme {
|
||||||
|
filter: var(--workout-img-color);
|
||||||
|
height: 20px;
|
||||||
|
margin-bottom: -5px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: $medium-limit) {
|
@media screen and (max-width: $medium-limit) {
|
||||||
|
Loading…
Reference in New Issue
Block a user