50 lines
1.7 KiB
TypeScript
50 lines
1.7 KiB
TypeScript
// ---------------------------------------------------------------------------------------------------------------------
|
|
//! Imports
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
|
|
// ----------------------------------------------------- Assets --------------------------------------------------------
|
|
import Close from '../../assets/close';
|
|
import './styles.scss';
|
|
// ---------------------------------------------------------------------------------------------------------------------
|
|
|
|
const Help = ({ onClose }: { onClose: () => void }) => {
|
|
return (
|
|
<div
|
|
className='helpContainer'
|
|
onClick={onClose}
|
|
>
|
|
<div
|
|
className='helpPopup'
|
|
onClick={(ev) => ev.stopPropagation()}
|
|
>
|
|
<div className='header'>
|
|
<p className='headerTitle'>Comment jouer ?</p>
|
|
<button
|
|
className='closeButton'
|
|
onClick={onClose}
|
|
>
|
|
<Close />
|
|
</button>
|
|
</div>
|
|
<div className='content'>
|
|
<p>
|
|
Pour commencer, il suffit de cliquer n'importe où sur la grille.
|
|
<br />
|
|
Les cases vides vont alors se dévoiler jusqu'à atteindre les cases contenant des numéros.
|
|
<br />
|
|
<br />
|
|
Chaque numéro indique que dans les 8 cases autour de celle-ci, il y a X bombes (numéro affiché).
|
|
<br />
|
|
Le but est de dévoiler toute la grille sans faire exploser une bombe en cliquant dessus.
|
|
<br />
|
|
<br />
|
|
Pour éviter tout accident, vous pouvez poser un drapeau sur les cases où vous pensez qu'il y a une bombe en faisant clic droit. Le clic sera alors désactivé jusqu'à ce que vous retiriez le drapeau.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Help;
|