diff --git a/pages/settings.vue b/pages/settings.vue
index 0efafeb..a6079d7 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -1,20 +1,17 @@
+<script setup lang="ts">
+const { locales, currentLocale, setLocale } = useLocale();
+</script>
+
 <template>
-  <div>
-    <div class="row">
-      <h1 class="display-4 mb-4">Settings</h1>
-      <div class="d-flex flex-column justify-items-stretch gap-1">
-        <div v-for="(value, key, index) in locales">
-          <button class="btn border border-1 w-100" :class="{'btn-secondary': currentLocale == key}" @click="setLocale(key)" >
-            {{ value }}
-          </button>
-        </div>
+  <div class="app-background p-4 rounded">
+    <div class="d-flex flex-column justify-items-stretch gap-1">
+      <div v-for="(value, key, index) in locales"
+        data-aos="fade-right"
+        data-aos-duration="500">
+        <button class="btn border border-1 w-100" :class="{'btn-secondary': currentLocale == key}" @click="setLocale(key)" >
+          {{ value }}
+        </button>
       </div>
     </div>
   </div>
-</template>
-
-<script setup lang="ts">
-import useLocale from "../composables/useLocale";
-
-const { locales, currentLocale, setLocale } = useLocale();
-</script>
\ No newline at end of file
+</template>
\ No newline at end of file