diff --git a/.DS_Store b/.DS_Store index bc281f0e..206831e9 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/src/components/helpers/sharemodal/ShareModal.jsx b/src/components/helpers/sharemodal/ShareModal.jsx index df192a3b..a96fb73c 100644 --- a/src/components/helpers/sharemodal/ShareModal.jsx +++ b/src/components/helpers/sharemodal/ShareModal.jsx @@ -8,12 +8,12 @@ import { toast } from 'react-toastify'; import './sharemodal.scss'; -export default function ShareModal({ modalClose, data }) { +export default function ShareModal({ modalClose, data, type }) { const getMessage = (text) => variables.language.getMessage(variables.languagecode, text); const url = variables.constants.MARKETPLACE_URL + '/share/' + btoa(data.api_name); const copyLink = () => { - navigator.clipboard.writeText(url); + navigator.clipboard.writeText(data); toast('Link copied!'); }; @@ -33,7 +33,7 @@ export default function ShareModal({ modalClose, data }) { onClick={() => window .open( - `https://twitter.com/intent/tweet?text=Check out ${data.data.name} on @getmue marketplace: ${url}`, + `https://twitter.com/intent/tweet?text=Check out ${data.data.name} on @getmue marketplace: ${data}`, '_blank', ) .focus() @@ -45,7 +45,7 @@ export default function ShareModal({ modalClose, data }) { - ) : null} {this.state.currentTab !== 0 ? ( - ) : null} + ) : ( + + )} diff --git a/src/components/modals/welcome/welcome.scss b/src/components/modals/welcome/welcome.scss index 4c49a68e..ca16021a 100644 --- a/src/components/modals/welcome/welcome.scss +++ b/src/components/modals/welcome/welcome.scss @@ -1,6 +1,10 @@ @import '../main/scss/index.scss'; @import 'scss/variables'; +.welcomeContent { + height: 100%; +} + .welcomemodal { position: absolute; margin: auto; @@ -8,14 +12,15 @@ right: 0; bottom: 0; left: 0; - height: 80%; - width: 60%; + height: 90vh; + width: clamp(60vw, 1400px, 90vw); padding: 0; + overflow-x: hidden !important; section { width: 50%; display: inline; - height: 80vh; + height: 100%; } section:nth-child(1) { @@ -200,7 +205,7 @@ a.privacy { align-items: center; img { - width: 30rem !important; + width: clamp(20rem, 300px, 40rem); height: auto !important; display: block; margin: 30px; @@ -208,58 +213,7 @@ a.privacy { } } -@media (max-width: 1820px) and (min-width: 1200px) { - .welcomemodal { - width: 85%; - height: 90%; - } - section { - height: 90vh !important; - } -} - -@media (max-width: 1300px) { - .welcomemodal { - overflow-x: hidden !important; - } - - .examples img { - width: 20rem !important; - } - - .buttons { - position: relative !important; - bottom: 1rem !important; - right: -1rem !important; - } - - section { - height: 100vh !important; - } -} - -@media (max-width: 1190px) { - .welcomemodal { - width: 90%; - height: 90%; - } -} - -@media (max-width: 800px) { - .welcomemodal { - width: 100%; - height: 100%; - } - - .examples img { - width: 15rem !important; - } - - section { - height: 140vh !important; - } -} .createButtons { display: flex; diff --git a/src/components/widgets/background/PhotoInformation.jsx b/src/components/widgets/background/PhotoInformation.jsx index c983caef..435d187f 100644 --- a/src/components/widgets/background/PhotoInformation.jsx +++ b/src/components/widgets/background/PhotoInformation.jsx @@ -12,6 +12,7 @@ import { MdSource as Source, } from 'react-icons/md'; import Tooltip from '../../helpers/tooltip/Tooltip'; +import Modal from 'react-modal'; import ShareModal from '../../helpers/sharemodal/ShareModal'; //import Hotkeys from 'react-hot-keys'; import { toast } from 'react-toastify'; @@ -50,6 +51,7 @@ export default function PhotoInformation({ info, url, api }) { const [showExtraInfo, setshowExtraInfo] = useState(false); const [showOld, setShowOld] = useState(true); const [other, setOther] = useState(false); + const [shareModal, openShareModal] = useState(false); if (info.hidden === true || !info.credit) { return null; @@ -199,6 +201,19 @@ export default function PhotoInformation({ info, url, api }) { onMouseEnter={() => setOther(true)} onMouseLeave={() => setOther(false)} > + openShareModal(false)} + > + openShareModal(false)} + /> + {localStorage.getItem('widgetStyle') === 'legacy' && (
@@ -270,7 +285,7 @@ export default function PhotoInformation({ info, url, api }) { <>
- copyImage(info)} /> + openShareModal(true)} /> @@ -308,10 +323,12 @@ export default function PhotoInformation({ info, url, api }) { {width}x{height}
- {api ?
- - {api.charAt(0).toUpperCase() + api.slice(1)} -
: null} + {api ? ( +
+ + {api.charAt(0).toUpperCase() + api.slice(1)} +
+ ) : null}
) : null} diff --git a/src/components/widgets/quote/Quote.jsx b/src/components/widgets/quote/Quote.jsx index e0e60479..09772c2c 100644 --- a/src/components/widgets/quote/Quote.jsx +++ b/src/components/widgets/quote/Quote.jsx @@ -13,6 +13,7 @@ import { toast } from 'react-toastify'; //import Hotkeys from 'react-hot-keys'; import Tooltip from '../../helpers/tooltip/Tooltip'; +import Modal from 'react-modal'; import ShareModal from '../../helpers/sharemodal/ShareModal'; import offline_quotes from './offline_quotes.json'; @@ -21,12 +22,13 @@ import Interval from 'modules/helpers/interval'; import EventBus from 'modules/helpers/eventbus'; import './quote.scss'; +import { getInitColorSchemeScript } from '@mui/material'; export default class Quote extends PureComponent { buttons = { share: ( - @@ -90,7 +92,7 @@ export default class Quote extends PureComponent { quote: '"' + quote.quote + '"', author: quote.author, authorlink: this.getAuthorLink(quote.author), - authorimg: '' + authorimg: '', }); } @@ -405,6 +407,16 @@ export default class Quote extends PureComponent { render() { return (
+ this.setState({ shareModal: false })} + > + this.setState({ shareModal: false })} /> + {this.state.quote}