Web4ai/o2o-site-AEO
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
872d00f3c4
o2o-site-AEO/solution/site/scripts/mockup/build5/index.html
Mina Choi 872d00f3c4 [feat] solution: 미니 블로그·이용후기·예약요청 추가, /s/stay 목업·발행 사이트 UI 다수 수정 
인앱 미니 블로그(AI 자동 포스트, 이메일 승인)·이용후기(즉시 게시)·예약 요청(메일 발송)을
새로 붙였고, 병행해서 /s/stay 목업과 발행 사이트 공통 렌더러(UnitsSection·FestivalSection·
LocalGuideSection·WeatherSection 등)의 UI 버그를 다수 고쳤다. 범위가 넓지만 한 주 분량
작업을 한 커밋으로 묶어 달라는 요청에 따라 하나로 묶는다.

- solution/backend: post/review/booking_request 라우터·서비스·CRUD 추가, 스케줄러에
  블로그 초안 생성(새벽 4:10)·발송(아침 9:00) cron 등록, 마이그레이션 4건 추가
- solution/frontend, admin/frontend: 생성된 API 클라이언트 갱신, 리뷰 모더레이션·
  블로그 글 관리 페이지 추가
- solution/site/src: 객실 상세+실시간예약(날짜선택·연락처 폼)을 모달로 통합, 축제·
  주변안내 카드 클릭 시 모달 전환, 후기 목록 카드 UI, 공용 Modal 컴포넌트 신설,
  날씨 문구 동기화 버그 수정(하늘줄·기온줄 한 타이머로), 시설·편의 가능/불가 아이콘
  색상 하이라이트, 헤더 메뉴 순서를 실제 섹션 순서에 맞춤, 하단 탭바 아이콘 정렬 버그
  (line-height) 수정, 추천일정 점선 연결+데스크톱 자동펼침/모바일 축소, 채널 라벨에
  크롤링 원문("NOL")이 새던 것을 bookingLabel() 로 교체
- solution/site/scripts/mockup: /s/stay 패치 스크립트·주입 CSS·JS 다수 수정, stay4~6
  빌드 스크립트 추가(다른 세션 작업)

테스트: solution/site `npx tsc --noEmit` 통과, `npx vitest run` 93 passed,
solution/backend `pytest tests/test_booking_request.py` 6 passed(로컬 DB 대상).
예약 요청 메일은 실제 발송까지 확인(place 66894a1b 소유자 이메일 누락을 DB에서 보정).
2026-09-18 09:03:18 +09:00

130 lines
18 KiB
HTML
Raw Blame History

