diff --git a/src/App.tsx b/src/App.tsx index dd560ea..847b8a5 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -26,6 +26,8 @@ const StartWrapper = styled.div` `; const PlayWrapper = styled.div` + position: relative; + z-index: 0; max-width: fit-content; max-height: fit-content; @media (orientation: portrait) { @@ -39,6 +41,13 @@ const removeLocalStorage = async () => { localStorage.removeItem('playing'); }; +const EmergencyResetButton = styled.button` + position: absolute; + right: 0; + bottom: 0; + z-index: -1; +`; + const App = () => { const analytics = useAnalytics(); const savedPlayers = localStorage.getItem('players'); @@ -105,6 +114,9 @@ const App = () => { goToStart={goToStart} wakeLock={wakeLock} /> + + Go To Start + ) : ( diff --git a/src/Components/Counters/Counters.tsx b/src/Components/Counters/Counters.tsx index 853163f..fd31baa 100644 --- a/src/Components/Counters/Counters.tsx +++ b/src/Components/Counters/Counters.tsx @@ -28,14 +28,6 @@ export const GridItemContainer = styled.div<{ grid-area: ${(props) => props.$gridArea}; `; -export const SettingsButtonContainer = styled.div` - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - z-index: 9; -`; - type CountersProps = { players: Player[]; onPlayerChange: (updatedPlayer: Player) => void; diff --git a/src/Components/Views/Play.tsx b/src/Components/Views/Play.tsx index bc8b185..7830872 100644 --- a/src/Components/Views/Play.tsx +++ b/src/Components/Views/Play.tsx @@ -4,6 +4,8 @@ import { Player } from '../../Types/Player'; import { WakeLock } from '../../Types/WakeLock'; const MainWrapper = styled.div` + width: 100vmax; + height: 100vmin; width: 100dvmax; height: 100dvmin; overflow: hidden;