Auto commit: 2025-12-01T15:31:04.651Z
@ -1,334 +1,26 @@
|
||||
/* Cozy Lodge Theme */
|
||||
|
||||
body {
|
||||
background-color: #F6FBFF; /* Frosty White */
|
||||
font-family: 'Nunito Sans', sans-serif;
|
||||
color: #212529;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
padding: 2rem 0;
|
||||
.hero-section {
|
||||
background-color: #f8f9fa;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* Navigation */
|
||||
.navbar {
|
||||
background-color: #FFFFFF;
|
||||
border-bottom: 1px solid #E9F1F8;
|
||||
padding: 1rem 0;
|
||||
.feature {
|
||||
background-color: #f8f9fa;
|
||||
border-radius: 10px;
|
||||
transition: transform .2s;
|
||||
}
|
||||
|
||||
.navbar .container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 700;
|
||||
color: #0B233F;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.nav-links {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.nav-links li a {
|
||||
text-decoration: none;
|
||||
color: #212529;
|
||||
padding: 0.5rem 1rem;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.nav-links li a:hover {
|
||||
color: #FF7A4D;
|
||||
}
|
||||
|
||||
/* Hero Section */
|
||||
.hero {
|
||||
background-image: url('https://images.pexels.com/photos/912110/pexels-photo-912110.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
height: 80vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
text-shadow: 0 2px 4px rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
.hero-content {
|
||||
background: rgba(11, 35, 63, 0.6); /* Deep Navy with transparency */
|
||||
padding: 2rem 4rem;
|
||||
border-radius: .5rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.hero h1 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-weight: 700;
|
||||
font-size: 4rem;
|
||||
}
|
||||
|
||||
.lead {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #FF7A4D; /* Warm Ember */
|
||||
border-color: #FF7A4D;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
padding: 0.75rem 1.5rem;
|
||||
transition: background-color 0.3s ease;
|
||||
text-decoration: none;
|
||||
border-radius: .25rem;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: #E86A3C;
|
||||
border-color: #E86A3C;
|
||||
}
|
||||
|
||||
/* Featured Experiences */
|
||||
.featured-experiences {
|
||||
text-align: center;
|
||||
padding: 4rem 0;
|
||||
}
|
||||
|
||||
.featured-experiences h2 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.experience-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.experience-card {
|
||||
background-color: #FFFFFF;
|
||||
border: 1px solid #E9F1F8; /* Snow Grey */
|
||||
border-radius: .5rem;
|
||||
overflow: hidden;
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
.experience-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 16px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.experience-card img {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.experience-card h3 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-size: 1.5rem;
|
||||
margin: 1rem;
|
||||
}
|
||||
|
||||
.experience-card p {
|
||||
margin: 0 1rem 1rem;
|
||||
}
|
||||
|
||||
/* Experience Detail */
|
||||
.experience-detail img {
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
object-fit: cover;
|
||||
border-radius: .5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.experience-detail h1 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-size: 3rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.experience-detail p {
|
||||
line-height: 1.6;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.experience-detail h2 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-size: 2rem;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.experience-detail ul {
|
||||
list-style: disc;
|
||||
margin-left: 1.5rem;
|
||||
}
|
||||
|
||||
/* Gallery */
|
||||
.gallery-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.gallery-card {
|
||||
overflow: hidden;
|
||||
border-radius: .5rem;
|
||||
}
|
||||
|
||||
.gallery-card img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.gallery-card:hover img {
|
||||
.feature:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.upload-section {
|
||||
text-align: center;
|
||||
padding: 4rem 0;
|
||||
.gallery-section img {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.upload-section h2 {
|
||||
font-family: 'Playfair Display', serif;
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Forms */
|
||||
.form-group {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: .5rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.form-group input,
|
||||
.form-group textarea,
|
||||
.form-group select {
|
||||
width: 100%;
|
||||
padding: .75rem;
|
||||
border: 1px solid #E9F1F8;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
|
||||
|
||||
/* Footer */
|
||||
footer {
|
||||
background-color: #0B233F;
|
||||
color: #F6FBFF;
|
||||
text-align: center;
|
||||
padding: 2rem 0;
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
/* Chat Widget */
|
||||
.chat-icon {
|
||||
position: fixed;
|
||||
bottom: 2rem;
|
||||
right: 2rem;
|
||||
background-color: #0B233F; /* Deep Navy */
|
||||
color: #F6FBFF; /* Frosty White */
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.chat-icon:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.chat-window {
|
||||
display: none; /* Hidden by default */
|
||||
position: fixed;
|
||||
bottom: 7rem;
|
||||
right: 2rem;
|
||||
width: 350px;
|
||||
max-width: 90%;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: .5rem;
|
||||
box-shadow: 0 4px 16px rgba(0,0,0,0.2);
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chat-window.show {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.chat-header {
|
||||
background-color: #0B233F; /* Deep Navy */
|
||||
color: #F6FBFF; /* Frosty White */
|
||||
padding: 1rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.chat-header h5 {
|
||||
margin: 0;
|
||||
font-family: 'Playfair Display', serif;
|
||||
}
|
||||
|
||||
.chat-body {
|
||||
padding: 1rem;
|
||||
overflow-y: auto;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.message-container {
|
||||
/* The messages will be prepended here by JS */
|
||||
}
|
||||
|
||||
.message {
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
max-width: 80%;
|
||||
/* Use float for alignment */
|
||||
}
|
||||
|
||||
.message.received {
|
||||
background-color: #E9F1F8; /* Snow Grey */
|
||||
float: left;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.message.sent {
|
||||
background-color: #FF7A4D; /* Warm Ember */
|
||||
color: white;
|
||||
float: right;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.chat-input {
|
||||
display: flex;
|
||||
padding: 1rem;
|
||||
border-top: 1px solid #E9F1F8; /* Snow Grey */
|
||||
.contact-section {
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
BIN
assets/pasted-20251201-145648-4b7fb941.png
Normal file
|
After Width: | Height: | Size: 3.4 MiB |
BIN
assets/pasted-20251201-150304-ceef8ec7.png
Normal file
|
After Width: | Height: | Size: 2.9 MiB |
BIN
assets/pasted-20251201-150707-81feffa3.jpg
Normal file
|
After Width: | Height: | Size: 262 KiB |
BIN
assets/pasted-20251201-150810-56a01ea1.jpg
Normal file
|
After Width: | Height: | Size: 135 KiB |
BIN
assets/pasted-20251201-150941-625fafdf.jpg
Normal file
|
After Width: | Height: | Size: 182 KiB |
BIN
assets/pasted-20251201-151203-c04ad802.png
Normal file
|
After Width: | Height: | Size: 4.1 MiB |
BIN
assets/pasted-20251201-152448-d399f676.png
Normal file
|
After Width: | Height: | Size: 4.1 MiB |
BIN
assets/vm-shot-2025-12-01T15-06-49-457Z.jpg
Normal file
|
After Width: | Height: | Size: 262 KiB |
BIN
assets/vm-shot-2025-12-01T15-08-01-916Z.jpg
Normal file
|
After Width: | Height: | Size: 135 KiB |
BIN
assets/vm-shot-2025-12-01T15-09-29-448Z.jpg
Normal file
|
After Width: | Height: | Size: 182 KiB |
@ -1,4 +1,4 @@
|
||||
<footer>
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© <?php echo date("Y"); ?> Winter Wonderland. All Rights Reserved.</p>
|
||||
</div>
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Winter Wonderland</title>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Nunito+Sans:wght@400;600&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="assets/css/custom.css">
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
|
||||
115
index.php
@ -1,34 +1,99 @@
|
||||
<?php include 'header.php'; ?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Home</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="assets/css/custom.css" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="hero">
|
||||
<div class="hero-content">
|
||||
<h1>Your Winter Adventure Awaits</h1>
|
||||
<p class="lead">Discover unique experiences, plan the perfect trip with our AI assistant, and create unforgettable memories.</p>
|
||||
<a href="#" class="btn btn-primary">Plan My Trip with AI</a>
|
||||
<!-- Hero Section -->
|
||||
<header class="hero-section text-center text-white bg-dark py-5">
|
||||
<div class="container">
|
||||
<h1 class="display-4">Welcome to our Website</h1>
|
||||
<p class="lead">A brief and catchy tagline about your service or product.</p>
|
||||
<a href="#" class="btn btn-primary btn-lg">Get Started</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="container">
|
||||
<section class="featured-experiences">
|
||||
<h2>Featured Experiences</h2>
|
||||
<div class="experience-grid">
|
||||
<div class="experience-card">
|
||||
<img src="https://images.pexels.com/photos/1576788/pexels-photo-1576788.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" alt="Experience 1">
|
||||
<h3>Ski Lessons</h3>
|
||||
<p>Learn to ski with our expert instructors.</p>
|
||||
<!-- Features Section -->
|
||||
<section class="features-section py-5">
|
||||
<div class="container">
|
||||
<div class="row text-center">
|
||||
<div class="col-md-4">
|
||||
<div class="feature p-4">
|
||||
<h3>Feature One</h3>
|
||||
<p>Description of feature one.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="feature p-4">
|
||||
<h3>Feature Two</h3>
|
||||
<p>Description of feature two.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="feature p-4">
|
||||
<h3>Feature Three</h3>
|
||||
<p>Description of feature three.</p>
|
||||
</div>
|
||||
<div class="experience-card">
|
||||
<img src="https://images.pexels.com/photos/714258/pexels-photo-714258.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" alt="Experience 2">
|
||||
<h3>Snowboarding</h3>
|
||||
<p>Hit the slopes on a snowboard.</p>
|
||||
</div>
|
||||
<div class="experience-card">
|
||||
<img src="https://images.pexels.com/photos/1632790/pexels-photo-1632790.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1" alt="Experience 3">
|
||||
<h3>Ice Skating</h3>
|
||||
<p>Enjoy a magical ice skating experience.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<?php include 'footer.php'; ?>
|
||||
<!-- Gallery Section -->
|
||||
<section class="gallery-section bg-light py-5">
|
||||
<div class="container">
|
||||
<h2 class="text-center mb-4">Gallery</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-4 mb-4">
|
||||
<img src="https://via.placeholder.com/400" class="img-fluid" alt="Gallery Image">
|
||||
</div>
|
||||
<div class="col-md-4 mb-4">
|
||||
<img src="https://via.placeholder.com/400" class="img-fluid" alt="Gallery Image">
|
||||
</div>
|
||||
<div class="col-md-4 mb-4">
|
||||
<img src="https://via.placeholder.com/400" class="img-fluid" alt="Gallery Image">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section class="contact-section py-5">
|
||||
<div class="container">
|
||||
<h2 class="text-center mb-4">Contact Us</h2>
|
||||
<div class="row">
|
||||
<div class="col-md-6 mx-auto">
|
||||
<form>
|
||||
<div class="mb-3">
|
||||
<label for="name" class="form-label">Name</label>
|
||||
<input type="text" class="form-control" id="name">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="email" class="form-label">Email</label>
|
||||
<input type="email" class="form-control" id="email">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="message" class="form-label">Message</label>
|
||||
<textarea class="form-control" id="message" rows="3"></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Submit</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer class="text-center py-4 bg-dark text-white">
|
||||
<div class="container">
|
||||
<p>© 2025 Your Company. All Rights Reserved.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||