<!DOCTYPE HTML>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>스테이,머뭄 · 전북 군산시 독채 펜션</title>
<meta name="description" content="1920년대 적산가옥을 고쳐 지은 독채 두 동, 매일 세탁·살균하는 침구" />
<link rel="canonical" href="https://web4ai.o2osolution.ai/s/stay5" />
<meta property="og:title" content="스테이,머뭄 · 전북 군산시 독채 펜션" />
<meta property="og:description" content="1920년대 적산가옥을 고쳐 지은 독채 두 동, 매일 세탁·살균하는 침구" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://web4ai.o2osolution.ai/s/stay5" />
<meta property="og:image" content="https://web4ai.o2osolution.ai/s/stay/img/mirror/ddc9f804f4ef83b5.jpg" />
<meta name="theme-color" content="#ffffff" />
<link rel="preconnect" href="https://cdn.jsdelivr.net" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Gugi&display=swap" />
<link rel="stylesheet" href="/s/stay5/assets/css/main.css" />
<link rel="stylesheet" href="/s/stay5/assets/css/meomoom.css" />
<noscript><link rel="stylesheet" href="/s/stay5/assets/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<header id="topbar">
<a class="brand" href="/s/stay5">스테이,머뭄</a>
<nav><a href="/s/stay5" class="on">소개</a><a href="/s/stay5/gunsan">군산</a><a href="/s/stay5/booking">예약·후기</a></nav>
</header>
<div id="wrapper" class="divided">
<section class="cover tall">
<img class="bg" src="/s/stay/img/mirror/ddc9f804f4ef83b5.jpg" alt="목재 서까래 천장과 미닫이창, 테이블이 있는 거실 공간" />
<div class="veil"></div>
<div class="inner">
<p class="kicker">군산시</p>
<h1 class="serif">스테이,머뭄</h1>
<p class="lead">히로쓰 가옥 담 너머, 백 년 된 집 한 채</p>
<ul class="actions stacked"><li><a href="#about" class="button large ghost">스테이,머뭄 소개</a></li></ul>
</div>
<span class="scrollhint" aria-hidden="true"></span>
</section>
<section class="cover mid chapter">
<img class="bg" src="/s/stay/img/h-01.jpg" alt="기와 지붕 아래로 넓은 우드 데크와 정원이 이어지는 외관" loading="lazy" />
<div class="veil"></div>
<div class="inner">
<h2 class="serif">스테이,머뭄 소개</h2>
<p>스테이,머뭄은 전북특별자치도 군산시 신흥동 절골길에 있는 독채 펜션입니다. 1920년대에 지어진 백 년 고택으로, 국가등록문화유산인 군산 신흥동 일본식 가옥(히로쓰 가옥) 후문 바로 옆 — 걸어서 13m 거리입니다. 사장님은 이 집이 히로쓰 가옥 관리인이 살던 집이라고 전합니다. 2024년 5월에 리모델링을 마치고 문을 열었고, A동과 B동 두 동을 각각 한 팀만 씁니다. 기준 2인 · 최대 4인까지 묵을 수 있습니다.</p>
</div>
</section>
<section class="wrapper style1 align-center ivory" id="about">
<div class="inner"><p class="prose">A동은 편안한 일본집에 와 있는 듯한 느낌의 공간이고, B동은 아늑하고 깔끔한 현대식 모던 스타일 공간입니다. 두 동 모두 독립된 아담한 정원과 창고형 CAFÉ 공간이 딸려 있어, 마당과 거실에서 새소리를 들으며 쉴 수 있습니다.</p><img class="wideshot" src="/s/stay/img/a-05.jpg" alt="붉은 벽돌 벽에 벤치와 색색 의자를 둔 창고형 카페 공간" loading="lazy" /><p class="prose">인테리어와 가구, 소품, 침구를 하나하나 준비해 두었습니다. 특히 침구류는 매일 세탁·살균하고 건조해 쓰시는 분이 바뀔 때마다 새것처럼 나갑니다.</p></div>
</section>
<section class="wrapper style1 align-center" id="units">
<div class="inner"><h2 class="serif">객실 안내</h2><div class="units">
<article class="unit">
<a class="shot" href="/s/stay5/booking#a">
<img src="/s/stay/img/mirror/6d0c447b6a0c32af.jpg" alt="소파와 탁자, 벽난로 조명이 있는 서까래 천장의 거실" loading="lazy" />
</a>
<div class="body">
<h3>A동</h3>
<p class="sub">일본식 가정집 느낌으로 디딤돌마당과 예쁜정원</p>
<ul class="chips"><li>기준 2명</li><li>최대 4명</li><li>퀸 침대 1개</li><li>52 m²</li></ul>
<p class="price">주중 1박 <b>198,000원</b></p>
<a class="button fit" href="/s/stay5/booking#a">A동 보기</a>
</div>
</article>
<article class="unit">
<a class="shot" href="/s/stay5/booking#b">
<img src="/s/stay/img/h-05.jpg" alt="문 사이로 보이는 흰 앤티크 침대와 검은 서랍장" loading="lazy" />
</a>
<div class="body">
<h3>B동</h3>
<p class="sub">모던한 현대식 컨셉으로 꾸며진 따뜻한 공간</p>
<ul class="chips"><li>기준 2명</li><li>최대 4명</li><li>킹 침대 1개</li></ul>
<p class="price">주중 1박 <b>198,000원</b></p>
<a class="button fit" href="/s/stay5/booking#b">B동 보기</a>
</div>
</article></div><ul class="actions"><li><a class="button primary" href="/s/stay5/booking">이용안내 및 예약</a></li></ul></div>
</section>
<section class="wrapper style1 align-center ivory" id="gallery">
<div class="inner"><h2 class="serif">사진 갤러리</h2><div class="gallery style2 medium lightbox onscroll-fade-in"><article><a href="/s/stay/img/mirror/ddc9f804f4ef83b5.jpg" class="image"><img src="/s/stay/img/mirror/ddc9f804f4ef83b5.jpg" alt="목재 서까래 천장과 미닫이창, 테이블이 있는 거실 공간" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/mirror/6d0c447b6a0c32af.jpg" class="image"><img src="/s/stay/img/mirror/6d0c447b6a0c32af.jpg" alt="소파와 탁자, 벽난로 조명이 있는 서까래 천장의 거실" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/mirror/2d94158a48480fcd.jpg" class="image"><img src="/s/stay/img/mirror/2d94158a48480fcd.jpg" alt="싱크대와 냉장고, 전자레인지가 구비된 실내 주방 공간" loading="lazy" /></a><div class="caption"><p>주방</p></div></article><article><a href="/s/stay/img/mirror/d364f605223524bd.jpg" class="image"><img src="/s/stay/img/mirror/d364f605223524bd.jpg" alt="주방 싱크대 앞에서 포즈를 취하고 있는 여성의 모습" loading="lazy" /></a><div class="caption"><p>주방</p></div></article><article><a href="/s/stay/img/mirror/e0ed8d1a27e09320.jpg" class="image"><img src="/s/stay/img/mirror/e0ed8d1a27e09320.jpg" alt="벽면에 설치된 그림 화면과 벽난로 조명 장식" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/mirror/aa69a633f8e3a631.jpg" class="image"><img src="/s/stay/img/mirror/aa69a633f8e3a631.jpg" alt="창밖으로 조명을 비춘 정원 나무와 석등이 보이는 풍경" loading="lazy" /></a><div class="caption"><p>전망</p></div></article><article><a href="/s/stay/img/mirror/7095220ca156e25e.jpg" class="image"><img src="/s/stay/img/mirror/7095220ca156e25e.jpg" alt="목재 서까래 천장에 설치된 조형적인 디자인의 조명 기구" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/mirror/caa5e076e7d56ec2.jpg" class="image"><img src="/s/stay/img/mirror/caa5e076e7d56ec2.jpg" alt="실내 벽면 홈 공간에 놓인 흰색 화병과 식물 장식" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/mirror/8e2ec99c433b6fe8.jpg" class="image"><img src="/s/stay/img/mirror/8e2ec99c433b6fe8.jpg" alt="실내 창문을 통해 바라본 푸른 하늘과 푸른 나무 풍경" loading="lazy" /></a><div class="caption"><p>전망</p></div></article><article><a href="/s/stay/img/h-01.jpg" class="image"><img src="/s/stay/img/h-01.jpg" alt="기와 지붕 아래로 넓은 우드 데크와 정원이 이어지는 외관" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/h-02.jpg" class="image"><img src="/s/stay/img/h-02.jpg" alt="동백이 핀 마당과 우드 파사드 현관으로 이어지는 데크" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/h-03.jpg" class="image"><img src="/s/stay/img/h-03.jpg" alt="흰 벽과 밝은 바닥에 올리브색 소파와 긴 벽난로를 둔 거실" loading="lazy" /></a><div class="caption"><p>거실</p></div></article></div><details class="more"><summary>나머지 25장 보기</summary><div class="gallery style2 medium lightbox onscroll-fade-in"><article><a href="/s/stay/img/h-04.jpg" class="image"><img src="/s/stay/img/h-04.jpg" alt="옛 서까래를 드러낸 천장에 라탄 조명이 걸린 거실" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/h-05.jpg" class="image"><img src="/s/stay/img/h-05.jpg" alt="문 사이로 보이는 흰 앤티크 침대와 검은 서랍장" loading="lazy" /></a><div class="caption"><p>침실</p></div></article><article><a href="/s/stay/img/h-06.jpg" class="image"><img src="/s/stay/img/h-06.jpg" alt="캡슐 커피머신과 레트로 전자레인지가 놓인 주방 어메니티" loading="lazy" /></a><div class="caption"><p>주방</p></div></article><article><a href="/s/stay/img/a-01.jpg" class="image"><img src="/s/stay/img/a-01.jpg" alt="긴 벽난로와 벽걸이 TV, 좌식 스툴을 둔 거실" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/a-02.jpg" class="image"><img src="/s/stay/img/a-02.jpg" alt="베이지 소파와 원형 원목 테이블, 장지문 창이 있는 거실" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/a-03.jpg" class="image"><img src="/s/stay/img/a-03.jpg" alt="옛 서까래 천장에 라탄 조명이 걸린 거실과 벽난로" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/a-04.jpg" class="image"><img src="/s/stay/img/a-04.jpg" alt="어두운 원목 하부장에 냉장고와 전자레인지를 둔 주방" loading="lazy" /></a><div class="caption"><p>주방</p></div></article><article><a href="/s/stay/img/a-05.jpg" class="image"><img src="/s/stay/img/a-05.jpg" alt="붉은 벽돌 벽에 벤치와 색색 의자를 둔 창고형 카페 공간" loading="lazy" /></a><div class="caption"><p>카페</p></div></article><article><a href="/s/stay/img/a-06.jpg" class="image"><img src="/s/stay/img/a-06.jpg" alt="석재 담과 소나무가 둘러싼 마당의 야외 티테이블" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/a-07.jpg" class="image"><img src="/s/stay/img/a-07.jpg" alt="원목 벽과 바닥을 지나 침실로 이어지는 복도" loading="lazy" /></a><div class="caption"><p>실내</p></div></article><article><a href="/s/stay/img/a-08.jpg" class="image"><img src="/s/stay/img/a-08.jpg" alt="장지문 창 옆에 흰 침구를 깐 침대가 놓인 침실" loading="lazy" /></a><div class="caption"><p>침실</p></div></article><article><a href="/s/stay/img/a-09.jpg" class="image"><img src="/s/stay/img/a-09.jpg" alt="정원이 보이는 큰 장지문 창과 벽걸이 TV" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/a-10.jpg" class="image"><img src="/s/stay/img/a-10.jpg" alt="원형 거울과 욕조, 어메니티를 둔 욕실" loading="lazy" /></a><div class="caption"><p>욕실</p></div></article><article><a href="/s/stay/img/a-11.jpg" class="image"><img src="/s/stay/img/a-11.jpg" alt="우드 외벽 건물과 담 사이 마당에 놓인 야외 테이블" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/a-12.jpg" class="image"><img src="/s/stay/img/a-12.jpg" alt="흰 벽돌 벽과 우드 담에 걸린 스테이 머뭄 간판" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/b-01.jpg" class="image"><img src="/s/stay/img/b-01.jpg" alt="초가 파라솔을 세운 데크와 검은 현관문이 있는 외관" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/b-02.jpg" class="image"><img src="/s/stay/img/b-02.jpg" alt="유리문을 열어 둔 카페 공간과 데크의 파라솔 테이블" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/b-03.jpg" class="image"><img src="/s/stay/img/b-03.jpg" alt="큰 창으로 빛이 드는 거실의 다크그린 소파와 샹들리에" loading="lazy" /></a><div class="caption"><p>거실</p></div></article><article><a href="/s/stay/img/b-04.jpg" class="image"><img src="/s/stay/img/b-04.jpg" alt="흰 타일 벽에 민트색 냉장고와 토스터를 둔 주방" loading="lazy" /></a><div class="caption"><p>주방</p></div></article><article><a href="/s/stay/img/b-05.jpg" class="image"><img src="/s/stay/img/b-05.jpg" alt="흰 앤티크 침대와 꽃 모양 조명이 있는 침실" loading="lazy" /></a><div class="caption"><p>침실</p></div></article><article><a href="/s/stay/img/b-06.jpg" class="image"><img src="/s/stay/img/b-06.jpg" alt="초록 서랍장과 거울, 유리문이 있는 침실 앞 공간" loading="lazy" /></a><div class="caption"><p>실내</p></div></article><article><a href="/s/stay/img/b-07.jpg" class="image"><img src="/s/stay/img/b-07.jpg" alt="커피 레터링 벽과 빨간 스툴을 둔 카페 공간" loading="lazy" /></a><div class="caption"><p>카페</p></div></article><article><a href="/s/stay/img/b-08.jpg" class="image"><img src="/s/stay/img/b-08.jpg" alt="욕조와 세면대, 블라인드 창이 있는 욕실" loading="lazy" /></a><div class="caption"><p>욕실</p></div></article><article><a href="/s/stay/img/b-09.jpg" class="image"><img src="/s/stay/img/b-09.jpg" alt="흰 벽돌 아치 현관에 우편함이 걸린 대문" loading="lazy" /></a><div class="caption"><p>외관</p></div></article><article><a href="/s/stay/img/b-10.jpg" class="image"><img src="/s/stay/img/b-10.jpg" alt="흰 벽돌 벽을 따라 디딤돌이 놓인 통로" loading="lazy" /></a><div class="caption"><p>외관</p></div></article></div></details></div>
</section>
<section class="wrapper style1 align-center" id="video">
<div class="inner"><h2 class="serif">ADO2 영상 보기</h2><p class="sectionlead">ADO2로 만든 홍보 영상입니다.</p><div class="vids"><a class="vid" href="https://youtube.com/shorts/c2ZdwhaB7S4" target="_blank" rel="noopener noreferrer"><img src="https://img.youtube.com/vi/c2ZdwhaB7S4/hqdefault.jpg" alt="머뭄의 하루" loading="lazy" /><span class="play" aria-hidden="true"></span><b>머뭄의 하루</b></a><a class="vid" href="https://youtube.com/shorts/_bbo3dVgOXs" target="_blank" rel="noopener noreferrer"><img src="https://img.youtube.com/vi/_bbo3dVgOXs/hqdefault.jpg" alt="마당과 창고형 카페 공간" loading="lazy" /><span class="play" aria-hidden="true"></span><b>마당과 창고형 카페 공간</b></a><a class="vid" href="https://youtube.com/shorts/qrCG4rOeJvs" target="_blank" rel="noopener noreferrer"><img src="https://img.youtube.com/vi/qrCG4rOeJvs/hqdefault.jpg" alt="밤의 머뭄" loading="lazy" /><span class="play" aria-hidden="true"></span><b>밤의 머뭄</b></a></div></div>
</section>
<section class="wrapper style1 align-center ivory" id="weather">
<div class="inner"><h2 class="serif">오늘의 날씨</h2><p class="weather"><span class="tag">구름많음 27.9&deg;</span>빛이 부드러운 날입니다. 골목 사진이 제일 잘 나오는 빛입니다.</p></div>
</section>
<section class="wrapper style1 align-center" id="location">
<div class="inner"><h2 class="serif">오시는 길</h2><p class="sectionlead">주소와 주요 거점까지의 이동 시간을 안내합니다.</p>
<p class="addr big">전북 군산시 절골길 18</p>
<iframe class="mapframe" loading="lazy" title="스테이,머뭄 위치"
src="https://www.openstreetmap.org/export/embed.html?bbox=126.7021254%2C35.9844175%2C126.71012540000001%2C35.988417500000004&amp;layer=mapnik&amp;marker=35.9864175%2C126.7061254"></iframe><ul class="actions"><li><a class="button primary" href="https://map.naver.com/p/search/전북 군산시 절골길 18" target="_blank" rel="noopener noreferrer">길찾기</a></li></ul></div>
</section>
<section class="wrapper style1 align-center pad-s"><div class="inner"><div class="nextnav"><a class="nextcard" href="/s/stay5/gunsan"><img src="/s/stay/img/mirror/f27b7440e2f1183f.jpg" alt="" loading="lazy" /><span><small>군산</small><b>군산 이야기</b></span></a><a class="nextcard" href="/s/stay5/booking"><img src="/s/stay/img/mirror/2d94158a48480fcd.jpg" alt="" loading="lazy" /><span><small>예약</small><b>이용안내 및 예약</b></span></a></div></div></section>
<footer class="wrapper style1 invert align-center" id="footer">
<div class="inner">
<h2 class="serif">스테이,머뭄</h2>
<p class="addr">전북 군산시 절골길 18<br /><a href="tel:0507-1497-0983">0507-1497-0983</a></p>
<ul class="actions stacked">
<li><a href="https://m.place.naver.com/place/1133638931/home" class="button primary fit" target="_blank" rel="noopener noreferrer">네이버 예약</a></li>
<li><a href="tel:0507-1497-0983" class="button fit ghost">전화 걸기</a></li>
<li><a href="https://www.instagram.com/staymeomoom" class="button fit" target="_blank" rel="noopener noreferrer">인스타그램</a></li>
</ul>
<p class="tiny">상호 스테이,머뭄 · 전북 군산시 절골길 18 · 최종 업데이트 2026-09-17<br />
레이아웃은 <a href="https://html5up.net/story">Story by HTML5 UP</a>(CC BY 3.0)를 고쳐 썼습니다.<br />
AI O2O의 Web4Ai로 만든 시안입니다.</p>
</div>
</footer>
</div>
<div id="bookbar">
<span class="price"><b>198,000원</b><small>주중 1박 기준 · 2인</small></span>
<a class="button primary" href="https://m.place.naver.com/place/1133638931/home" target="_blank" rel="noopener noreferrer">예약하기</a>
</div>
<script src="/s/stay5/assets/js/jquery.min.js"></script>
<script src="/s/stay5/assets/js/jquery.scrollex.min.js"></script>
<script src="/s/stay5/assets/js/jquery.scrolly.min.js"></script>
<script src="/s/stay5/assets/js/browser.min.js"></script>
<script src="/s/stay5/assets/js/breakpoints.min.js"></script>
<script src="/s/stay5/assets/js/util.js"></script>
<script src="/s/stay5/assets/js/main.js"></script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink