From 50d5af7e4a226eaf40ed52124850e3b7d46d9f7b Mon Sep 17 00:00:00 2001
From: Jesse Wierzbinski <contact@cpluspatch.com>
Date: Fri, 15 Nov 2024 15:28:47 +0100
Subject: [PATCH] fix: :bug: Fix backgrounds in settings pages

---
 components/settings/emojis/emojis.vue    | 2 +-
 components/settings/profile-editor.vue   | 2 +-
 components/sidebars/settings-sidebar.vue | 6 ++++--
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/components/settings/emojis/emojis.vue b/components/settings/emojis/emojis.vue
index 270fa3e..d782b60 100644
--- a/components/settings/emojis/emojis.vue
+++ b/components/settings/emojis/emojis.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="max-w-7xl mx-auto my-12 px-4">
+    <div class="max-w-7xl mx-auto py-12 px-4">
         <div class="md:max-w-sm w-full relative mb-4">
             <TextInput v-model="search" placeholder="Search" class="pl-8" />
             <iconify-icon icon="tabler:search"
diff --git a/components/settings/profile-editor.vue b/components/settings/profile-editor.vue
index c1a3d5f..5ea2ae0 100644
--- a/components/settings/profile-editor.vue
+++ b/components/settings/profile-editor.vue
@@ -1,6 +1,6 @@
 <template>
     <div
-        class="w-full md:px-8 px-4 py-4 bg-dark-700 grid justify-center lg:grid-cols-[minmax(auto,_36rem)_1fr] grid-cols-1 gap-4">
+        class="w-full md:px-8 px-4 py-4 grid justify-center lg:grid-cols-[minmax(auto,_36rem)_1fr] grid-cols-1 gap-4">
         <form class="w-full ring-1 ring-inset ring-white/5 pb-5 bg-dark-800 rounded overflow-hidden"
             @submit.prevent="save">
             <Avatar :src="account?.header" :alt="`${account?.acct}'s header image'`"
diff --git a/components/sidebars/settings-sidebar.vue b/components/sidebars/settings-sidebar.vue
index 81db9ab..dd51e3a 100644
--- a/components/sidebars/settings-sidebar.vue
+++ b/components/sidebars/settings-sidebar.vue
@@ -1,7 +1,9 @@
 <template>
-    <Tabs.Root v-model="tab">
+    <Tabs.Root v-model="tab" class="bg-dark-700 h-full overflow-auto pb-20">
         <Tabs.List class="flex flex-row p-4 gap-4 bg-dark-800 relative ring-1 ring-white/5 overflow-x-auto">
-            <Tabs.Trigger :value="page" v-for="page of [SettingPages.Account, SettingPages.Emojis,   SettingPages.Behaviour, SettingPages.Appearance]" :as-child="true">
+            <Tabs.Trigger :value="page"
+                v-for="page of [SettingPages.Account, SettingPages.Emojis, SettingPages.Behaviour, SettingPages.Appearance]"
+                :as-child="true">
                 <ButtonBase class="capitalize hover:bg-white/5">
                     {{ page }}
                 </ButtonBase>