mingle/mingle-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix : 웹사이트 반응형 부분 수정

Browse Source
This commit is contained in:
KINDNICK 2025-07-18 01:59:06 +09:00
parent 96cb08104c
commit 90abd75149
2 changed files with 53 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
index.html
View File

@ -188,9 +188,9 @@
<body> <body>
<nav class="navbar"> <nav class="navbar">
<div class="nav-container"> <div class="nav-container">
<div class="nav-logo" style="display:flex;align-items:center;gap:0.7rem;"> <div class="nav-logo" style="display:flex;align-items:center;gap:0.7rem;flex-shrink:0;">
<img src="mingle logo.webp" alt="밍글 스튜디오 로고" style="height:38px;width:auto;display:inline-block;vertical-align:middle;"> <img src="mingle logo.webp" alt="밍글 스튜디오 로고" style="height:38px;width:auto;display:inline-block;vertical-align:middle;object-fit:contain;">
<span style="font-size:1.3rem;font-weight:700;color:#ff8800;letter-spacing:0.01em;">밍글 스튜디오</span> <span style="font-size:1.3rem;font-weight:700;color:#ff8800;letter-spacing:0.01em;white-space:nowrap;">밍글 스튜디오</span>
</div> </div>
<ul class="nav-menu"> <ul class="nav-menu">
<li><a href="#about">About</a></li> <li><a href="#about">About</a></li>
@ -378,8 +378,8 @@
<ul style="margin-bottom:2rem;padding-left:1.5rem;"> <ul style="margin-bottom:2rem;padding-left:1.5rem;">
<li style="margin-bottom:0.5rem;">본 촬영 전 모션캡쳐 수트 착용 등의 준비시간이 소요되므로 촬영예정 시간 최소 30분 전에 방문 부탁드립니다. (준비시간은 이용시간에 포함되지 않습니다)</li> <li style="margin-bottom:0.5rem;">본 촬영 전 모션캡쳐 수트 착용 등의 준비시간이 소요되므로 촬영예정 시간 최소 30분 전에 방문 부탁드립니다. (준비시간은 이용시간에 포함되지 않습니다)</li>
<li style="margin-bottom:0.5rem;">안경, 귀걸이 등 반사가 잘 되는 재질의 악세사리는 촬영 시 가급적 착용을 자제하여 주시기 바랍니다.</li> <li style="margin-bottom:0.5rem;">안경, 귀걸이 등 반사가 잘 되는 재질의 악세사리는 촬영 시 가급적 착용을 자제하여 주시기 바랍니다.</li>
</ul> </ul>
</div> </div>
<!-- 스튜디오 이용 시 유의사항 --> <!-- 스튜디오 이용 시 유의사항 -->
<div class="card"> <div class="card">

48
styles.css
View File

@ -39,6 +39,29 @@ body {
align-items: center; align-items: center;
} }
.nav-logo {
display: flex;
align-items: center;
gap: 0.7rem;
flex-shrink: 0;
}
.nav-logo img {
height: 38px;
width: auto;
display: inline-block;
vertical-align: middle;
object-fit: contain;
}
.nav-logo span {
font-size: 1.3rem;
font-weight: 700;
color: #ff8800;
letter-spacing: 0.01em;
white-space: nowrap;
}
.nav-logo h2 { .nav-logo h2 {
color: #6366f1; color: #6366f1;
font-weight: 700; font-weight: 700;
@ -671,6 +694,19 @@ section {
display: flex; display: flex;
} }
.nav-logo {
flex-shrink: 0;
min-width: 0;
}
.nav-logo img {
height: 32px;
}
.nav-logo span {
font-size: 1.1rem;
}
.nav-menu { .nav-menu {
position: fixed; position: fixed;
left: -100%; left: -100%;
@ -726,6 +762,18 @@ section {
} }
@media (max-width: 480px) { @media (max-width: 480px) {
.nav-logo {
gap: 0.5rem;
}
.nav-logo img {
height: 28px;
}
.nav-logo span {
font-size: 1rem;
}
.hero-title { .hero-title {
font-size: 2rem; font-size: 2rem;
} }