-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
97 lines (94 loc) · 2.67 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hertz-UTS by Qun Lu 13298498</title>
<link rel='shortcut icon' type='image/x-icon' href='favicon.ico' />
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css" integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
<link rel="stylesheet" href="css/index.css">
<script src="js/vue.min.js"></script>
</head>
<body>
<div id="root">
<header>
<div class="inner">
<div class="home">
<a class="logo" href="index.html"></a>
</div>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="javascript:void(0)">Our cars</a></li>
<li><a href="javascript:void(0)">About us</a></li>
<li><a href="javascript:void(0)">Contact us</a></li>
</ul>
</nav>
<a href="car_rental_center.html" id="to_cart">Car Reservation</a>
</div>
</header>
<div id="slider">
<h2>Start your trip,</h2>
<h3>Now</h3>
<img src="images/slider.jpg">
</div>
<div id="car_list">
<ul>
<li class="car" v-for="car in cars">
<div class="img_box">
<img v-bind:src="'images/'+car.model+'.jpg'">
</div>
<div class="info">
<h3>{{car.model}}</h3>
<dl>
<dt>Mileage</dt>
<dd>{{car.mileage.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,')}}</dd>
<dt>Seats</dt>
<dd>{{car.seats}}</dd>
<dt>Fuel type</dt>
<dd>{{car.fuel_type}}</dd>
<dt>Model Year</dt>
<dd>{{car.model_year}}</dd>
<dt class="available">Availability</dt>
<dd class="available">{{car.availability}}</dd>
<dt class="price">Price per day</dt>
<dd class="price">{{car.price_per_day}}</dd>
</dl>
<a class="rent_button" :class="{active: car.availability=='True'}" :data-id="car.id" v-on:click="addToCart(car)">Rent this car</a>
</div>
</li>
</ul>
</div>
</div>
<footer>
<div class="inner">
<div class="left">
<ul class="webmap">
<li><h3>Web Maps</h3></li>
<li>Our cars</li>
<li>Our service</li>
<li>About us</li>
<li>Policy</li>
</ul>
<ul class="contact">
<li><h3>Contact us</h3></li>
<li>Phone: 0434 123 567</li>
<li>Fax: 0434 567 890</li>
<li>Email: info@Hert-uts.com</li>
</ul>
</div>
<div class="map">
<img src="images/map@2x.png" alt="">
</div>
</div>
<p class="copyright">All rights reserved©️Hertz-UTS@2019.</p>
</footer>
<!-- warning box -->
<div id="warning">
<p>
<strong></strong>
</p>
</div>
<script src="js/index.js"></script>
</body>
</html>