introducing help component
This commit is contained in:
parent
152b97dc71
commit
29e973a4f1
14
src/assets/css/components/Help.scss
Normal file
14
src/assets/css/components/Help.scss
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
.help {
|
||||||
|
@apply absolute top-0 right-0 z-10 flex items-center gap-x-3 py-2 px-3 text-zuume text-xl pr-6;
|
||||||
|
transform: translate(3px, -2px);
|
||||||
|
&:after {
|
||||||
|
@apply block bg-white w-full h-full absolute top-0 left-0 z-0;
|
||||||
|
content: "";
|
||||||
|
|
||||||
|
transform: perspective(150px) rotateY(7deg);
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
&__icon {
|
||||||
|
@apply w-10 h-10 object-contain object-center;
|
||||||
|
}
|
||||||
|
}
|
||||||
10
src/components/game/Help.jsx
Normal file
10
src/components/game/Help.jsx
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
import React from "react";
|
||||||
|
import helpIcon from "../../assets/img/icons/help-icon.svg";
|
||||||
|
export default function Help() {
|
||||||
|
return (
|
||||||
|
<div className='help'>
|
||||||
|
<img className="help__icon" src={helpIcon} alt='' />
|
||||||
|
Aide
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user