more css fixes: mle modal & plugins settings about

src/components/settings/tabs/plugins/PluginModal.css

@@ -80,4 +80,10 @@
     justify-content: center;
     padding: 6px 12px;
     color: var(--text-default);
+}
+
+.vc-plugin-modal-about-box {
+    padding: 16px;
+    border-radius: 8px;
+    border: 1px solid var(--border-normal, var(--background-modifier-accent));
 }

src/components/settings/tabs/plugins/PluginModal.tsx

@@ -194,6 +194,15 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
                 </div>
             }
         >
+            {!!plugin.settingsAboutComponent && (
+                <div className={classes(Margins.top16, cl("about-box"))}>
+                    <section>
+                        <ErrorBoundary message="An error occurred while rendering this plugin's custom Info Component">
+                            <plugin.settingsAboutComponent />
+                        </ErrorBoundary>
+                    </section>
+                </div>
+            )}
             <div className={"vc-settings-modal-content"}>
                 <section>
                     <Text variant="heading-lg/semibold" className={classes(Margins.top8, Margins.bottom8)}>Authors</Text>
@@ -223,16 +232,6 @@ export default function PluginModal({ plugin, onRestartNeeded, onClose, transiti
                     </div>
                 </section>
 
-                {!!plugin.settingsAboutComponent && (
-                    <div className={Margins.top16}>
-                        <section>
-                            <ErrorBoundary message="An error occurred while rendering this plugin's custom Info Component">
-                                <plugin.settingsAboutComponent />
-                            </ErrorBoundary>
-                        </section>
-                    </div>
-                )}
-
                 <section>
                     <BaseText size="lg" weight="semibold" color="text-strong" className={classes(Margins.top16, Margins.bottom8)}>Settings</BaseText>
                     {renderSettings()}

src/equicordplugins/messageLoggerEnhanced/components/LogsModal.tsx

@@ -78,8 +78,7 @@ export function LogsModal({ modalProps, initalQuery }: Props) {
             {...modalProps}
             size="lg"
             title={
-                <div style={{ display: "flex", flexDirection: "column", gap: "10px", width: "100%", paddingRight: "20px" }}>
-                    <TextInput value={queryEh} onChange={e => setQuery(e)} style={{ width: "100%" }} placeholder="Filter Messages" />
+                <div className={cl("modal")}>
                     <TabBar
                         type="top"
                         look="brand"
@@ -110,6 +109,9 @@ export function LogsModal({ modalProps, initalQuery }: Props) {
                             Ghost Pinged
                         </TabBar.Item>
                     </TabBar>
+                    <div className={cl("modal-filter")}>
+                        <TextInput value={queryEh} onChange={e => setQuery(e)} placeholder="Filter Messages" />
+                    </div>
                 </div>
             }
             actions={[

src/equicordplugins/messageLoggerEnhanced/styles.css

@@ -1,8 +1,6 @@
 .vc-msg-logger-enhanced-modal-root {
-    max-height: 80vh;
-    min-height: 80vh;
-    min-width: 85vw;
-    max-width: 85vw;
+    max-height: 100%;
+    max-width: 100%;
 }
 
 .vc-msg-logger-enhanced-modal-empty-logs {
@@ -29,6 +27,7 @@
     /* max-height: 80vh; */
     overflow: hidden;
     height: 100%;
+    width: 100%;
     transition: opacity 100ms ease-in;
 }
 
@@ -53,8 +52,7 @@
 }
 
 .vc-msg-logger-enhanced-modal-tab-bar {
-    margin-top: 20px;
-    margin-bottom: -24px;
+    margin-bottom: 12px;
     margin-left: -24px;
     width: 114.5%;
     justify-content: space-around;
@@ -102,4 +100,16 @@
 
 .vc-updater-modal-content {
     padding: 1rem 2rem;
-}
+}
+
+.vc-msg-logger-enhanced-modal {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    width: 100%;
+    padding-right: 20px;
+}
+
+.vc-msg-logger-enhanced-modal-filter {
+    width: 106%;
+}