feat: marketplace improvements, remove Unsplash text, add Weather skeleton, replace Twitter with X, minor fixes etc

Co-authored-by: Alex Sparkes <alexsparkes@gmail.com>
Co-authored-by: Isaac <contact@eartharoid.me>

src/components/Elements/MainModal/backend/Tab.jsx

@@ -77,6 +77,7 @@ function Tab({ label, currentTab, onClick, navbarTab }) {
     variables.getMessage('modals.main.marketplace.all'),
     variables.getMessage('modals.main.settings.sections.experimental.title'),
   ].includes(label);
+
   const mue = [
     variables.getMessage('modals.main.marketplace.product.overview'),
     variables.getMessage('modals.main.addons.added'),

src/components/Elements/MainModal/scss/marketplace/_main.scss

@@ -395,6 +395,10 @@ p.author {
 
     .subtitle {
       color: #ccc !important;
+      overflow: hidden;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 5;
     }
   }
 

src/components/Elements/MainModal/scss/marketplace/modules/_item.scss

@@ -47,7 +47,8 @@ p.description {
   }
 
   .header {
-    text-transform: uppercase;
+    // text-transform: uppercase;
+    font-size: small;
 
     @include themed {
       color: t($subColor);
@@ -68,6 +69,59 @@ p.description {
   }
 }
 
+.subHeader {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  width: calc(100% - 30px);
+  gap: 25px;
+
+  .items {
+    margin-top: 0 !important;
+  }
+
+  .item {
+    flex: 1 0 40% !important;
+  }
+
+  .infoItem {
+    display: flex;
+    flex-flow: row;
+    align-items: center;
+    gap: 15px;
+    flex: 1 0 44%;
+
+    svg {
+      @include themed {
+        background-image: t($slightGradient);
+        box-shadow: t($boxShadow);
+      }
+
+      padding: 7px;
+      border-radius: 100%;
+    }
+
+    .text {
+      display: flex;
+      flex-flow: column;
+    }
+  }
+
+  .header {
+    font-size: small;
+
+    @include themed {
+      color: t($subColor);
+    }
+  }
+
+  span {
+    @include themed {
+      color: t($color);
+    }
+  }
+}
+
 .showMoreItems {
   display: flex;
   flex-flow: column;
@@ -81,3 +135,10 @@ p.description {
   flex-flow: column;
   gap: 15px;
 }
+
+.moreFromCurator {
+  margin-top: 50px;
+  display: flex;
+  flex-flow: column;
+  gap: 15px;
+}

src/components/Elements/ShareModal/ShareModal.jsx

@@ -1,9 +1,9 @@
 import { memo } from 'react';
 import variables from 'config/variables';
 import { MdClose, MdEmail, MdContentCopy } from 'react-icons/md';
-import { FaTwitter, FaFacebookF } from 'react-icons/fa';
+import { FaFacebookF } from 'react-icons/fa';
 import { AiFillWechat } from 'react-icons/ai';
-import { SiTencentqq } from 'react-icons/si';
+import { SiTencentqq, SiX } from 'react-icons/si';
 import Tooltip from '../Tooltip/Tooltip';
 import { toast } from 'react-toastify';
 
@@ -49,13 +49,13 @@ function ShareModal({ modalClose, data }) {
           onClick={() =>
             window
               .open(
-                `https://twitter.com/intent/tweet?text=Check out ${data.name} on @getmue: ${data.url}`,
+                `https://x.com/intent/tweet?text=Check out ${data.name} on @getmue: ${data.url}`,
                 '_blank',
               )
               .focus()
           }
-          icon={<FaTwitter />}
-          tooltipTitle="Twitter"
+          icon={<SiX />}
+          tooltipTitle="X (Twitter)"
           type="icon"
         />
         <Button
@@ -65,7 +65,7 @@ function ShareModal({ modalClose, data }) {
               .focus()
           }
           icon={<FaFacebookF />}
-          tooltipTitle="Twitter"
+          tooltipTitle="Facebook"
           type="icon"
         />
         <Button