From b6637bdf8f978a1cb612b7b1d2a5c16d606f335c Mon Sep 17 00:00:00 2001
From: PalmDevs <git@palmdevs.me>
Date: Thu, 5 Dec 2024 00:53:24 +0700
Subject: [PATCH] fix(plugins/settings): match Discord's page styles better

---
 src/plugins/settings/pages/(Wrapper).tsx | 17 ++++++++++++++---
 src/plugins/settings/pages/Plugins.tsx   |  2 +-
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/plugins/settings/pages/(Wrapper).tsx b/src/plugins/settings/pages/(Wrapper).tsx
index 8776656..cad32c0 100644
--- a/src/plugins/settings/pages/(Wrapper).tsx
+++ b/src/plugins/settings/pages/(Wrapper).tsx
@@ -12,17 +12,28 @@ const styles = StyleSheet.create({
     },
     paddedContainer: {
         paddingHorizontal: 16,
-        paddingTop: 16,
+        paddingTop: 24,
+    },
+    paddedContainerTopControls: {
+        paddingTop: 12,
+        paddingHorizontal: 16,
     },
 })
 
 // Hacky way to allow dismissing input fields when tapping outside of them
 // But also not allowing the ScrollView to scroll
-export default function PageWrapper(props: { children: ReactNode }) {
+export default function PageWrapper(props: { children: ReactNode; withTopControls?: boolean }) {
     return (
         <View style={styles.growable}>
             <ScrollView keyboardShouldPersistTaps="handled" contentContainerStyle={styles.resizable}>
-                <Stack style={[styles.paddedContainer, styles.resizable]} spacing={16} direction="vertical">
+                <Stack
+                    style={[
+                        props.withTopControls ? styles.paddedContainerTopControls : styles.paddedContainer,
+                        styles.resizable,
+                    ]}
+                    spacing={28}
+                    direction="vertical"
+                >
                     {props.children}
                 </Stack>
             </ScrollView>
diff --git a/src/plugins/settings/pages/Plugins.tsx b/src/plugins/settings/pages/Plugins.tsx
index 254d23c..2dc354a 100644
--- a/src/plugins/settings/pages/Plugins.tsx
+++ b/src/plugins/settings/pages/Plugins.tsx
@@ -239,7 +239,7 @@ export default function PluginsSettingsPage() {
     const pluginListNoResults = pluginListEmpty && query
 
     return (
-        <PageWrapper>
+        <PageWrapper withTopControls>
             <PluginSettingsPageContext.Provider
                 value={{ setQuery, showCorePlugins, sortMode, ContextMenuComponent: MemoizedContextMenu }}
             >