fix: font settings and quote widget

README.md

@@ -73,16 +73,16 @@ Please note that we have dropped support for Opera as of Mue 5.0
 [GitHub Releases](https://github.com/mue/mue/releases)
 
 ## Development
-#### Requirements
+### Requirements
   * [Git](https://git-scm.com/)
   * [Node.JS](https://nodejs.org/)
   * A suitable browser
-#### Starting
+### Starting
   1. Clone the repository using `git clone https://github.com/mue/mue.git`
   2. Run `yarn` or `npm i` to install all needed dependencies
   3. Run `yarn start` or `npm start` to start testing
   4. Code your heart out! (See the sections below for how to build the extension)
-#### Building
+### Building
 <details>
   <summary><b>Chrome/Edge (Chromium)</b> (Click to expand)</summary>
   <ol>

babel.config.js

@@ -3,4 +3,4 @@ module.exports = {
   plugins: ['@babel/plugin-proposal-class-properties', ['@babel/transform-runtime', {
     'regenerator': true
   }]]
-}
+};

src/components/modals/main/scss/index.scss

@@ -126,7 +126,6 @@ ul.sidebar {
     text-align: center;
   }
 
-
   svg {
     vertical-align: middle;
     font-size: 35px;

src/components/modals/main/scss/settings/_main.scss

@@ -33,7 +33,6 @@ ul {
   border-radius: 12px;
   outline: none;
   background: var(--sidebar);
-  border-radius: 12px;
   box-shadow: 0 0 100px rgba(0, 0, 0, 0.3);
 
   &::-webkit-slider-thumb {

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

@@ -29,7 +29,7 @@ export default class Radio extends React.PureComponent {
       <FormControl component='fieldset'>
         <FormLabel className='radio-title' component='legend'>{this.props.title}</FormLabel>
         <RadioGroup aria-label={this.props.name} name={this.props.name} onChange={this.handleChange} value={this.state.value}>
-          {this.props.options.map(option => (
+          {this.props.options.map((option) => (
             <FormControlLabel value={option.value} control={<RadioUI/>} label={option.name} key={option.name} />
           ))}
         </RadioGroup>

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

@@ -12,7 +12,7 @@ export default class Text extends React.PureComponent {
   }
 
   handleChange = (e) => {
-    const { value } = e.target;
+    let { value } = e.target;
   
     // Alex wanted font to work with montserrat and Montserrat, so I made it work
     if (this.props.upperCaseFirst === true) {

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

@@ -17,7 +17,7 @@ export default class About extends React.PureComponent {
       photographers: [],
       update: window.language.modals.main.settings.sections.about.version.checking_update,
       loading: window.language.modals.main.loading
-    }
+    };
     this.language = window.language.modals.main.settings.sections.about;
   }
 

src/components/modals/main/settings/sections/background/Background.jsx

@@ -58,7 +58,7 @@ export default class BackgroundSettings extends React.PureComponent {
         'name': 'Unsplash',
         'value': 'unsplash'
       }
-    ]
+    ];
 
     const APISettings = (
       <>

src/components/widgets/Widgets.jsx

@@ -19,7 +19,7 @@ export default class Widgets extends React.PureComponent {
       quote: this.enabled('quote') ? <Quote/> : null,
       date: this.enabled('date') ? <Date/> : null,
       quicklinks: this.enabled('quicklinksenabled') ? <QuickLinks/> : null
-    }
+    };
   }
 
   enabled(key) {
@@ -75,7 +75,7 @@ export default class Widgets extends React.PureComponent {
     const order = JSON.parse(localStorage.getItem('order'));
 
     if (order) {
-      order.forEach(element => {
+      order.forEach((element) => {
         elements.push(<React.Fragment key={element}>{this.widgets[element]}</React.Fragment>);
       });
     } else {

src/components/widgets/background/Favourite.jsx

@@ -36,6 +36,6 @@ export default class Favourite extends React.PureComponent {
       return null;
     }
 
-    return <Tooltip title='Favourite' placement='top'>{this.state.favourited}</Tooltip>
+    return <Tooltip title='Favourite' placement='top'>{this.state.favourited}</Tooltip>;
   }
 }

src/components/widgets/background/Maximise.jsx

@@ -51,8 +51,10 @@ export default class View extends React.PureComponent {
       return null;
     }
 
-    return <Tooltip title='View' placement='top'>
-      <FullscreenIcon onClick={() => this.viewStuff()} className='topicons' />
-    </Tooltip>
+    return (
+      <Tooltip title='View' placement='top'>
+        <FullscreenIcon onClick={() => this.viewStuff()} className='topicons' />
+      </Tooltip>
+    );
   }
 }

src/components/widgets/background/PhotoInformation.jsx

@@ -11,7 +11,7 @@ const toDataURL = async (url) => {
   const response = await fetch(url);
   const blob = await response.blob();
   return URL.createObjectURL(blob);
-}
+};
 
 const downloadImage = async (info) => {
   const link = document.createElement('a');
@@ -21,7 +21,7 @@ const downloadImage = async (info) => {
   document.body.appendChild(link);
   link.click();
   document.body.removeChild(link);
-}
+};
 
 export default function PhotoInformation(props) {
   const language = window.language.widgets.background;

src/components/widgets/navbar/Notes.jsx

@@ -12,7 +12,7 @@ export default class Notes extends React.PureComponent {
     this.state = {
       notes: localStorage.getItem('notes') || ''
     };
-    this.language = window.language.widgets.navbar.notes
+    this.language = window.language.widgets.navbar.notes;
   }
 
   setNotes = (e) => {

src/components/widgets/quote/Quote.jsx

@@ -101,7 +101,7 @@ export default class Quote extends React.PureComponent {
 
       let authorlink = `https://${this.languagecode.split('_')[0]}.wikipedia.org/wiki/${data.author.split(' ').join('_')}`;
       if (localStorage.getItem('authorLink') === 'false') {
-        authorLink = null;
+        authorlink = null;
       }
 
       this.setState({

src/components/widgets/search/Search.jsx

@@ -50,7 +50,9 @@ export default class Search extends React.PureComponent {
 
     if (info !== undefined) {
       url = info.url;
-      if (info.query) query = info.query;
+      if (info.query) {
+        query = info.query;
+      }
     }
 
     if (setting === 'custom') {

src/components/widgets/time/Clock.jsx

@@ -93,7 +93,7 @@ export default class Clock extends React.PureComponent {
 
     const checkValue = (setting) => {
       return (localStorage.getItem(setting) === 'true');
-    }
+    };
 
     if (localStorage.getItem('timeType') === 'analogue') {
       clockHTML = (

src/modules/helpers/settings.js

@@ -91,12 +91,12 @@ export default class SettingsFunctions {
         url = `@import url('https://fonts.googleapis.com/css2?family=${font}&display=swap');`;
       }
 
-      const fontWeight = localStorage.getItem('fontWeight');
+      const fontWeight = localStorage.getItem('fontweight');
       if (fontWeight) {
         fontweight = `font-weight: ${fontWeight};`;
       }
 
-      const fontStyle = localStorage.getItem('fontStyle');
+      const fontStyle = localStorage.getItem('fontstyle');
       if (fontStyle) {
         fontstyle = `font-style: ${fontStyle};`;
       }