140 lines
7.4 KiB
HTML
140 lines
7.4 KiB
HTML
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}Digital Bookstore | Premium PDFs{% endblock %}</title>
|
|
<meta name="description" content="{% block meta_description %}Buy and download high-quality PDF books online. Safe, fast, and secure.{% endblock %}">
|
|
|
|
<!-- Google Fonts -->
|
|
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
|
|
|
<!-- Font Awesome -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
|
|
<!-- Bootstrap 5 CSS CDN -->
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
|
|
<!-- Custom CSS -->
|
|
<link rel="stylesheet" href="{% static 'css/custom.css' %}?v={{ deployment_timestamp }}">
|
|
|
|
{% block extra_css %}{% endblock %}
|
|
</head>
|
|
<body>
|
|
<!-- Navbar -->
|
|
<nav class="navbar navbar-expand-lg sticky-top navbar-light bg-glass py-3">
|
|
<div class="container">
|
|
<a class="navbar-brand fw-bold fs-3" href="{% url 'home' %}">
|
|
<span class="text-primary-gradient">Book</span><span class="text-dark">Store</span>
|
|
</a>
|
|
<button class="navbar-toggler border-0" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ms-auto align-items-center">
|
|
<li class="nav-item"><a class="nav-link px-3" href="{% url 'home' %}">Home</a></li>
|
|
<li class="nav-item"><a class="nav-link px-3" href="{% url 'book_list' %}">Explore</a></li>
|
|
<li class="nav-item"><a class="nav-link px-3" href="{% url 'about' %}">About</a></li>
|
|
<li class="nav-item"><a class="nav-link px-3" href="{% url 'contact' %}">Contact</a></li>
|
|
<li class="nav-item ms-lg-3">
|
|
<a href="/admin/" class="btn btn-dark rounded-pill px-4 shadow-sm" target="_blank">
|
|
<i class="fas fa-user-shield me-2"></i>Admin
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Messaging System -->
|
|
{% if messages %}
|
|
<div class="container mt-4">
|
|
{% for message in messages %}
|
|
<div class="alert alert-{{ message.tags }} alert-dismissible fade show rounded-4 shadow-sm border-0" role="alert">
|
|
<i class="fas {% if message.tags == 'success' %}fa-check-circle{% else %}fa-exclamation-circle{% endif %} me-2"></i>
|
|
{{ message }}
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Main Content -->
|
|
<main>
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer bg-white pt-5 pb-3 mt-5 border-top">
|
|
<div class="container">
|
|
<div class="row g-4">
|
|
<div class="col-lg-4">
|
|
<a class="navbar-brand fw-bold fs-3 d-block mb-3" href="{% url 'home' %}">
|
|
<span class="text-primary-gradient">Book</span><span class="text-dark">Store</span>
|
|
</a>
|
|
<p class="text-muted pe-lg-5">Your premium destination for high-quality digital PDF books. Empowering knowledge sharing across the globe.</p>
|
|
<div class="social-links d-flex gap-3 mt-4">
|
|
<a href="https://wa.me/252634844506" class="btn btn-sm btn-outline-success rounded-circle" target="_blank"><i class="fab fa-whatsapp"></i></a>
|
|
<a href="#" class="btn btn-sm btn-outline-primary rounded-circle"><i class="fab fa-facebook-f"></i></a>
|
|
<a href="#" class="btn btn-sm btn-outline-info rounded-circle"><i class="fab fa-twitter"></i></a>
|
|
<a href="#" class="btn btn-sm btn-outline-danger rounded-circle"><i class="fab fa-instagram"></i></a>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2 col-md-4">
|
|
<h6 class="fw-bold mb-4">Quick Links</h6>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-2"><a href="{% url 'home' %}" class="text-muted text-decoration-none hover-primary">Home</a></li>
|
|
<li class="mb-2"><a href="{% url 'book_list' %}" class="text-muted text-decoration-none hover-primary">All Books</a></li>
|
|
<li class="mb-2"><a href="{% url 'about' %}" class="text-muted text-decoration-none hover-primary">Our Story</a></li>
|
|
<li class="mb-2"><a href="{% url 'contact' %}" class="text-muted text-decoration-none hover-primary">Contact Us</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-3 col-md-4">
|
|
<h6 class="fw-bold mb-4">Legal</h6>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-2"><a href="{% url 'privacy' %}" class="text-muted text-decoration-none hover-primary">Privacy Policy</a></li>
|
|
<li class="mb-2"><a href="{% url 'terms' %}" class="text-muted text-decoration-none hover-primary">Terms & Conditions</a></li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-3 col-md-4">
|
|
<h6 class="fw-bold mb-4">Contact Support</h6>
|
|
<p class="small text-muted mb-3">Reach out to us via WhatsApp for instant support.</p>
|
|
<div class="d-grid">
|
|
<a href="https://wa.me/252634844506" class="btn btn-success rounded-pill fw-bold">
|
|
<i class="fab fa-whatsapp me-2"></i> +252 63 4844506
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr class="my-4 text-muted opacity-25">
|
|
<div class="d-flex flex-column flex-md-row justify-content-between align-items-center gap-3">
|
|
<p class="text-muted small mb-0">© 2026 BookStore. All rights reserved.</p>
|
|
<div class="payment-icons d-flex gap-3 text-muted opacity-50">
|
|
<span class="small fw-bold me-2">Payments:</span>
|
|
<i class="fas fa-mobile-screen-button fa-lg" title="EVC Plus"></i>
|
|
<i class="fas fa-wallet fa-lg" title="Zaad"></i>
|
|
<i class="fab fa-whatsapp fa-lg" title="Order via WhatsApp"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Bootstrap 5 JS Bundle -->
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script>
|
|
// Scroll interaction for glass navbar
|
|
window.addEventListener('scroll', function() {
|
|
const nav = document.querySelector('.navbar');
|
|
if (window.scrollY > 50) {
|
|
nav.classList.add('shadow-sm');
|
|
nav.style.padding = '0.5rem 0';
|
|
} else {
|
|
nav.classList.remove('shadow-sm');
|
|
nav.style.padding = '1rem 0';
|
|
}
|
|
});
|
|
</script>
|
|
{% block extra_js %}{% endblock %}
|
|
</body>
|
|
</html> |