diff --git a/src/components/Desktop.js b/src/components/Desktop.js index fd48ba1..7419194 100644 --- a/src/components/Desktop.js +++ b/src/components/Desktop.js @@ -5,7 +5,7 @@ import Notepad from './Notepad'; import '../App.css'; import { EventEmitter } from './EventEmitter'; import { Modal } from '@react95/core'; -import { Explorer100, FlyingThroughSpace100, FolderExe2, FolderFile, Mail3, Network2, QuestionBubble, Time, Timedate200, Url105 } from '@react95/icons'; +import { Explorer100, FlyingThroughSpace100, FolderExe2, FolderFile, InfoBubble, Mail3, Network2, QuestionBubble, Time, Timedate200, Url105 } from '@react95/icons'; import DesktopIcon from './DesktopIcon'; function WebsiteDesktop(props) { @@ -13,6 +13,7 @@ function WebsiteDesktop(props) { const isMobile = window.innerWidth < 850; const [openEditors, setOpenEditors] = useState([]); + const [closeInfo, setCloseInfo] = useState(true); const editors = [ { id: 'about', name: 'About', ico: }, @@ -33,14 +34,15 @@ function WebsiteDesktop(props) { openNotepad(editor) }); }); + // eslint-disable-next-line }, []); const getNextX = (n) => { - return `${15 + 5 * n}%` + return `${35 + 5 * n}%` } const getNextY = (n) => { - return `${20 + 5 * n}%` + return `${15 + 5 * n}%` } const closeNotepad = (id) => { @@ -79,6 +81,21 @@ function WebsiteDesktop(props) { + { closeInfo && ( + } + title={`info`} + closeModal={() => setCloseInfo(false)} + style={{ + left: isMobile ? '50%' : '10%', + top: isMobile ? '30%' : '25%', + width: isMobile ? '90%' : 450, + }}> +
+ This website is best viewed on a laptop or PC. +
+
+ )} {openEditors.map((editor, idx) => ( - - - ) +function Notepad({ ico, closeNotepad, selectedItem, isMobile, left, top, focused }) { + return ( + + + + ); } -export default Notepad \ No newline at end of file +export default Notepad; diff --git a/src/components/Taskbar.js b/src/components/Taskbar.js index 53a89cf..5315196 100644 --- a/src/components/Taskbar.js +++ b/src/components/Taskbar.js @@ -19,7 +19,7 @@ export default function WebsiteTaskbar(props) { return ( }> - Programs + handleClick('programs')}>Programs } onClick={() => handleClick('etf')}> ETF Network