ScheduleItem.js

import { Link } from "react-router-dom";
import styles from "./schedule.module.scss";

const ScheduleItem = () => {
    return (
        <div className="accordion-item border-bottom-0">
            <button className={`d-flex flex-column align-items-start accordion-button collapsed bg-white shadow-none px-0 ${styles.activeBtn}`} type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
                <h5 className={`accordion-header ${styles.title}`} id="flush-headingOne">
                    Accordion Item #1sadsadsadasdsadsadasasadsad
                </h5>
                <p className="text-secondary mb-0">sadsadsdsadsadsaf</p>
            </button>
            <div id="flush-collapseOne" className="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#scheduleList">
                <div className={`accordion-body text-break px-0 pt-2 ${styles.textBox}`}>
                    <div className="d-flex align-items-start">
                        <i className="col bi bi-geo-alt fs-5"></i>
                        <div className="col-11">
                            sadsadsadsa
                        </div>
                    </div>
                    dlkasjflsajflasjflsakfjlsajflalsafjsask<br />fjlakdjflajflaksjlksajdlksajdslkafjlsakflksjflasjflksjslakjflsakjflsajflsakjlasjflksajlfsja
                    <div className="d-flex justify-content-end mt-2">
                        <Link className="btn btn-white btn-sm border-dark" to="/schedule/edit">수정</Link>
                        <button type="button" className="btn btn-crimson btn-sm ms-2">삭제</button>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default ScheduleItem