diff options
| author | Andrew Lee <andrew@alee14.me> | 2026-09-13 16:36:23 -0400 |
|---|---|---|
| committer | Andrew Lee <andrew@alee14.me> | 2026-09-13 16:36:23 -0400 |
| commit | 311df1d170a59252691a5938541aa3d2e22067cc (patch) | |
| tree | 94efd1ce0cf55edf96b44014e35b49ea8670394a /src/components/Shifter.tsx | |
| parent | d9b5c7c7cd328217435aef751fbf277fff44b769 (diff) | |
| download | shiftos-archive-website-311df1d170a59252691a5938541aa3d2e22067cc.tar.gz shiftos-archive-website-311df1d170a59252691a5938541aa3d2e22067cc.tar.bz2 shiftos-archive-website-311df1d170a59252691a5938541aa3d2e22067cc.zip | |
Revamped history page; removed shifter easter egg
Diffstat (limited to 'src/components/Shifter.tsx')
| -rw-r--r-- | src/components/Shifter.tsx | 99 |
1 files changed, 0 insertions, 99 deletions
diff --git a/src/components/Shifter.tsx b/src/components/Shifter.tsx deleted file mode 100644 index 940e6f0..0000000 --- a/src/components/Shifter.tsx +++ /dev/null @@ -1,99 +0,0 @@ -import React, { useState, useRef } from 'react'; -import { sidebarContent } from './Shifter/Sidebar'; -import '../styles/shifter.css'; - -export default function Shifter() { - const [sidebar, setSidebar] = useState(0); - const [position, setPosition] = useState({ - x: window.innerWidth / 2 - 350, - y: window.innerHeight / 2 - 250 - }); - const [isDragging, setIsDragging] = useState(false); - const dragRef = useRef({ startX: 0, startY: 0 }); - - function changeSidebar(window: number) { - setSidebar(window); - } - - function applyButton() { - - } - - function closeButton() { - - } - - function testOption() { - console.log('Colour changed to red') - - document.documentElement.style.setProperty( - '--titlebar-colour', - 'red' - ); - - localStorage.setItem("--titlebar-colour", "red"); - - } - - const handleMouseDown = (e: React.MouseEvent) => { - e.preventDefault(); - setIsDragging(true); - dragRef.current = { - startX: e.clientX - position.x, - startY: e.clientY - position.y - }; - }; - - React.useEffect(() => { - if (isDragging) { - const handleMouseMoveWrapper = (e: MouseEvent) => { - setPosition({ - x: e.clientX - dragRef.current.startX, - y: e.clientY - dragRef.current.startY - }); - }; - - const handleMouseUpWrapper = () => { - setIsDragging(false); - }; - - window.addEventListener('mousemove', handleMouseMoveWrapper); - window.addEventListener('mouseup', handleMouseUpWrapper); - - return () => { - window.removeEventListener('mousemove', handleMouseMoveWrapper); - window.removeEventListener('mouseup', handleMouseUpWrapper); - }; - } - }, [isDragging]); - - return ( - <> - <div className="window draggable" style={{ - left: `${position.x}px`, - top: `${position.y}px` - }}> - <div className="titlebar" onMouseDown={handleMouseDown}> - <div className="titlebar-text">Shifter</div> - <div className="titlebar-buttons"> - <div className="titlebar-box titlebar-box-link" onClick={() => closeButton()}></div> - </div> - </div> - <div className="content"> - <div className="sidebar"> - <aside className="sidebar-content"> - <a href="#windows" className="sidebar-button" onClick={() => changeSidebar(1)}>Windows</a> - <div className="sep"/> - <a href="#reset" className="sidebar-button" onClick={() => changeSidebar(2)}>Reset</a> - <div className="sep"/> - </aside> - <a href="#apply" className="shifter-button" onClick={() => applyButton()}>Apply Changes</a> - </div> - <div className="shifter-body"> - {sidebarContent(sidebar)} - </div> - </div> - </div> - </> - ) -} |
