make startbutton prettier
This commit is contained in:
parent
4095189e8f
commit
64c777a38e
@ -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]}
|
||||
/>
|
||||
})}
|
||||
<Link to={'/level/' + levels[activeIdx].name}>start</Link>
|
||||
<Link to={'/level/' + levels[activeIdx].name} className="start-button">
|
||||
|
||||
<span> start </span>
|
||||
<Play size={20} />
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
</div>)
|
||||
|
||||
@ -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;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user