Created with Tailwind CSS and React.js

Community feedback

• 

  Ren Ras•420

  @renrasPosted almost 3 years ago

  Keep your code dry.

  In your keypad component, these buttons can be mapped instead.

  const clickHandler = () => {
    //put logic here
    //use if else to add logic depending on the type of button
  }
  
  //render
  {buttons.map(button => {
   return (
     <Button onClick={clickHandler}></Button>
  )
  )}
  

  // classnames

  <div className={ 
          theme === 1 ? "flex justify-center w-full h-screen theme1-bg" : 
          theme === 2 ? "flex justify-center w-full h-screen theme2-bg" :
          "flex justify-center w-full h-screen theme3-bg"
         }>
  
  

  // you can refractor this into

  <div className={
     `flex justify-center w-full h-screen 
     ${themebg}
  `
  

  you can make a separate state for theme-bg depending on the current theme

  Marked as helpful

  0

  ---

  

  Paul Andres•660

  @paulpdoaPosted almost 3 years ago

  @renras thanks bro will try it :)

  0