space-y: child 요소 사이에 수직 방향으로 간격을 추가
📌 css 속성
💡 높이를 고려하고 싶지 않다면?
aspect-square rounded-full => 원 모양
aspect-video => 유튜브 화면 비율 16:9와 같이 높이를 자동으로 줌.
// layout.tsx
const router = useRouter()
const onClick = () => {
router.back()
}
{canGoBack ? (
<button onClick={onClick}>
// pages>items>[id].tsx
const ItemDetail: NextPage = () => {
return (
<Layout canGoBack>
<div className="px-4 py-10">
<div className="mb-8">
{/* 상품 이미지 */}
<div className="h-96 bg-slate-300" />
Layout 컴포넌트의 프롭으로 canGoBack을 생성한다.
뒤로가기 버튼이 필요한 페이지를 Layout 컴포넌트로 감싸주고 canGoBack을 넣어주자.