<div className='flex justify-center items-center'>
<div className='calendarWrap' ref={dropdownRef}>
<input className='inputBox outline-none' value={calendar} readOnly onClick={() => setOpen(open => !open)} />
<Calendar className={`calendarElement ${open ? 'dropdown-calendar-active' : 'dropdown-calendar-inactive'}`}
onChange={handleSelect} color={'red'} date={new Date()} />
</div>
</div>
<div className='flex justify-center items-center'>
<div className='calendarWrap' ref={dropdownRef}>
<input className='inputBox outline-none' value={calendar} readOnly onClick={() => setOpen(open => !open)} />
<Calendar className={`calendarElement ${open ? 'dropdown-calendar-active' : 'dropdown-calendar-inactive'}`}
onChange={handleSelect} color={'red'} date={new Date()} />
</div>
</div>