113 lines
5.1 KiB
PHP
113 lines
5.1 KiB
PHP
<!doctype html>
|
|
<html lang="zh-Hant">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title>
|
|
<?php echo $_SERVER['PROJECT_NAME'] ?? '命理緣分網站' ?>
|
|
</title>
|
|
<meta name="description" content="<?php echo $_SERVER['PROJECT_DESCRIPTION'] ?? '探索你與他/她的緣分密碼'
|
|
?>">
|
|
<meta property="og:title" content="<?php echo $_SERVER['PROJECT_NAME'] ?? '命理緣分網站' ?>">
|
|
<meta property="og:description"
|
|
content="<?php echo $_SERVER['PROJECT_DESCRIPTION'] ?? '探索你與他/她的緣分密碼'
|
|
?>">
|
|
<meta property="og:image" content="<?php echo $_SERVER['PROJECT_IMAGE_URL'] ?? ''
|
|
?>">
|
|
<meta property="twitter:card" content="summary_large_image">
|
|
<meta property="twitter:title" content="<?php echo $_SERVER['PROJECT_NAME'] ?? '命理緣分網站'
|
|
?>">
|
|
<meta property="twitter:description"
|
|
content="<?php echo $_SERVER['PROJECT_DESCRIPTION'] ?? '探索你與他/她的緣分密碼'
|
|
?>">
|
|
<meta property="twitter:image" content="<?php echo $_SERVER['PROJECT_IMAGE_URL'] ?? ''
|
|
?>">
|
|
|
|
<!-- Google Fonts: Nunito -->
|
|
<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=Nunito:wght@400;700;800&display=swap" rel="stylesheet">
|
|
|
|
<!-- Bootstrap CSS -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
|
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
|
|
|
<!-- Bootstrap Icons -->
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
|
|
|
<!-- Custom CSS -->
|
|
<link rel="stylesheet" href="assets/css/custom.css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<header class="py-3">
|
|
<div class="container text-center">
|
|
<h2 class="fw-bold"><?php echo $_SERVER['PROJECT_NAME'] ?? '命理緣分網站' ?></h2>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<section class="hero">
|
|
<h1>探索你與摯友、伴侶的緣分密碼</h1>
|
|
<p class="lead">輸入姓名與生日，發現你們之間奇妙的化學反應！</p>
|
|
</section>
|
|
|
|
<section class="features py-5">
|
|
<div class="container">
|
|
<div class="row g-4">
|
|
<!-- Feature 1: Couple's Affinity -->
|
|
<div class="col-lg-4 col-md-6">
|
|
<div class="feature-card text-center">
|
|
<div class="card-body">
|
|
<div class="icon mb-3"><i class="bi bi-heart-fill"></i></div>
|
|
<h4 class="card-title fw-bold">雙人緣分契合度</h4>
|
|
<p class="card-text">計算你與另一半的分數，看看誰更愛誰，以及你們的未來發展機率。</p>
|
|
<a href="#" class="btn btn-primary">開始測試</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Feature 2: Friendship Index -->
|
|
<div class="col-lg-4 col-md-6">
|
|
<div class="feature-card text-center">
|
|
<div class="card-body">
|
|
<div class="icon mb-3"><i class="bi bi-people-fill"></i></div>
|
|
<h4 class="card-title fw-bold">女生友情指數</h4>
|
|
<p class="card-text">測算與閨蜜的友情分數和類型，並獲得專屬的相處小建議。</p>
|
|
<a href="#" class="btn btn-primary">開始測試</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Feature 3: Bazi Analysis -->
|
|
<div class="col-lg-4 col-md-12">
|
|
<div class="feature-card text-center">
|
|
<div class="card-body">
|
|
<div class="icon mb-3"><i class="bi bi-stars"></i></div>
|
|
<h4 class="card-title fw-bold">八字命理分析</h4>
|
|
<p class="card-text">從你的生辰八字，推算命定對象的生日、星座與年齡差距。</p>
|
|
<a href="#" class="btn btn-primary">開始分析</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="text-center">
|
|
<div class="container">
|
|
<p>© <?php echo date("Y"); ?> <?php echo $_SERVER['PROJECT_NAME'] ?? '命理緣分網站' ?>. All Rights Reserved.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
|
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
|
crossorigin="anonymous"></script>
|
|
</body>
|
|
|
|
</html>
|