RoomHeader.js

import { Link } from 'react-router-dom'

const RoomHeader = () => {
  return (
    <div
      className="d-flex justify-content-between align-items-center p-2"
      style={{ backgroundColor: '#C4C4C4', height: "60px" }}
    >
      <div className="d-flex align-items-center">
        <img
          className="rounded-circle"
          src="/cherry.jpg"
          width="40px"
          height="40px"
        />
        <a
          className="p-3 ms-1 text-center text-decoration-none"
          style={{
            fontWeight: 'bold',
            fontSize: '15px',
            overflow: 'scroll',
            whiteSpace: 'nowrap',
            width: '280px',
            color: '#000000',
          }}
        >
          데계데계데계데계데계데계데계데계데계데계 재밌는 수학과
        </a>
      </div>
      <a
        className="text-decoration-none"
        style={{ fontWeight: 'bold', fontSize: '20px', color: '#6c33a2' }}
      >
        # 회의
      </a>
    </div>
  )
}

export default RoomHeader