From ecae07600377cedf73a09c710dce6c839ec011f8 Mon Sep 17 00:00:00 2001
From: tddebart <tddebart@gmail.com>
Date: Sat, 14 Dec 2024 15:25:23 +0100
Subject: [PATCH] fix: Fix settings icons not being centered and plugin
 settings button not having propper styling

---
 assets/src/tabs/Plugins.tsx | 16 ++++++++++++++--
 assets/src/tabs/Themes.tsx  | 16 ++++++++++++----
 2 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/assets/src/tabs/Plugins.tsx b/assets/src/tabs/Plugins.tsx
index 30770785..d22f290e 100644
--- a/assets/src/tabs/Plugins.tsx
+++ b/assets/src/tabs/Plugins.tsx
@@ -27,8 +27,8 @@ const EditPlugin: React.FC<EditPluginProps> = ({ plugin }) => {
 	}
 
 	return (
-		<DialogButton className="_3epr8QYWw_FqFgMx38YEEm" style={{marginTop: 0, marginLeft: 0, marginRight: 15}}>
-			<IconsModule.Settings />
+		<DialogButton className="_3epr8QYWw_FqFgMx38YEEm millenniumIconButton">
+			<IconsModule.Settings height="16" />
 		</DialogButton>
 	)
 }
@@ -80,6 +80,18 @@ const PluginViewModal: React.FC = () => {
 
 	return (
 		<>
+		<style>
+		{`
+			button.millenniumIconButton {
+				padding: 9px 10px !important; 
+				margin: 0 !important; 
+				margin-right: 10px !important;
+				display: flex;
+				width: auto;
+			}
+		`}
+		</style>
+
 		<DialogHeader>{locale.settingsPanelPlugins}</DialogHeader>
 		<DialogBody className={classMap.SettingsDialogBodyFade}>
 			{plugins.map((plugin: PluginComponent, index: number) => (
diff --git a/assets/src/tabs/Themes.tsx b/assets/src/tabs/Themes.tsx
index 922db625..134cd35c 100644
--- a/assets/src/tabs/Themes.tsx
+++ b/assets/src/tabs/Themes.tsx
@@ -86,7 +86,6 @@ const RenderEditTheme: React.FC<EditThemeProps> = ({ active }) => {
     return (
         <DialogButton 
             onClick={() => ThemeSettings(active)}
-            style={{margin: "0", padding: "0px 10px", marginRight: "10px"}} 
             className="_3epr8QYWw_FqFgMx38YEEm millenniumIconButton" 
         >
             <IconsModule.Settings height="16" />
@@ -206,7 +205,18 @@ const ThemeViewModal: React.FC = () => {
 
     return (
         <>
-            <style>{`.DialogDropDown._DialogInputContainer.Panel.Focusable { min-width: max-content !important; }`}</style>
+            <style>
+            {`
+                .DialogDropDown._DialogInputContainer.Panel.Focusable { min-width: max-content !important; }
+                button.millenniumIconButton {
+                    padding: 9px 10px !important; 
+                    margin: 0 !important; 
+                    margin-right: 10px !important;
+                    display: flex;
+                    width: auto;
+                }
+            `}
+            </style>
 
             <DialogHeader>{locale.settingsPanelThemes}</DialogHeader>
             <DialogBody className={classMap.SettingsDialogBodyFade}>
@@ -227,7 +237,6 @@ const ThemeViewModal: React.FC = () => {
                     {!pluginSelf.isDefaultTheme && (
                         <DialogButton
                             onClick={() => SetupAboutRenderer(active)}
-                            style={{ margin: "0", padding: "0px 10px", marginRight: "10px" }}
                             className="_3epr8QYWw_FqFgMx38YEEm millenniumIconButton"
                         >
                             <IconsModule.Information height="16" />
@@ -236,7 +245,6 @@ const ThemeViewModal: React.FC = () => {
         
                     <DialogButton
                         onClick={OpenThemesFolder}
-                        style={{ margin: "0", padding: "0px 10px", marginRight: "10px" }}
                         className="_3epr8QYWw_FqFgMx38YEEm millenniumIconButton"
                     >
                         <CustomIcons.Folder />