style: make colours more like site

src/components/Elements/MainModal/scss/settings/modules/_material-ui.scss

@@ -162,6 +162,12 @@ legend,
   .MuiFormControlLabel-root {
     width: 100%;
   }
+
+  p {
+    @include themed {
+      color: t($subColor) !important;
+    }
+  }
 }
 
 .css-w66kx-MuiChip-root {

src/features/misc/sections/About.jsx

@@ -184,7 +184,7 @@ class About extends PureComponent {
         </div>
 
         <div className="settingsRow" style={{ flexFlow: 'column', alignItems: 'flex-start' }}>
-          <span className="title">
+          <span className="title" style={{ marginBottom: '1em' }}>
             {variables.getMessage('modals.main.settings.sections.about.contact_us')}
           </span>
           <div className="aboutContact">

src/scss/_variables.scss

@@ -64,10 +64,10 @@ $themes: (
     'btn-background': #fff,
     'btn-backgroundHover': rgb(247 250 252 / 90%),
     'modal-background': #fff,
-    'modal-sidebar': rgb(240 240 240 / 100%),
-    'modal-sidebarActive': rgb(219 219 219 / 72%),
+    'modal-sidebar': #feffff,
+    'modal-sidebarActive': #f5f5f5,
     'modal-secondaryColour': #fafafa,
-    'link': #5352ed,
+    'link': #ff5c25,
     'slightGradient': linear-gradient(#fff, #ddd),
   ),
   dark: (
@@ -75,16 +75,16 @@ $themes: (
     'background': rgb(0 0 0 / 70%),
     'backgroundBlur': 15px,
     'color': rgb(255 255 255),
-    'subColor': #c2c2c2,
+    'subColor': #a0a0a0,
     'borderRadius': 12px,
     'boxShadow': 0 0 0 1px #484848,
     'btn-background': #222,
     'btn-backgroundHover': #565656,
     'modal-background': #0a0a0a,
-    'modal-sidebar': #0e1013,
-    'modal-sidebarActive': #333,
+    'modal-sidebar': #151515,
+    'modal-sidebarActive': #262626,
     'modal-secondaryColour': #111,
-    'link': rgb(115 115 255),
+    'link': #ff5c25,
     'slightGradient': linear-gradient(#0e1013, #322a2a),
   ),
 );