-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
133 lines (118 loc) · 5.22 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Landing Page</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="./css/landing.css">
</head>
<body>
<div class="container">
<nav class="navbar">
<a href="./index.html" class="brand-title"><h3 >RentEase </h3></a>
<a href="#" class="toggle-button">
<span class="bar"></span>
<span class="bar"></span>
<span class="bar"></span>
</a>
<div class="navbar-links">
<ul>
<li><a href="#">About</a></li>
<li><a href="#features">Features</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="./login.html" class="btn">Login</a></li>
</ul>
</div>
</nav>
</div>
<section id="home">
<div class="container">
<div class="home-content">
<div class="content-left">
<h1>Empowering Your Rental Business</h1>
<p class="info-text">
Our rental management system streamlines your operations, making it easy to track inventory, manage rentals, and enhance customer satisfaction. With powerful tools for tracking and automation, you can focus on growing your business while we handle the logistics.
</p>
</div>
<div class="content-right">
<img src="./team.svg" alt="">
</div>
</div>
</div>
</section>
<section id="features" class="features">
<h2>Features</h2>
<div class="feature-list">
<div class="feature-item">
<span class="icon"><i class="fas fa-tachometer-alt"></i></span>
<h3>Dashboard</h3>
<p>A central hub for managing all rentals, customers, and inventory data.</p>
</div>
<div class="feature-item">
<span class="icon"><i class="fas fa-tag"></i></span>
<h3>Products</h3>
<p>Add, edit, and manage all rentable products effortlessly.</p>
</div>
<div class="feature-item">
<span class="icon"><i class="fas fa-users"></i></span>
<h3>Customers</h3>
<p>Keep track of customer information, rentals, and history.</p>
</div>
<div class="feature-item">
<span class="icon"><i class="fas fa-key"></i></span>
<h3>Rental Tracking</h3>
<p>Monitor rental start and end dates, pickup, return, and status updates.</p>
</div>
</div>
</section>
<!-- Contact Us Section -->
<section id="contact" class="contact-us">
<h2>Contact Us</h2>
<p>If you have any questions, feel free to reach out to us. We're here to help!</p>
<div class="contact-form-container">
<form action="#" method="post">
<div class="form-group">
<label for="name">Name</label>
<input type="text" id="name" name="name" required>
</div>
<div class="form-group">
<label for="email">Email</label>
<input type="email" id="email" name="email" required>
</div>
<div class="form-group">
<label for="subject">Subject</label>
<input type="text" id="subject" name="subject">
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea id="message" name="message" rows="5" required></textarea>
</div>
<button type="submit" class="submit-button">Send Message</button>
</form>
</div>
</section>
<footer>
<div class="social-icons">
<a href="#">Facebook</a> | <a href="#">Twitter</a> | <a href="#">LinkedIn</a>
</div>
<p>© 2024 Rental Management System. All Rights Reserved.</p>
</footer>
<script >
const toggleButton = document.querySelector(".toggle-button")
const navBar = document.querySelector(".navbar")
toggleButton.addEventListener("click", function(){
navBar.classList.toggle("active")
})
// document.querySelectorAll('.navbar-links a').forEach(anchor => {
// anchor.addEventListener('click', function (e) {
// e.preventDefault();
// const targetSection = document.querySelector(this.getAttribute('href'));
// targetSection.scrollIntoView({
// behavior: 'smooth'
// });
// });
// });
</script>
</body>
</html>