39 lines
758 B
TypeScript
39 lines
758 B
TypeScript
|
import React, {useState, useEffect} from 'react';
|
||
|
|
||
|
interface ClickMeProps {
|
||
|
windowSize: number;
|
||
|
setTrigger: any;
|
||
|
}
|
||
|
|
||
|
/**
|
||
|
* @return {jsx} a presentation of me
|
||
|
*/
|
||
|
export default function ClickMe({windowSize, setTrigger}: ClickMeProps) {
|
||
|
const [buttonClass, setButtonClass] = useState('');
|
||
|
|
||
|
useEffect(() => {
|
||
|
if (window.innerWidth > 1200) {
|
||
|
setButtonClass('btn-lg');
|
||
|
} else {
|
||
|
setButtonClass('');
|
||
|
}
|
||
|
}, [windowSize]);
|
||
|
|
||
|
return (
|
||
|
<div
|
||
|
className='
|
||
|
tile-child d-flex
|
||
|
flex-column
|
||
|
align-items-center
|
||
|
justify-content-center'
|
||
|
id='clickme'>
|
||
|
<button
|
||
|
type='button'
|
||
|
onClick={() => setTrigger(Math.random())}
|
||
|
className={'d-inline btn btn-clickme ' + buttonClass}>
|
||
|
Click me !
|
||
|
</button>
|
||
|
<br />
|
||
|
</div>
|
||
|
);
|
||
|
};
|