From 9276118a37b270a0216fd42675b3b27c31ef4dae Mon Sep 17 00:00:00 2001
From: Corey <coco@solos.dev>
Date: Sun, 12 May 2024 00:03:29 +0000
Subject: [PATCH] Adjust expansion bar styling

---
 .../src/components/Server/ExpansionsBar.tsx   | 24 ++++++++++++-------
 client/src/components/Server/ServerCard.tsx   |  4 ++--
 client/src/pages/About.tsx                    |  5 ++--
 3 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/client/src/components/Server/ExpansionsBar.tsx b/client/src/components/Server/ExpansionsBar.tsx
index b7429c3..acea673 100644
--- a/client/src/components/Server/ExpansionsBar.tsx
+++ b/client/src/components/Server/ExpansionsBar.tsx
@@ -1,5 +1,11 @@
-import { AddCircleOutline } from '@mui/icons-material';
-import { Box, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material';
+import { AddCircle } from '@mui/icons-material';
+import {
+  Box,
+  IconButton,
+  ToggleButton,
+  ToggleButtonGroup,
+  Tooltip,
+} from '@mui/material';
 import { ServerData } from '../../data/ServerData';
 
 const expansionButtons = [
@@ -67,7 +73,7 @@ export default function ExpansionBar({ server }: ExpansionBarProps) {
   });
 
   return (
-    <Box className="flex items-center">
+    <Box className="my-1 flex items-center">
       <ToggleButtonGroup
         size="small"
         value={
@@ -94,11 +100,13 @@ export default function ExpansionBar({ server }: ExpansionBarProps) {
           disableInteractive
           arrow
         >
-          <AddCircleOutline
-            style={{
-              maxHeight: '1rem',
-            }}
-          />
+          <IconButton className="p-0" disableRipple>
+            <AddCircle
+              style={{
+                maxHeight: '1rem',
+              }}
+            />
+          </IconButton>
         </Tooltip>
       )}
     </Box>
diff --git a/client/src/components/Server/ServerCard.tsx b/client/src/components/Server/ServerCard.tsx
index a44ee91..ed6a2ad 100644
--- a/client/src/components/Server/ServerCard.tsx
+++ b/client/src/components/Server/ServerCard.tsx
@@ -128,7 +128,7 @@ export default function ServerCard({ server, children }: ServerCardProps) {
                 ? 'rgba(255, 255, 255, .05)'
                 : 'rgba(0, 0, 0, .02)',
             '& .MuiAccordionSummary-content': {
-              margin: (theme) => theme.spacing(0),
+              margin: 0,
             },
             boxShadow: '0 0 10px rgba(0, 0, 0, 0.1)',
             minHeight: '32px',
@@ -271,7 +271,7 @@ export default function ServerCard({ server, children }: ServerCardProps) {
           </Box>
         </AccordionSummary>
         <AccordionDetails
-          className="p-2"
+          className="p-2 pt-0"
           sx={{
             backgroundColor: (theme) =>
               theme.palette.mode === 'dark'
diff --git a/client/src/pages/About.tsx b/client/src/pages/About.tsx
index 2ce8f81..340b3f4 100644
--- a/client/src/pages/About.tsx
+++ b/client/src/pages/About.tsx
@@ -134,7 +134,6 @@ export default function About() {
                 relevant changes you&apos;ve made using the LSB equivalent.
                 Settings should be served at <b>/api/settings</b> and total
                 active sessions should be served at <b>/api/sessions</b>.
-                Enabled expansions are controlled by the LOGIN settings.
               </Typography>
             </Box>
             <Box className="mb-3">
@@ -164,7 +163,7 @@ xi.settings.api =
                 </Card>
                 The world server needs to be restarted after any changes to any
                 of the settings. If you set <b>DO_NOT_TRACK</b> to <b>true</b>,
-                your server will be removed on the next hourly update.
+                your server will be removed on the next update.
               </Typography>
             </Box>
           </AccordionDetails>
@@ -195,7 +194,7 @@ xi.settings.api =
                   XiPrivateServers GitHub
                 </Link>{' '}
                 and see if it&apos;s listed there. Server owners see above for
-                information on how to add a Link href your website.
+                information on how to add a link to your website.
               </Typography>
               <Typography
                 component="li"