공지사항/FAQ 상세 페이지 HTML 콘텐츠 모바일 반응형 정제 기능 추가
- HTML 정제 유틸리티 함수 추가 (sanitizeHtmlContent) - PC 웹용 인라인 스타일 제거 (color/background-color는 유지) - 텍스트 기반 구분선(---, ===)을 HTML <hr> 태그로 자동 변환 - 이미지 및 링크 반응형 클래스 추가 - 연속된 공백/줄바꿈 정리 - 모바일 최적화 CSS 스타일 추가 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -2527,8 +2527,75 @@ div .credit-period {
|
||||
white-space: pre-line;
|
||||
font-size: var(--fs-17);
|
||||
line-height: 1.3;
|
||||
color: var(--color-2D3436)
|
||||
color: var(--color-2D3436);
|
||||
overflow-x: hidden;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.notice-detail__body * {
|
||||
max-width: 100% !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.notice-detail__body img {
|
||||
height: auto !important;
|
||||
width: auto !important;
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
.notice-detail__body table {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.notice-detail__body pre {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
overflow-x: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.notice-detail__body .notice-content-img {
|
||||
display: block;
|
||||
margin: 16px auto;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.notice-detail__body .notice-content-link {
|
||||
color: var(--color-0083FF);
|
||||
text-decoration: underline;
|
||||
word-break: break-all;
|
||||
display: inline-block;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
.notice-detail__body p {
|
||||
margin: 8px 0;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.notice-detail__body strong {
|
||||
font-weight: 600;
|
||||
color: var(--color-2D3436);
|
||||
}
|
||||
|
||||
.notice-detail__body br + br {
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.notice-detail__body .text-divider {
|
||||
border: none;
|
||||
border-top: 1px solid var(--color-EaEaEa);
|
||||
margin: 20px 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.notice-alert {
|
||||
padding: 14px 16px;
|
||||
background: var(--color-F4F8FF);
|
||||
@@ -5773,6 +5840,72 @@ ul.txn-amount-detail li span:last-child {
|
||||
.faq-detail__body {
|
||||
font-size: var(--fs-17);
|
||||
color: var(--color-2D3436);
|
||||
overflow-x: hidden;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.faq-detail__body * {
|
||||
max-width: 100% !important;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.faq-detail__body img {
|
||||
height: auto !important;
|
||||
width: auto !important;
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
.faq-detail__body table {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.faq-detail__body pre {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
overflow-x: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.faq-detail__body .faq-content-img {
|
||||
display: block;
|
||||
margin: 16px auto;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.faq-detail__body .faq-content-link {
|
||||
color: var(--color-0083FF);
|
||||
text-decoration: underline;
|
||||
word-break: break-all;
|
||||
display: inline-block;
|
||||
margin: 4px 0;
|
||||
}
|
||||
|
||||
.faq-detail__body p {
|
||||
margin: 8px 0;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.faq-detail__body strong {
|
||||
font-weight: 600;
|
||||
color: var(--color-2D3436);
|
||||
}
|
||||
|
||||
.faq-detail__body br + br {
|
||||
display: block;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.faq-detail__body .text-divider {
|
||||
border: none;
|
||||
border-top: 1px solid #EAEAEA;
|
||||
margin: 20px 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/* 117 1:1 문의 */
|
||||
|
||||
Reference in New Issue
Block a user