-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
130 lines (115 loc) · 5.62 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
<!DOCTYPE html>
<html lang="en" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>tasla</title>
<link rel="stylesheet" href="src/output.css">
</head>
<body>
<main class="">
<header class="relative">
<nav class="flex justify-between text-xl w-full fiexd top-0 z-10 h-28 px-10 items-center relative">
<!-- logo -->
<div class="logo ">
<svg class="tds-icon tds-icon-logo-wordmark tds-site-logo-icon h-6" viewBox="0 0 342 35" xmlns="http://www.w3.org/2000/svg"><path d="M0 .1a9.7 9.7 0 0 0 7 7h11l.5.1v27.6h6.8V7.3L26 7h11a9.8 9.8 0 0 0 7-7H0zm238.6 0h-6.8v34.8H263a9.7 9.7 0 0 0 6-6.8h-30.3V0zm-52.3 6.8c3.6-1 6.6-3.8 7.4-6.9l-38.1.1v20.6h31.1v7.2h-24.4a13.6 13.6 0 0 0-8.7 7h39.9v-21h-31.2v-7h24zm116.2 28h6.7v-14h24.6v14h6.7v-21h-38zM85.3 7h26a9.6 9.6 0 0 0 7.1-7H78.3a9.6 9.6 0 0 0 7 7zm0 13.8h26a9.6 9.6 0 0 0 7.1-7H78.3a9.6 9.6 0 0 0 7 7zm0 14.1h26a9.6 9.6 0 0 0 7.1-7H78.3a9.6 9.6 0 0 0 7 7zM308.5 7h26a9.6 9.6 0 0 0 7-7h-40a9.6 9.6 0 0 0 7 7z" fill="currentColor"></path></svg>
</div>
<!-- manu -->
<div class="hidden lg:block">
<a href="#modelY" class="nav_item">Model y</a>
<a href="#model3" class="nav_item">Model 3</a>
<a href="#ModelX" class="nav_item">Model x</a>
<a href="#SolarRoof" class="nav_item">Solar Roof</a>
<a href="#Cybertruck" class="nav_item">Help Me Choose</a>
</div>
<div class="">
<a class="nav_item hidden lg:inline" href="#shop">shop</a>
<a class="nav_item hidden lg:inline" href="#Acount">Acount</a>
<a class="nav_item" href="#manu">manu</a>
</div>
</nav>
</header>
<!-- section Model Y -->
<section id="modelY" class="car_section">
<img class="car_img" src="https://digitalassets.tesla.com/tesla-contents/image/upload/f_auto,q_auto/Homepage-Model-Y-Desktop-Global.png" alt="Model y">
<div class="car_detils">
<h2 class="car_name ">Model Y</h2>
<h3 class="car_price">From $29,490* </h3>
<p class="car_tagline">After Federal Tax Credit & Est. Gas Savings</p>
</div>
<div class="car_buttuns" >
<a href="btn" class="btn">Order Now</a>
<a href="btn demo" class="btn demo">Demo Drive</a>
</div>
<div class="down_arraw">
<a href="#model3">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 animate-bounce">
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
</svg>
</a>
</div>
</section>
<!-- section Model 3 -->
<section id="model3" class="car_section ">
<img class="car_img" src="https://digitalassets.tesla.com/tesla-contents/image/upload/f_auto,q_auto/Homepage-Model-3-Desktop-LHD-v2.jpg" alt="Model y">
<div class="car_detils">
<h2 class="car_name ">Model 3</h2>
<h3 class="car_price">From $299/mo* </h3>
<p class="car_tagline">Est. Lease Price Before Gas Savings</p>
</div>
<div class="car_buttuns" >
<a href="btn" class="btn">Order Now</a>
<a href="btn demo" class="btn demo">Demo Drive</a>
</div>
<div class="down_arraw">
<a href="#ModelX">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 animate-bounce">
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
</svg>
</a>
</div>
</section>
<!-- section Model X -->
<section id="ModelX" class="car_section ">
<img class="car_img" src="https://digitalassets.tesla.com/tesla-contents/image/upload/h_1800,w_2880,c_fit,f_auto,q_auto:best/Homepage-Model-X-Desktop-LHD" alt="Model y">
<div class="car_detils">
<h2 class="car_name ">Model X</h2>
<h3 class="car_price">From $299/mo* </h3>
<p class="car_tagline">Est. Lease Price Before Gas Savings</p>
</div>
<div class="car_buttuns" >
<a href="btn" class="btn">Order Now</a>
<a href="btn demo" class="btn demo">Demo Drive</a>
</div>
<!-- down_arraw -->
<div class="down_arraw">
<a href="#SolarRoof">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 animate-bounce">
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
</svg>
</a>
</div>
</section>
<!-- section Solar Roof -->
<section id="SolarRoof" class="car_section " >
<img class="car_img" src="https://digitalassets.tesla.com/tesla-contents/image/upload/h_1800,w_2880,c_fit,f_auto,q_auto:best/Homepage-SolarRoof-Desktop-Global" alt="Model y">
<div class="car_detils">
<h2 class="car_name ">Solar Roof</h2>
<p class="car_tagline">Produce Clean Energy From Your Roof</p>
</div>
<div class="car_buttuns" >
<a href="btn" class="btn">Order Now</a>
<a href="btn demo" class="btn demo">Demo Drive</a>
</div>
<!-- down_arraw -->
<div class="down_arraw">
<a href="#">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 animate-bounce">
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
</svg>
</a>
</div>
</section>
</main>
</body>
</html>