DEV Community

Discussion on: Creating an Accordion Component in React with Typescript and TailwindCSS

View post
Collapse
 
ysuzuki19 profile image
ysuzuki19 •

HI,

thank you for sharing good component.

I think it is better to not have scrollbar when ease-in-out.

How about following code? (added overflow-y-hidden in className)

      <div
        ref={contentSpace}
        style={{ maxHeight: `${height}` }}
        className="overflow-auto overflow-y-hidden transition-max-height duration-700 ease-in-out"
      >
        <div className="pb-10">{content}</div>
      </div>
Enter fullscreen mode Exit fullscreen mode

Thanks!

Collapse
 
bionicjulia profile image
Bionic Julia •

Yes, that's a very good point! Thank you for the improvement suggestion. :)