Skip to content

Instantly share code, notes, and snippets.

@kingluddite

kingluddite/sample.html

Created April 27, 2024 16:59
Show Gist options
  • Save kingluddite/ede86c48b133396e0c7c4b100b77994f to your computer and use it in GitHub Desktop.
Save kingluddite/ede86c48b133396e0c7c4b100b77994f to your computer and use it in GitHub Desktop.
Download ZIP
this is a sample gist
Raw
sample.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Fur-tastic Grooming</title>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="./assets/css/styles.css">
<!-- Font Awesome CDN -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
</head>
<body class="bg-light">
<header>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">Fur-tastic Grooming</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" href="index.html"><i class="fas fa-home"></i> Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="about.html"><i class="fas fa-info-circle"></i> About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="services.html"><i class="fas fa-cogs"></i> Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact.html"><i class="fas fa-envelope"></i> Contact</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main class="container mt-5">
<section id="about" class="mb-5">
<h2>About Us</h2>
<p>Welcome to Fur-tastic Grooming, where we pamper your furry friends! Our team of experienced groomers
will ensure your pet looks and feels their best.</p>
<p>We created Fur-tastic Grooming because we believe that every dog deserves to feel and look their best.
With our passion for pets and our commitment to providing top-quality grooming services, we strive to
make every grooming experience enjoyable for both pets and their owners.</p>
</section>
<section id="services" class="mb-5">
<h2>Our Services</h2>
<ul class="list-group">
<li class="list-group-item">Full Grooming</li>
<li class="list-group-item">Bath and Brush</li>
<li class="list-group-item">Nail Trimming</li>
<li class="list-group-item">Ear Cleaning</li>
</ul>
</section>
<section id="hours" class="mb-5">
<h2>Hours of Operation</h2>
<table class="table table-striped">
<thead>
<tr>
<th>Day</th>
<th>Hours</th>
</tr>
</thead>
<tbody>
<tr>
<td>Monday - Friday</td>
<td>9:00 AM - 6:00 PM</td>
</tr>
<tr>
<td>Saturday</td>
<td>10:00 AM - 4:00 PM</td>
</tr>
<tr>
<td>Sunday</td>
<td>Closed</td>
</tr>
</tbody>
</table>
</section>
<section id="contact" class="mb-5">
<h2>Contact Us</h2>
<p>Ready to book an appointment? Give us a call at <strong>(555) 123-4567</strong> or send us an email at
<a href="mailto:info@furtasticgrooming.com">info@furtasticgrooming.com</a>.
</p>
</section>
</main>
<footer class="text-center bg-light">
<p class="mb-0">&copy; 2024 Fur-tastic Grooming. All rights reserved.</p>
</footer>
<!-- Bootstrap JavaScript (optional) -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment