미디어위키:Common.css: 두 판 사이의 차이
편집 요약 없음 |
편집 요약 없음 |
||
35번째 줄: | 35번째 줄: | ||
/* 여백 정리 (선택) */ | /* 여백 정리 (선택) */ | ||
.skin-vector-2022 .mw-logo-wordmark { margin-left: 0 !important; } | .skin-vector-2022 .mw-logo-wordmark { margin-left: 0 !important; } | ||
/* 배경(히어로) 영역 */ | |||
.main-hero { | |||
position: relative; | |||
padding: 48px 16px; /* 위아래 여백 */ | |||
background: linear-gradient(180deg,#0f1220 0%, #171b29 100%); /* 배경색/그라데이션 */ | |||
} | |||
/* 배경 이미지를 쓰고 싶다면(선택) — 이미지 경로만 바꾸면 됩니다 */ | |||
.main-hero { | |||
background: url(/images/site/hero.jpg) center/cover no-repeat fixed; | |||
} | |||
/* 가운데 카드 박스(본문) */ | |||
.main-card { | |||
max-width: 980px; /* 카드 최대 가로 폭 */ | |||
margin: 0 auto; /* 가운데 정렬 */ | |||
background: #fff; /* 박스 배경색(라이트) */ | |||
border: 1px solid rgba(0,0,0,.06); | |||
border-radius: 16px; | |||
box-shadow: 0 8px 24px rgba(0,0,0,.12); | |||
padding: 28px; | |||
} | |||
/* 다크 모드 대응(선택) */ | |||
@media (prefers-color-scheme: dark) { | |||
.main-card { | |||
background: #161a22; | |||
border-color: rgba(255,255,255,.06); | |||
box-shadow: 0 8px 24px rgba(0,0,0,.28); | |||
} | |||
} | |||
/* 반응형(선택) — 모바일은 여백만 살짝 줄이기 */ | |||
@media (max-width: 720px) { | |||
.main-hero { padding: 28px 12px; } | |||
.main-card { padding: 20px; border-radius: 12px; } | |||
} |