You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

47 lines
1.1 KiB

import React from 'react';
import '../../../components/style/fontsize.scss';
function ButtonIncrement(props) {
return (
<p type='button' outline onClick={props.onClickFunc} style={{padding: '0px 5px'}}>
+
</p>
)
}
function ButtonDecrement(props) {
return (
<p type='button' outline onClick={props.onClickFunc} style={{padding: '0px 5px'}}>
-
</p>
)
}
function Display(props) {
return (
<label >{props.message}</label>
)
}
const Fontsize = (props) => {
const {countersize, setCounter} = props;
const incrementCounter = () => setCounter(countersize + 1);
let decrementCounter = () => setCounter(countersize - 1);
if(countersize <= 1) {
decrementCounter = () => setCounter(1);
}
return (
<div className='nav-fontBtn'>
<nav>
<ButtonIncrement onClickFunc={incrementCounter}/>
<Display message={countersize}/>
<ButtonDecrement onClickFunc={decrementCounter}/>
</nav>
</div>
)
}
export default Fontsize