style: move time format to language

This commit is contained in:
Twig 2025-08-11 04:13:47 +02:00
parent 395dd6cf9b
commit b7eb404d0f
Signed by: twig
SSH key fingerprint: SHA256:nBO+OwpTkd8LYhe38PIqdxmDvkIg9Vw2EbrRZM97dkU
4 changed files with 22 additions and 35 deletions

View file

@ -45,27 +45,15 @@
<!-- <p class="subtitle">Icons</p> <!-- <p class="subtitle">Icons</p>
<div class="icons"> <div class="icons">
</div> --> </div> -->
<p class="subtitle">TIME FORMAT</p>
<div class="icons">
<RadioButtons :button-count="3" :text-strings="timeFormatTextStrings"
:default-button-index="settingsLoad().timeFormat?.index ?? 0" :callback="onTimeFormatClicked"></RadioButtons>
</div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import RadioButtons from '~/components/UserInterface/RadioButtons.vue';
import type { TimeFormat } from '~/types/settings';
import { settingSave, settingsLoad } from '#imports';
const runtimeConfig = useRuntimeConfig() const runtimeConfig = useRuntimeConfig()
const baseURL = runtimeConfig.app.baseURL; const baseURL = runtimeConfig.app.baseURL;
const styleFolder = `${baseURL}/themes/style` const styleFolder = `${baseURL}/themes/style`
const layoutFolder = `${baseURL}/themes/layout` const layoutFolder = `${baseURL}/themes/layout`
const timeFormatTextStrings = ["Auto", "12-Hour", "24-Hour"]
enum StyleLayout { enum StyleLayout {
Style, Style,
Layout Layout
@ -171,21 +159,6 @@ function changeTheme(themeType: StyleLayout, theme: Theme) {
} }
loadPreferredThemes() loadPreferredThemes()
} }
async function onTimeFormatClicked(index: number) {
let format: "auto" | "12" | "24" = "auto"
if (index == 0) {
format = "auto"
} else if (index == 1) {
format = "12"
} else if (index == 2) {
format = "24"
}
const timeFormat: TimeFormat = {index, format}
settingSave("timeFormat", timeFormat)
}
</script> </script>
<style scoped> <style scoped>

View file

@ -1,10 +1,27 @@
<template> <template>
<div> <div>
<h1>Language (TBA)</h1> <h1>Language</h1>
<p class="subtitle">TIME FORMAT</p>
<div class="icons">
<RadioButtons
:button-count="3"
:text-strings="timeFormatTextStrings"
:default-button-index="timeFormatSelectedIndex"
:callback="(index: number) => {settingSave('timeFormat', timeFormatTextStrings[index])}"
/>
</div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import RadioButtons from '~/components/UserInterface/RadioButtons.vue';
import type { TimeFormat } from '~/types/settings';
const timeFormatTextStrings: TimeFormat[] = ["Auto", "4:18 PM", "16:18"]
const timeFormatSelectedIndex = timeFormatTextStrings.indexOf(settingsLoad().timeFormat ?? "Auto")
</script> </script>
<style scoped> <style scoped>

View file

@ -4,7 +4,4 @@ export interface ClientSettings {
selectedThemeLayout?: string // URL selectedThemeLayout?: string // URL
} }
export interface TimeFormat { export type TimeFormat = "Auto" | "4:18 PM" | "16:18"
index: number,
format: "auto" | "12" | "24"
}

View file

@ -1,9 +1,9 @@
export default (): "12" | "24" => { export default (): "12" | "24" => {
const format = settingsLoad().timeFormat?.format ?? "auto" const format = settingsLoad().timeFormat ?? "Auto"
if (format == "12") { if (format == "4:18 PM") {
return "12" return "12"
} else if (format == "24") { } else if (format == "16:18") {
return "24" return "24"
} }