116 lines
4.5 KiB
HTML
116 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ja">
|
|
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>いぬハウス</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap" rel="stylesheet" />
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
|
|
<link rel="stylesheet" href="css/style.css" />
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<header class="navbar bg-primary text-white px-4 py-2 d-flex align-items-center">
|
|
<span class="logo fs-4 fw-bold">いぬハウス</span>
|
|
<div class="ms-auto d-flex align-items-center gap-2">
|
|
<select id="breedSelect" class="form-select form-select-sm">
|
|
<option value="">犬種選択</option>
|
|
</select>
|
|
<input type="text" id="searchInput" class="form-control form-control-sm" placeholder="サーチ" />
|
|
<button id="searchBtn" class="btn btn-sm btn-light">検索</button>
|
|
</div>
|
|
</header>
|
|
|
|
<nav class="sub-nav py-2">
|
|
<ul class="nav justify-content-center">
|
|
<li class="nav-item"><a class="nav-link active" href="#">ホーム</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">犬種</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">ケア</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">美容</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">いぬ公園</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">イベント</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">ショップ</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#">マップ</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<main class="flex-fill">
|
|
<div class="slider-wrapper position-relative mx-auto">
|
|
<button class="slide-btn left-btn">◀</button>
|
|
<div id="sliderContainer" class="slider-container"></div>
|
|
<button class="slide-btn right-btn">▶</button>
|
|
</div>
|
|
</main>
|
|
|
|
|
|
<div class="upload-download-container">
|
|
<h2>広告募集</h2>
|
|
|
|
<label id="fileInputLabel" for="fileInput">ファイルを選択してください</label>
|
|
<input type="file" id="fileInput">
|
|
<button id="uploadBtn">アップロード</button>
|
|
<div id="uploadResult"></div>
|
|
|
|
|
|
<button id="downloadBtn">ダウンロード</button>
|
|
</div>
|
|
|
|
<div class="button-area text-center py-4">
|
|
<a href="register.html" id="goToRegister" class="btn-outline">会員登録</a>
|
|
<button id="goToLogin" class="btn-outline">ログイン</button>
|
|
</div>
|
|
|
|
|
|
<div id="loginModal" class="modal" style="display: none;">
|
|
<div class="modal-content">
|
|
<span id="closeLoginModal" class="close">×</span>
|
|
<h2>ログイン</h2>
|
|
<form id="loginForm">
|
|
<label for="loginEmail">メールアドレス（必須）</label>
|
|
<input type="email" id="loginEmail" required />
|
|
|
|
<label for="loginPassword">パスワード（必須）</label>
|
|
<input type="password" id="loginPassword" required />
|
|
|
|
<div class="modal-actions">
|
|
<button type="button" id="submitLogin">ログイン</button>
|
|
<button type="button" id="cancelLogin">キャンセル</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- <div id="registerModal" class="modal" style="display: none;">
|
|
<div class="modal-content">
|
|
<span id="closeRegisterModal" class="close">×</span>
|
|
<h2>会員登録</h2>
|
|
<form id="registerForm">
|
|
<label for="registerUsername">ユーザー名</label>
|
|
<input type="text" id="registerUsername" />
|
|
|
|
<label for="registerEmail">メールアドレス</label>
|
|
<input type="email" id="registerEmail" required />
|
|
|
|
<label for="registerPassword">パスワード</label>
|
|
<input type="password" id="registerPassword" required />
|
|
|
|
<label for="registerConfirmPassword">パスワード</label>
|
|
<input type="password" id="registerConfirmPassword" required />
|
|
|
|
<div class="modal-actions">
|
|
<button type="button" id="submitRegister">登録</button>
|
|
<button type="button" id="cancelRegister">キャンセル</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div> -->
|
|
|
|
|
|
<script src="js/main.js"></script>
|
|
</body>
|
|
|
|
</html> |