-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcar_specs.html
138 lines (125 loc) · 5.86 KB
/
car_specs.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
134
135
136
137
138
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Specs</title>
<link rel="stylesheet" href="{% static '/css/style.css' %}" />
<script src="https://kit.fontawesome.com/26719dd53c.js" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body id="specs">
<div class="container">
<div class="scroll-up-btn">
<i class="fas fa-angle-up"></i>
</div>
<nav class="navbar">
<div class="max-width">
<div class="logo">
<a href="{% url 'Home Page' %}">Car Showroom Management System</a>
</div>
<ul class="menu">
<li><a id="abt" href="{% url 'Home Page' %}" class="menu-btn">Home</a></li>
<li><a id="first" href="{% url 'About' %}" class="menu-btn">About Us</a></li>
<li><a href="{% url 'Contact' %}" class="menu-btn">Contact Us</a></li>
<li><a href="{% url 'Login' %}" class="menu-btn">Login</a></li>
</ul>
<div class="menu-btn">
<i class="fas fa-bars"></i>
</div>
</div>
</nav>
<section class="buy_car">
<div class="max-width">
<div class="buy_main">
<div class="car_img">
<img src="{% static '/img/brandcar2.jpg' %}" alt="">
</div>
<div class="car_data">
<h2>Renault Duster</h2>
<div class="rating">
<span class="fa fa-star checked"></span>
<span class="fa fa-star checked"></span>
<span class="fa fa-star checked"></span>
<span class="fa fa-star"></span>
<span class="fa fa-star"></span>
</div>
<h1>Rs 9.86 - 14.25 Lakh</h1>
<div class="car_btns">
<a href="#spec">View Specs</a>
<form action="/users/specs/" method="post">
{% csrf_token %}
<input type="hidden" name="id" value="{{vehicle.id}}">
<input type="submit" value="Book">
</form>
</div>
</div>
</div>
</div>
</section>
<div class="specs_main" id="spec">
<div class="specs_title">
<h2>Key Specifications</h2>
</div>
<div class="specs_container">
<article class="specs">
<main class="specs__content">
<article class="specs__profile">
<span class="specs__name">ARAI Mileage</span>
<span class="specs__value">16.42 kmpl</span>
</article>
<article class="specs__profile">
<span class="specs__name">Engine Displacement (cc)</span>
<span class="specs__value">1330</span>
</article>
<article class="specs__profile">
<span class="specs__name">Seating Capacity</span>
<span class="specs__value">5</span>
</article>
<article class="specs__profile">
<span class="specs__name">Boot Space (Litres)</span>
<span class="specs__value">475</span>
</article>
<article class="specs__profile">
<span class="specs__name">Body Type</span>
<span class="specs__value">SUV</span>
</article>
</main>
</article>
<article class="specs">
<main class="specs__content">
<article class="specs__profile">
<span class="specs__name">Fuel Type</span>
<span class="specs__value">Petrol</span>
</article>
<article class="specs__profile">
<span class="specs__name">No. of cylinder</span>
<span class="specs__value">4</span>
</article>
<article class="specs__profile">
<span class="specs__name">Transmission Type</span>
<span class="specs__value">Automatic</span>
</article>
<article class="specs__profile">
<span class="specs__name">Fuel Tank Capacity</span>
<span class="specs__value">50</span>
</article>
<article class="specs__profile">
<span class="specs__name">Service Cost (Avg. of 5 years)</span>
<span class="specs__value">Rs.3,858</span>
</article>
</main>
</article>
</div>
</div>
<footer>
<span>Design By <a href="https://www.linkedin.com/in/swastik-raj-singh-80ba881b8/">Swastik - Subhassini</a>
| <span class="far fa-copyright"></span> 2022 All rights
reserved.</span>
</footer>
</div>
<script src="{% static '/js/script.js' %}"></script>
</body>
</html>