diff --git a/components/Settings/AppSettings/Appearance.vue b/components/Settings/AppSettings/Appearance.vue
index 39e7410..08225ae 100644
--- a/components/Settings/AppSettings/Appearance.vue
+++ b/components/Settings/AppSettings/Appearance.vue
@@ -24,12 +24,13 @@
     <p class="subtitle">TIME FORMAT</p>
     <div class="icons">
       <RadioButtons :button-count="3" :text-strings="['Auto', '12-hour', '24-hour']"
-          default-button-index="0" :callback="onTimeFormatClicked"></RadioButtons>
+          :default-button-index="0" :callback="onTimeFormatClicked"></RadioButtons>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
+import RadioButtons from '~/components/UserInterface/RadioButtons.vue';
 import settingSave from '~/utils/settingSave';
 
 const runtimeConfig = useRuntimeConfig()
diff --git a/components/RadioButtons.vue b/components/UserInterface/RadioButtons.vue
similarity index 100%
rename from components/RadioButtons.vue
rename to components/UserInterface/RadioButtons.vue