diff --git a/src/components/LevelSelectScreen.tsx b/src/components/LevelSelectScreen.tsx index 53c129b..c21c181 100644 --- a/src/components/LevelSelectScreen.tsx +++ b/src/components/LevelSelectScreen.tsx @@ -5,6 +5,7 @@ import { connect } from "react-redux"; import { levels } from "../game/levels"; import { Route, Link } from "react-router-dom"; import LevelPreview from "./LevelPreview" +import { Play } from "lucide-react"; const LevelItem = ({ level, idx, cb, active, unlocked }) => { @@ -44,7 +45,11 @@ const LevelSelectScreen = ({saveState}) =>{ unlocked={unlockedState[idx]} /> })} - start + + + start + + ) diff --git a/src/index.css b/src/index.css index 2e9b238..f9414ca 100644 --- a/src/index.css +++ b/src/index.css @@ -390,3 +390,30 @@ h1 { .gameName { margin-top:4rem; } + +.start-button { + display: flex; + align-items: center; + justify-content: center; + gap: 0.5rem; + margin: 1.5rem auto 0; + padding: 0.7rem 2rem; + background: #2a7; + border: none; + border-radius: 0.4rem; + font-size: 1.1rem; + font-weight: 600; + color: #fff; + text-decoration: none; + cursor: pointer; + transition: all 0.15s ease; + width:auto; +} + +.start-button:hover { + background: #3b8; +} + +.start-button span { + line-height: 1; +}