feat: update slider + create

- got rid of commented out css
- update about tab UI
- add reset icon to reset text
- change link colour
- add number to show value on slider
- reorder greeting settings to make a bit more sense

src/components/modals/main/settings/Slider.jsx

@@ -63,6 +63,7 @@ export default class SliderComponent extends PureComponent {
       <>
         <span className={'sliderTitle'}>
           {this.props.title}
+          {Number(this.state.value / 100)}x
           <span className="link" onClick={this.resetItem}>
             <MdRefresh />
             {variables.language.getMessage(

src/components/modals/main/settings/sections/About.jsx

@@ -1,6 +1,6 @@
 import variables from 'modules/variables';
 import { PureComponent } from 'react';
-import { MdEmail } from 'react-icons/md';
+import { MdEmail, MdContactPage } from 'react-icons/md';
 import { FaDiscord, FaTwitter, FaPatreon, FaGithub } from 'react-icons/fa';
 import { SiGithubsponsors, SiLiberapay, SiKofi, SiPatreon } from 'react-icons/si';
 import { BiDonateHeart } from 'react-icons/bi';
@@ -179,6 +179,10 @@ export default class About extends PureComponent {
             {this.getMessage('modals.main.settings.sections.about.contact_us')}
           </span>
           <div className="aboutContact">
+              <a class='donateButton' href='https://muetab.com/contact'>
+                <MdContactPage />
+                Form
+              </a>
             <Tooltip title={'Email'}>
               <a
                 href={'mailto:' + variables.constants.EMAIL}

src/components/modals/main/settings/sections/Greeting.jsx

@@ -29,17 +29,17 @@ export default class GreetingSettings extends PureComponent {
     return (
       <>
         <Header title={getMessage('modals.main.settings.sections.greeting.title')} setting='greeting' category='greeting' element='.greeting' zoomSetting='zoomGreeting' switch={true}/>
+        <SettingsItem title="Additional Settings" subtitle={getMessage('modals.main.settings.enabled')}>
+        <Checkbox name='events' text={getMessage('modals.main.settings.sections.greeting.events')} category='greeting'/>
+        <Checkbox name='defaultGreetingMessage' text={getMessage('modals.main.settings.sections.greeting.default')} category='greeting'/>
+        <Text title={getMessage('modals.main.settings.sections.greeting.name')} name='greetingName' category='greeting'/>
+        </SettingsItem>
         <SettingsItem title={getMessage('modals.main.settings.sections.greeting.birthday')} subtitle={getMessage('modals.main.settings.enabled')}>
         <Switch name='birthdayenabled' text={getMessage('modals.main.settings.enabled')} category='greeting'/>
         <Checkbox name='birthdayage' text={getMessage('modals.main.settings.sections.greeting.birthday_age')} category='greeting'/>
         <p>{getMessage('modals.main.settings.sections.greeting.birthday_date')}</p>
         <input type='date' onChange={this.changeDate} value={this.state.birthday.toISOString().substr(0, 10)} required/>
         </SettingsItem>
-        <SettingsItem title="Additional Settings" subtitle={getMessage('modals.main.settings.enabled')}>
-        <Checkbox name='events' text={getMessage('modals.main.settings.sections.greeting.events')} category='greeting'/>
-        <Checkbox name='defaultGreetingMessage' text={getMessage('modals.main.settings.sections.greeting.default')} category='greeting'/>
-        <Text title={getMessage('modals.main.settings.sections.greeting.name')} name='greetingName' category='greeting'/>
-        </SettingsItem>
         {/*<h3>{getMessage('modals.main.settings.sections.greeting.birthday')}</h3>
         <Switch name='birthdayenabled' text={getMessage('modals.main.settings.enabled')} category='greeting'/>
         <br/>