Make current phase more obvious
This commit is contained in:
@@ -37,9 +37,22 @@ const Phase: FC<PropType> = ({ phase, current }) => {
|
|||||||
{thisSelected && <div className="text-md px-8">{phase.description}</div>}
|
{thisSelected && <div className="text-md px-8">{phase.description}</div>}
|
||||||
{current && (
|
{current && (
|
||||||
<>
|
<>
|
||||||
<div className="rotate-45 bg-white h-16 w-16 absolute -top-10 -left-12"></div>
|
{/* TL Corner */}
|
||||||
<div className="-rotate-45 bg-white h-16 w-16 absolute -bottom-10 -left-12"></div>
|
<div className="rotate-45 bg-white h-16 w-16 absolute -top-12 -left-12"></div>
|
||||||
<div className="bg-white w-16 absolute bottom-0 top-0 -left-14"></div>
|
{/* T Side */}
|
||||||
|
<div className="bg-white h-1 absolute top-0 left-0 right-0"></div>
|
||||||
|
{/* TR Corner */}
|
||||||
|
<div className="rotate-45 bg-white h-16 w-16 absolute -top-12 -right-12"></div>
|
||||||
|
{/* R Side */}
|
||||||
|
<div className="bg-white w-1 absolute bottom-0 top-0 right-0"></div>
|
||||||
|
{/* BR Corner */}
|
||||||
|
<div className="-rotate-45 bg-white h-16 w-16 absolute -bottom-12 -right-12"></div>
|
||||||
|
{/* B Side */}
|
||||||
|
<div className="bg-white h-1 absolute bottom-0 left-0 right-0"></div>
|
||||||
|
{/* BL Corner */}
|
||||||
|
<div className="-rotate-45 bg-white h-16 w-16 absolute -bottom-12 -left-12"></div>
|
||||||
|
{/* L Side */}
|
||||||
|
<div className="bg-white w-1 absolute bottom-0 top-0 left-0"></div>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
Reference in New Issue
Block a user