✨ Feature - Header, Footer Publishing

[Kimd0ng]

관련 이슈

• Resolves : [ Feature ] - Header, Footer 제작 #5

작업 사항

• 두가지 상태의 header 제작

• 모바일의 두가지 상태의 header 제작

참고 사항

• Footer Publishing은 추후 다듬어지면 다시 진행
• page마다 해당 코드들 있는데 page만들때 다 지우시면 됩니다.

{/* 헤더 */}
      <header className='w-full py-4 px-8 flex justify-between items-center border-b border-gray-800'>
        {/* 로고 */}

        {/* 네비게이션 메뉴 */}
        <nav className='hidden md:flex gap-6 text-sm'>
          <a href='#' className='hover:text-gray-300 transition'>
            세미나
          </a>
          <a href='#' className='hover:text-gray-300 transition'>
            프로젝트
          </a>
          <a href='#' className='hover:text-gray-300 transition'>
            스터디
          </a>
          <a href='#' className='hover:text-gray-300 transition'>
            Techblog
          </a>
          <a href='#' className='hover:text-gray-300 transition'>
            멤버
          </a>
        </nav>

        {/* 지원하기 버튼 */}
        <a
          href='#'
          className='hidden md:flex items-center px-4 py-2 border border-gray-600 rounded-full hover:bg-gray-800 transition'
        >
          지원하기 →
        </a>

        {/* 모바일 메뉴 (햄버거) */}
        <button className='md:hidden text-white'>
          <svg
            xmlns='http://www.w3.org/2000/svg'
            fill='none'
            viewBox='0 0 24 24'
            stroke='currentColor'
            width={28}
            height={28}
          >
            <path strokeLinecap='round' strokeLinejoin='round' strokeWidth={2} d='M4 6h16M4 12h16m-7 6h7' />
          </svg>
        </button>
      </header>

[github-actions]

🚀 Storybook 확인 🚀
🔗 https://67dce69f64133625b55bd772-qhtrorvxbg.chromatic.com/

[leejs0823]

LGTM

[Taew00k]

LGTM