틀:메시지/styles.css: 두 판 사이의 차이
식물 vs 좀비 위키
imported>Ljyee 편집 요약 없음 |
imported>Ljyee 편집 요약 없음 |
||
| 15번째 줄: | 15번째 줄: | ||
width: 90%; | width: 90%; | ||
max-width: | max-width: 720px; | ||
margin: 24px auto; | margin: 24px auto; | ||
| 97번째 줄: | 97번째 줄: | ||
color: var(--message-text); | color: var(--message-text); | ||
font-size: | font-size: 1em; | ||
line-height: 1.58; | line-height: 1.58; | ||
text-align: left; | text-align: left; | ||
| 108번째 줄: | 108번째 줄: | ||
color: var(--message-text); | color: var(--message-text); | ||
font-size: inherit; | font-size: inherit; | ||
line-height: 1; | line-height: 1.55; | ||
text-align: left; | text-align: left; | ||
} | } | ||
| 163번째 줄: | 163번째 줄: | ||
} | } | ||
/* 다크모드 대응 끝 */ | /* 다크모드 대응 끝 */ | ||
/* 아이폰 가로 화면 부근 대응 시작 */ | |||
@media (min-width: 750px) and (max-width: 900px) { | |||
.pvz-message { | |||
grid-template-columns: 100px minmax(0, 1fr); | |||
} | |||
.pvz-message-tag { | |||
padding: 12px 8px 12px 30px; | |||
} | |||
.pvz-message-hole { | |||
width: 20px; | |||
height: 20px; | |||
} | |||
} | |||
/* 아이폰 가로 화면 부근 대응 끝 */ | |||
/* 반응형 대응 시작 */ | /* 반응형 대응 시작 */ | ||
@media (max-width: | @media (max-width: 749px) { | ||
.pvz-message { | .pvz-message { | ||
grid-template-columns: | grid-template-columns: 112px minmax(0, 1fr); | ||
width: 100%; | |||
max-width: none; | |||
margin-left: 0; | |||
margin-right: 0; | |||
} | } | ||
.pvz-message-tag { | .pvz-message-tag { | ||
padding: | padding: 16px 10px 16px 38px; | ||
} | } | ||
.pvz-message-card { | .pvz-message-card { | ||
padding: 12px 10px 10px 12px; | padding: 12px 10px 10px 12px; | ||
} | } | ||
.pvz-message-content { | .pvz-message-content { | ||
padding: 5px 0 0 6px; | padding: 5px 0 0 6px; | ||
font-size: | font-size: 1em; | ||
line-height: 1.55; | line-height: 1.55; | ||
} | } | ||
| 193번째 줄: | 211번째 줄: | ||
grid-template-columns: 112px minmax(0, 1fr); | grid-template-columns: 112px minmax(0, 1fr); | ||
width: | width: 100%; | ||
max-width: | max-width: none; | ||
margin: 18px | margin: 18px 0; | ||
filter: drop-shadow(4px 5px 3px rgba(0, 0, 0, 0.18)); | filter: drop-shadow(4px 5px 3px rgba(0, 0, 0, 0.18)); | ||
| 223번째 줄: | 241번째 줄: | ||
.pvz-message-content { | .pvz-message-content { | ||
padding: 4px 0 0 5px; | padding: 4px 0 0 5px; | ||
font-size: | font-size: 1em; | ||
line-height: 1.55; | line-height: 1.55; | ||
} | } | ||
