Revert to version 682f975
This commit is contained in:
parent
ee1d5cab31
commit
ca29b711ff
314
index.php
314
index.php
@ -1,196 +1,150 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/db/config.php';
|
||||
declare(strict_types=1);
|
||||
@ini_set('display_errors', '1');
|
||||
@error_reporting(E_ALL);
|
||||
@date_default_timezone_set('UTC');
|
||||
|
||||
// Fetch latest 3 posts
|
||||
$latest_posts = [];
|
||||
try {
|
||||
$pdo = db();
|
||||
$stmt = $pdo->query("SELECT id, title, content, image_url, created_at FROM posts ORDER BY created_at DESC LIMIT 3");
|
||||
$latest_posts = $stmt->fetchAll(PDO::FETCH_ASSOC);
|
||||
} catch (PDOException $e) {
|
||||
// In a real application, you would log this error
|
||||
error_log("Database error: " . $e->getMessage());
|
||||
// You could also display a friendly error message on the page
|
||||
}
|
||||
|
||||
// Function to create a short summary
|
||||
function get_summary($text, $length = 100) {
|
||||
$text = strip_tags($text);
|
||||
if (mb_strlen($text) > $length) {
|
||||
$text = mb_substr($text, 0, $length);
|
||||
$text .= "...";
|
||||
}
|
||||
return $text;
|
||||
}
|
||||
$phpVersion = PHP_VERSION;
|
||||
$now = date('Y-m-d H:i:s');
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="vi">
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>CLB Cầu Lông Công đoàn - Trang Chủ</title>
|
||||
<meta name="description" content="<?php echo htmlspecialchars($_SERVER['PROJECT_DESCRIPTION'] ?? 'Website chính thức của CLB Cầu lông Công đoàn, nơi kết nối đam mê và rèn luyện sức khỏe.'); ?>">
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:title" content="CLB Cầu Lông Công đoàn">
|
||||
<meta property="og:description" content="<?php echo htmlspecialchars($_SERVER['PROJECT_DESCRIPTION'] ?? 'Tham gia và kết nối cùng chúng tôi!'); ?>">
|
||||
<meta property="og:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta property="twitter:card" content="summary_large_image">
|
||||
<meta property="twitter:title" content="CLB Cầu Lông Công đoàn">
|
||||
<meta property="twitter:description" content="<?php echo htmlspecialchars($_SERVER['PROJECT_DESCRIPTION'] ?? 'Tham gia và kết nối cùng chúng tôi!'); ?>">
|
||||
<meta property="twitter:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
|
||||
|
||||
<!-- Bootstrap CSS -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
||||
|
||||
<!-- Google Fonts -->
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>New Style</title>
|
||||
<?php
|
||||
// Read project preview data from environment
|
||||
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||
?>
|
||||
<?php if ($projectDescription): ?>
|
||||
<!-- Meta description -->
|
||||
<meta name="description" content='<?= htmlspecialchars($projectDescription) ?>' />
|
||||
<!-- Open Graph meta tags -->
|
||||
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||
<!-- Twitter meta tags -->
|
||||
<meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||
<?php endif; ?>
|
||||
<?php if ($projectImageUrl): ?>
|
||||
<!-- Open Graph image -->
|
||||
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<!-- Twitter image -->
|
||||
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||
<?php endif; ?>
|
||||
<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=Inter:wght@400;700&display=swap" rel="stylesheet">
|
||||
|
||||
<!-- Custom CSS -->
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||||
<style>
|
||||
:root {
|
||||
--bg-color-start: #6a11cb;
|
||||
--bg-color-end: #2575fc;
|
||||
--text-color: #ffffff;
|
||||
--card-bg-color: rgba(255, 255, 255, 0.01);
|
||||
--card-border-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: 'Inter', sans-serif;
|
||||
background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end));
|
||||
color: var(--text-color);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 100vh;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
body::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M-10 10L110 10M10 -10L10 110" stroke-width="1" stroke="rgba(255,255,255,0.05)"/></svg>');
|
||||
animation: bg-pan 20s linear infinite;
|
||||
z-index: -1;
|
||||
}
|
||||
@keyframes bg-pan {
|
||||
0% { background-position: 0% 0%; }
|
||||
100% { background-position: 100% 100%; }
|
||||
}
|
||||
main {
|
||||
padding: 2rem;
|
||||
}
|
||||
.card {
|
||||
background: var(--card-bg-color);
|
||||
border: 1px solid var(--card-border-color);
|
||||
border-radius: 16px;
|
||||
padding: 2rem;
|
||||
backdrop-filter: blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.loader {
|
||||
margin: 1.25rem auto 1.25rem;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border: 3px solid rgba(255, 255, 255, 0.25);
|
||||
border-top-color: #fff;
|
||||
border-radius: 50%;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
@keyframes spin {
|
||||
from { transform: rotate(0deg); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
.hint {
|
||||
opacity: 0.9;
|
||||
}
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px; height: 1px;
|
||||
padding: 0; margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap; border: 0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 3rem;
|
||||
font-weight: 700;
|
||||
margin: 0 0 1rem;
|
||||
letter-spacing: -1px;
|
||||
}
|
||||
p {
|
||||
margin: 0.5rem 0;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
code {
|
||||
background: rgba(0,0,0,0.2);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||
}
|
||||
footer {
|
||||
position: absolute;
|
||||
bottom: 1rem;
|
||||
font-size: 0.8rem;
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- Navbar -->
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top shadow-sm">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="index.php">
|
||||
<i class="bi bi-wind"></i>
|
||||
CLB Cầu Lông
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="index.php">Trang chủ</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="news.php">Tin tức & Sự kiện</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#about">Giới thiệu</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#footer">Liên hệ</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<header class="hero-section">
|
||||
<div class="container">
|
||||
<h1 class="display-4">Chắp Cánh Đam Mê Cầu Lông</h1>
|
||||
<p class="lead">Tham gia CLB Cầu lông Công đoàn để rèn luyện sức khỏe, giao lưu và chinh phục những tầm cao mới.</p>
|
||||
<a href="news.php" class="btn btn-primary btn-lg">Xem Tin Tức Mới Nhất</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<!-- Latest News Section -->
|
||||
<section id="latest-news" class="section bg-light">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Tin Tức & Sự Kiện Mới Nhất</h2>
|
||||
<div class="row g-4">
|
||||
<?php if (!empty($latest_posts)): ?>
|
||||
<?php foreach ($latest_posts as $post): ?>
|
||||
<div class="col-md-6 col-lg-4">
|
||||
<div class="card news-card h-100 shadow-sm">
|
||||
<img src="<?php echo htmlspecialchars($post['image_url'] ?: 'https://picsum.photos/seed/' . $post['id'] . '/400/250'); ?>" class="news-card-img-top" alt="<?php echo htmlspecialchars($post['title']); ?>">
|
||||
<div class="card-body d-flex flex-column">
|
||||
<h5 class="card-title"><?php echo htmlspecialchars($post['title']); ?></h5>
|
||||
<p class="card-text flex-grow-1"><?php echo htmlspecialchars(get_summary($post['content'], 120)); ?></p>
|
||||
<a href="news.php#post-<?php echo $post['id']; ?>" class="btn btn-primary mt-auto align-self-start">Đọc thêm <i class="bi bi-arrow-right-short"></i></a>
|
||||
<div class="card">
|
||||
<h1>Analyzing your requirements and generating your website…</h1>
|
||||
<div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
|
||||
<span class="sr-only">Loading…</span>
|
||||
</div>
|
||||
<p class="hint"><?= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.</p>
|
||||
<p class="hint">This page will update automatically as the plan is implemented.</p>
|
||||
<p>Runtime: PHP <code><?= htmlspecialchars($phpVersion) ?></code> — UTC <code><?= htmlspecialchars($now) ?></code></p>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<?php else: ?>
|
||||
<div class="col-12">
|
||||
<div class="alert alert-info text-center" role="alert">
|
||||
Hiện chưa có bài viết nào. Tin tức mới nhất sẽ được cập nhật sớm!
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- About Us Section -->
|
||||
<section id="about" class="section">
|
||||
<div class="container">
|
||||
<div class="row align-items-center g-5">
|
||||
<div class="col-lg-6">
|
||||
<img src="https://images.pexels.com/photos/5954336/pexels-photo-5954336.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" class="img-fluid rounded shadow-lg" alt="Thành viên CLB đang chơi cầu lông">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<h2 class="section-title text-start">Về Chúng Tôi</h2>
|
||||
<h3>CLB Cầu Lông Công đoàn</h3>
|
||||
<p class="lead">Một sân chơi chung đầy nhiệt huyết.</p>
|
||||
<p>Câu lạc bộ Cầu lông Công đoàn là tổ chức thể thao phong trào trực thuộc công đoàn, được thành lập nhằm khuyến khích đoàn viên, người lao động rèn luyện sức khỏe, nâng cao đời sống tinh thần và tăng cường sự gắn kết trong tập thể.
|
||||
|
||||
Câu lạc bộ là nơi giao lưu, tập luyện của những người yêu thích bộ môn cầu lông, với tinh thần đoàn kết – lành mạnh – tích cực, không phân biệt trình độ hay độ tuổi. Thông qua các buổi tập luyện định kỳ, hoạt động giao lưu và các giải đấu phong trào, câu lạc bộ góp phần xây dựng môi trường sinh hoạt công đoàn năng động, thân thiện và hiệu quả.
|
||||
|
||||
Câu lạc bộ Cầu lông Công đoàn luôn chào đón sự tham gia của các đoàn viên, cùng nhau lan tỏa tinh thần thể thao, nâng cao sức khỏe và xây dựng tập thể vững mạnh.</p>
|
||||
<p>Dù bạn là người mới bắt đầu hay đã có kinh nghiệm, CLB luôn chào đón tất cả mọi người với tinh thần thể thao cao thượng và sự vui vẻ.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer id="footer" class="footer">
|
||||
<div class="container">
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<h5><i class="bi bi-wind"></i> CLB Cầu Lông Công đoàn</h5>
|
||||
<p>Nơi kết nối đam mê, rèn luyện sức khỏe và xây dựng tình đồng đội.</p>
|
||||
</div>
|
||||
<div class="col-lg-2 col-md-6">
|
||||
<h5>Liên kết nhanh</h5>
|
||||
<ul class="footer-links">
|
||||
<li><a href="index.php">Trang chủ</a></li>
|
||||
<li><a href="news.php">Tin tức</a></li>
|
||||
<li><a href="#about">Giới thiệu</a></li>
|
||||
<li><a href="/admin">Quản trị</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6">
|
||||
<h5>Liên hệ</h5>
|
||||
<ul class="footer-links">
|
||||
<li><i class="bi bi-geo-alt-fill me-2"></i> Sân cầu lông công ty</li>
|
||||
<li><i class="bi bi-telephone-fill me-2"></i> (123) 456-7890</li>
|
||||
<li><i class="bi bi-envelope-fill me-2"></i> contact@example.com</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-6">
|
||||
<h5>Theo dõi chúng tôi</h5>
|
||||
<div class="social-icons">
|
||||
<a href="#"><i class="bi bi-facebook"></i></a>
|
||||
<a href="#"><i class="bi bi-instagram"></i></a>
|
||||
<a href="#"><i class="bi bi-twitter"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="copyright">
|
||||
<p>© <?php echo date("Y"); ?> CLB Cầu Lông Công đoàn. All Rights Reserved.</p>
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
Page updated: <?= htmlspecialchars($now) ?> (UTC)
|
||||
</footer>
|
||||
|
||||
<!-- Bootstrap JS -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- Custom JS -->
|
||||
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user