fix: missing translation on item page

- change position of close button on modal

src/components/modals/main/Main.jsx

@@ -56,7 +56,7 @@ export default function MainModal({ modalClose }) {
   return (
     <div className="frame">
       <Tooltip
-        style={{ position: 'absolute', top: '3rem', right: '3rem' }}
+        style={{ position: 'absolute', top: '1rem', right: '1rem' }}
         title={variables.getMessage('modals.welcome.buttons.close')}
         key="closeTooltip"
       >

src/components/modals/main/marketplace/Item.jsx

@@ -13,6 +13,7 @@ import {
   MdTranslate,
   MdOutlineKeyboardArrowRight,
   MdExpandMore,
+  MdExpandLess,
   MdStyle,
 } from 'react-icons/md';
 import Modal from 'react-modal';
@@ -53,7 +54,11 @@ export default class Item extends PureComponent {
   }
 
   incrementCount() {
-    this.setState({ count: this.props.data.data.quotes.length });
+    if (this.state.count !== this.props.data.data.quotes.length) {
+      this.setState({ count: this.props.data.data.quotes.length });
+    } else {
+      this.setState({ count: 5 });
+    }
   }
 
   render() {
@@ -123,8 +128,8 @@ export default class Item extends PureComponent {
               <>
                 <table>
                   <tr>
-                    <th>Quote</th>
-                    <th>Author</th>
+                    <th>{variables.getMessage('modals.main.settings.sections.quote.title')}</th>
+                    <th>{variables.getMessage('modals.main.settings.sections.quote.author')}</th>
                   </tr>
                   {this.props.data.data.quotes.slice(0, this.state.count).map((quote, index) => (
                     <tr key={index}>
@@ -135,7 +140,15 @@ export default class Item extends PureComponent {
                 </table>
                 <div className="showMoreItems">
                   <span className="link" onClick={() => this.incrementCount()}>
-                    <MdExpandMore /> Show All
+                    {this.state.count !== this.props.data.data.quotes.length ? (
+                      <>
+                        <MdExpandMore /> {variables.getMessage('modals.main.marketplace.product.show_all')}
+                      </>
+                    ) : (
+                      <>
+                        <MdExpandLess /> {variables.getMessage('modals.main.marketplace.product.show_less')}
+                      </>
+                    )}
                   </span>
                 </div>
               </>
@@ -213,7 +226,10 @@ export default class Item extends PureComponent {
               <div className="infoItem">
                 <MdStyle />
                 <div className="text">
-                  <span className="header"> {variables.getMessage('modals.main.settings.sections.background.type.title')}</span>
+                  <span className="header">
+                    {' '}
+                    {variables.getMessage('modals.main.settings.sections.background.type.title')}
+                  </span>
                   <span>
                     {' '}
                     {variables.getMessage(

src/components/modals/main/marketplace/sections/Added.jsx

@@ -1,6 +1,6 @@
 import variables from 'modules/variables';
 import { PureComponent } from 'react';
-import { MdUpdate, MdOutlineExtensionOff } from 'react-icons/md';
+import { MdUpdate, MdOutlineExtensionOff, MdCode } from 'react-icons/md';
 import { toast } from 'react-toastify';
 import Modal from 'react-modal';
 
@@ -193,10 +193,16 @@ export default class Added extends PureComponent {
     if (this.state.installed.length === 0) {
       return (
         <>
+          <div className="flexTopMarketplace">
+            <span className="mainTitle">{variables.getMessage('modals.main.navbar.addons')}</span>
+          </div>
+          <div className="filter">
           {sideLoadBackendElements()}
-          <button onClick={() => document.getElementById('file-input').click()}>
+          <button className="sideload " onClick={() => document.getElementById('file-input').click()}>
             {variables.getMessage('modals.main.addons.sideload.title')}
+            <MdCode />
           </button>
+          </div>
           <div className="emptyItems">
             <div className="emptyNewMessage">
               <MdOutlineExtensionOff />
@@ -224,12 +230,19 @@ export default class Added extends PureComponent {
 
     return (
       <>
-        {sideLoadBackendElements()}
         <span className="mainTitle">{variables.getMessage('modals.main.addons.added')}</span>
-        <button onClick={() => document.getElementById('file-input').click()}>
-          {variables.getMessage('modals.main.addons.sideload.title')}
-        </button>
         <div className="filter">
+          {sideLoadBackendElements()}
+          <div className="buttonSection">
+          <button className="sideload " onClick={() => document.getElementById('file-input').click()}>
+            {variables.getMessage('modals.main.addons.sideload.title')}
+            <MdCode />
+          </button>
+          <button className="addToMue sideload updateCheck" onClick={() => this.updateCheck()}>
+            <MdUpdate />
+            {variables.getMessage('modals.main.addons.check_updates')}
+          </button>
+          </div>
           <Dropdown
             label={variables.getMessage('modals.main.addons.sort.title')}
             name="sortAddons"
@@ -240,10 +253,6 @@ export default class Added extends PureComponent {
             <option value="a-z">{variables.getMessage('modals.main.addons.sort.a_z')}</option>
             <option value="z-a">{variables.getMessage('modals.main.addons.sort.z_a')}</option>
           </Dropdown>
-          <button className="addToMue sideload updateCheck" onClick={() => this.updateCheck()}>
-            <MdUpdate />
-            {variables.getMessage('modals.main.addons.check_updates')}
-          </button>
         </div>
         <Items
           items={this.state.installed}

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

@@ -330,6 +330,16 @@ p.author {
     box-shadow: 0 0 0 4px t($modal-sidebarActive);
   }
 
+  .MuiFormControl-root {
+    margin-bottom: 10px;
+  }
+
+  .buttonSection {
+    display: flex;
+    flex-flow: row;
+    gap: 20px;
+  }
+
   .tags {
     max-width: 50%;
   }

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

@@ -163,7 +163,7 @@ export default class QuickLinks extends PureComponent {
       const link = (
         <div className="messageMap">
           <div className="icon">
-            <img src={img} alt={item.name} draggable={false} />
+            <img src={img} alt={item.name} draggable={false} style={{ height: '30px', width: '30px'}} />
           </div>
           <div className="messageText">
             <div className="title">{item.name}</div>

src/components/modals/main/tabs/backend/Tabs.jsx

@@ -58,7 +58,7 @@ export default class Tabs extends PureComponent {
     }
 
     return (
-      <div style={{ display: 'flex', width: '100%' }}>
+      <div style={{ display: 'flex', width: '100%', minHeight: '100%' }}>
         <ul className="sidebar" style={{ display: marketplaceActive === ' navbar-item-active' || addonsActive === ' navbar-item-active' ? 'none' : 'block'}}>
           {this.props.children.map((tab, index) => (
             <Tab