diff --git a/src/components/helpers/sharemodal/ShareModal.jsx b/src/components/helpers/sharemodal/ShareModal.jsx
index a96fb73c..2334f129 100644
--- a/src/components/helpers/sharemodal/ShareModal.jsx
+++ b/src/components/helpers/sharemodal/ShareModal.jsx
@@ -18,7 +18,7 @@ export default function ShareModal({ modalClose, data, type }) {
};
return (
-
+
Share
diff --git a/src/components/helpers/sharemodal/sharemodal.scss b/src/components/helpers/sharemodal/sharemodal.scss
index 92f84c49..51830566 100644
--- a/src/components/helpers/sharemodal/sharemodal.scss
+++ b/src/components/helpers/sharemodal/sharemodal.scss
@@ -1,14 +1,37 @@
@import '../../../scss/variables';
-.shareModal {
+.smallModal {
@extend %tabText;
display: flex;
flex-flow: column;
gap: 15px;
padding: 15px;
+ width: 320px;
@include themed() {
background: t($modal-background);
}
+ .resetFooter {
+ display: flex;
+ flex-flow: row;
+ justify-content: flex-end;
+ gap: 20px;
+ button {
+ gap: 20px;
+ display: flex;
+ flex-flow: row;
+ }
+ }
+ .textButton {
+ @include basicIconButton(11px, 1.3rem, modal-text);
+ border: none !important;
+ }
+ .tooltipTitle {
+ @include themed() {
+ background: t($modal-sidebar);
+ box-shadow: 0 0 0 1px t($modal-sidebarActive);
+ color: t($color);
+ }
+ }
.buttons {
justify-content: space-between;
display: flex;
@@ -23,6 +46,18 @@
display: flex;
flex-flow: row;
gap: 15px;
+ input[type='text'] {
+ @include themed() {
+ background: t($modal-sidebar);
+ border-radius: t($borderRadius);
+ box-shadow: 0 0 0 4px t($modal-sidebarActive);
+ padding: 11px;
+ flex: 1;
+ color: t($color);
+ }
+ border: none;
+ outline: none;
+ }
}
input[type='text'] {
@include themed() {
diff --git a/src/components/modals/main/marketplace/Item.jsx b/src/components/modals/main/marketplace/Item.jsx
index 66514685..5c12e99f 100644
--- a/src/components/modals/main/marketplace/Item.jsx
+++ b/src/components/modals/main/marketplace/Item.jsx
@@ -217,10 +217,12 @@ export default class Item extends PureComponent {
{this.props.button}
- this.setState({ shareModal: true })} />
+
-
window.open(
variables.constants.REPORT_ITEM +
@@ -228,7 +230,9 @@ export default class Item extends PureComponent {
'_blank',
)
}
- />
+ >
+
+
{this.props.data.data.collection ? (
diff --git a/src/components/modals/main/marketplace/Items.jsx b/src/components/modals/main/marketplace/Items.jsx
index 7f2309d7..d28fd520 100644
--- a/src/components/modals/main/marketplace/Items.jsx
+++ b/src/components/modals/main/marketplace/Items.jsx
@@ -1,4 +1,5 @@
import variables from 'modules/variables';
+import { MdOpenInNew, MdAutoFixHigh } from 'react-icons/md';
export default function Items({
type,
@@ -40,6 +41,15 @@ export default function Items({
))}
+ {type === 'all' ? (
+
+
+
Can't find what you're looking for?
+
+ Visit the knowledgebase to create your own.
+
+
+ ) : null}
>
);
}
diff --git a/src/components/modals/main/marketplace/sections/Added.jsx b/src/components/modals/main/marketplace/sections/Added.jsx
index fa64ddcb..480b3d0e 100644
--- a/src/components/modals/main/marketplace/sections/Added.jsx
+++ b/src/components/modals/main/marketplace/sections/Added.jsx
@@ -1,6 +1,6 @@
import variables from 'modules/variables';
import { PureComponent } from 'react';
-import { MdLocalMall } from 'react-icons/md';
+import { MdLocalMall, MdUpdate } from 'react-icons/md';
import { toast } from 'react-toastify';
import Item from '../Item';
@@ -150,20 +150,22 @@ export default class Added extends PureComponent {
return (
<>
-
this.sortAddons(value)}
- >
-
-
-
-
-
-
-
+
{this.getMessage('modals.main.addons.added')}
+
+ this.sortAddons(value)}
+ >
+
+
+
+
+
+
+
this.toggle('item', input)}
diff --git a/src/components/modals/main/scss/marketplace/_main.scss b/src/components/modals/main/scss/marketplace/_main.scss
index 06d9d0c0..e6e75ff8 100644
--- a/src/components/modals/main/scss/marketplace/_main.scss
+++ b/src/components/modals/main/scss/marketplace/_main.scss
@@ -93,6 +93,8 @@
flex-flow: column;
gap: 15px;
width: 170px;
+ box-sizing: border-box !important;
+
img {
width: 100%;
@@ -112,12 +114,13 @@
}
.iconButtons {
- display: flex;
- flex-flow: row;
- justify-content: space-between;
-
- svg {
- @include basicIconButton(11px, 1.3rem, modal);
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ grid-template-rows: 1fr;
+ grid-gap: 20px;
+ button {
+ width: 100%;
+ padding: 0;
}
}
}
@@ -283,6 +286,7 @@ p.author {
padding: 15px;
gap: 15px;
justify-content: space-between;
+ align-items: center;
@include themed() {
background: t($modal-sidebar);
@@ -301,8 +305,10 @@ p.author {
justify-content: space-between;
padding: 15px;
margin-top: 15px;
+ background-size: fill;
+ background-position: center;
background-image: linear-gradient(to left, transparent, #000),
- url('https://www.gonefullgeek.com/wp-content/uploads/2017/09/RDR2-Banner.jpg');
+ url('https://external-preview.redd.it/JyhsEoGMhKIMi3kvfBS24L0IllAO_KrIm4UI-dA1Ax4.jpg?auto=webp&s=b5adf9859b2c1855a5b3085f9453a6e878548505');
align-items: center;
@include themed() {
@@ -357,7 +363,7 @@ p.author {
.inCollection {
background-image: linear-gradient(to left, transparent, #000),
- url('https://www.gonefullgeek.com/wp-content/uploads/2017/09/RDR2-Banner.jpg');
+ url('https://external-preview.redd.it/JyhsEoGMhKIMi3kvfBS24L0IllAO_KrIm4UI-dA1Ax4.jpg?auto=webp&s=b5adf9859b2c1855a5b3085f9453a6e878548505');
display: flex;
flex-flow: column;
gap: 15px;
@@ -368,3 +374,14 @@ p.author {
border-radius: t($borderRadius);
}
}
+
+.createYourOwn {
+ display: flex;
+ flex-flow: column;
+ gap: 20px;
+ align-items: center;
+ margin-top: 30px;
+ svg {
+ font-size: 30px;
+ }
+}
diff --git a/src/components/modals/main/scss/marketplace/modules/_buttons.scss b/src/components/modals/main/scss/marketplace/modules/_buttons.scss
index 8e23a8df..a7908f83 100644
--- a/src/components/modals/main/scss/marketplace/modules/_buttons.scss
+++ b/src/components/modals/main/scss/marketplace/modules/_buttons.scss
@@ -32,5 +32,5 @@
}
.updateCheck {
- margin-top: 15px;
+ flex-flow: row !important;
}
diff --git a/src/components/modals/main/scss/settings/modules/_resetmodal.scss b/src/components/modals/main/scss/settings/modules/_resetmodal.scss
index d5064f36..e69de29b 100644
--- a/src/components/modals/main/scss/settings/modules/_resetmodal.scss
+++ b/src/components/modals/main/scss/settings/modules/_resetmodal.scss
@@ -1,33 +0,0 @@
-@import '../../../../../../scss/variables';
-
-.resetModal {
- @extend %tabText;
- display: flex;
- flex-flow: column;
- padding: 2rem;
- justify-content: center;
- gap: 15px;
- @include themed() {
- background: t($modal-background);
- }
- button {
- display: flex;
- align-items: center;
- gap: 15px;
- }
- button:nth-child(1) {
- @include basicIconButton(11px, 1.3rem, modal-text);
- }
- button:nth-child(2) {
- @include basicIconButton(11px, 1.3rem, modal);
- }
-}
-.resetFooter {
- display: flex;
- flex-flow: row;
- justify-content: space-around;
- button {
- display: flex !important;
- flex-flow: row;
- }
-}
diff --git a/src/components/modals/main/settings/ResetModal.jsx b/src/components/modals/main/settings/ResetModal.jsx
index 400bd9fd..c2772a3d 100644
--- a/src/components/modals/main/settings/ResetModal.jsx
+++ b/src/components/modals/main/settings/ResetModal.jsx
@@ -1,6 +1,7 @@
import variables from 'modules/variables';
import { MdClose, MdRestartAlt } from 'react-icons/md';
import { setDefaultSettings } from 'modules/helpers/settings';
+import Tooltip from '../../../helpers/tooltip/Tooltip';
export default function ResetModal({ modalClose }) {
const reset = () => {
@@ -10,27 +11,33 @@ export default function ResetModal({ modalClose }) {
};
return (
-
-
+
+
+
{variables.language.getMessage(
variables.languagecode,
'modals.main.settings.sections.advanced.reset_modal.title',
- )}
-
+ )}
+
+
+
+
+
+
{variables.language.getMessage(
variables.languagecode,
'modals.main.settings.sections.advanced.reset_modal.question',
)}
-
+
{variables.language.getMessage(
variables.languagecode,
'modals.main.settings.sections.advanced.reset_modal.information',
)}
-