Infra-Mirrors/ots
1
0
Fork 0
mirror of https://github.com/Luzifer/ots.git synced 2025-05-15 04:22:20 -04:00
Code Issues Projects Releases Packages Wiki Activity

feat: support auto theme mode (#212)

Browse source 
Co-authored-by: Mave <11227996+Ma-ve@users.noreply.github.com>
Co-authored-by: Knut Ahlers <knut@ahlers.me>
This commit is contained in:
Wesley 2025-05-01 00:08:32 +02:00 • committed by GitHub
parent 45184a496e
commit e7d1efc505
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 77 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

59
src/components/navbar.vue
View file

@ -56,19 +56,52 @@
</ul>
<form
v-if="!$root.customize.disableThemeSwitcher"
class="d-flex align-items-center"
class="d-flex align-items-center btn-group"
>
<i class="fas fa-sun me-2" />
<div class="form-check form-switch">
<input
id="themeswitch"
v-model="$root.darkTheme"
class="form-check-input"
type="checkbox"
role="switch"
>
</div>
<i class="fas fa-moon" />
<input
id="theme-light"
v-model="$root.theme"
type="radio"
name="theme"
class="btn-check"
value="light"
>
<label
class="btn btn-outline-secondary btn-sm"
for="theme-light"
>
<i class="fas fa-sun" />
</label>
<input
id="theme-auto"
v-model="$root.theme"
type="radio"
name="theme"
class="btn-check"
value="auto"
>
<label
class="btn btn-outline-secondary btn-sm"
for="theme-auto"
>
{{ $t('btn-theme-switcher-auto') }}
</label>
<input
id="theme-dark"
v-model="$root.theme"
type="radio"
name="theme"
class="btn-check"
value="dark"
>
<label
class="btn btn-outline-secondary btn-sm"
for="theme-dark"
>
<i class="fas fa-moon" />
</label>
</form>
</div>
</div>
@ -84,7 +117,7 @@ export default {
// Use specified icon or fall back to light-mode appIcon (which might be null)
const darkIcon = this.$root.customize.appIconDark || appIcon
return this.$root.darkTheme ? darkIcon : appIcon
return this.$root.theme === 'dark' ? darkIcon : appIcon
},
},