diff --git a/src/views/Main.vue b/src/views/Main.vue index de11a50..626e78f 100644 --- a/src/views/Main.vue +++ b/src/views/Main.vue @@ -558,10 +558,29 @@ iframe { width: 100%; height: 180px; border-radius: 4px; } .project-grid { grid-template-columns: 1fr; } .auth-nav { flex-direction: column; gap: 12px; padding: 15px 20px; } - /* 🟒 κ°€λŸ­μ‹œ S24λ₯Ό ν¬ν•¨ν•œ λͺ¨λ°”일 ν™”λ©΄ λΉ„μœ¨ 맞좀 μžλ™ μΆ•μ†Œ */ + /* 🟒 [NEW] κ°€λŸ­μ‹œ S24 λ§žμΆ€ν˜• μ•„μŠ€ν‚€ μ „κ΄‘νŒ μ»¨ν…Œμ΄λ„ˆ 쑰율 */ + .ascii-container { + width: 100%; + height: 200px; /* πŸ‘ˆ μΆ•μ†Œλœ μ•„μŠ€ν‚€ μ•„νŠΈ 높이에 맞게 μ˜μ—­ κ³ μ • */ + display: flex; + justify-content: center; + align-items: center; + overflow: hidden; /* πŸ‘ˆ λΆˆν•„μš”ν•œ μŠ€ν¬λ‘€λ°” λ°©μ§€ */ + padding: 0; + } + + /* 🟒 [NEW] μ΅œμ†Œ 폰트 크기 μ œν•œ 및 곡백 깨짐을 μ›μ²œ μ°¨λ‹¨ν•˜λŠ” 크기 μ˜€λ²„λΌμ΄λ”© */ .ascii-art { - font-size: 1.6vw !important; /* πŸ‘ˆ 폭에 맞게 μ•½κ°„ 더 λ―Έμ„Έ μ‘°μ • */ + font-size: 14px !important; /* πŸ‘ˆ λ°μŠ€ν¬ν†± 가독성 λΉ„μœ¨(14px)을 κ·ΈλŒ€λ‘œ μœ μ§€ν•˜μ—¬ 곡백 깨짐 λ°©μ§€ */ line-height: 1.2 !important; + + /* 🌟 핡심: λͺ¨λ°”일 λΈŒλΌμš°μ €μ˜ 폰트 μ œν•œ μ‹œμŠ€ν…œμ„ λ¬΄μ‹œν•˜κ³ , 전체 λ ˆμ΄μ•„μ›ƒμ„ λΉ„μœ¨λŒ€λ‘œ μ••μΆ• */ + transform: scale(0.52) !important; + transform-origin: center center; + + white-space: pre !important; + width: max-content !important; + margin: 0 auto !important; } } @keyframes blink { 0%, 100% { opacity: 0.4; } 50% { opacity: 1; } }