-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
176 lines (154 loc) · 9.32 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
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Browser -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- SEO -->
<meta name="robots" content="index, follow">
<meta name="author" content="Zyndly Kent Baja" />
<meta name="copyright" content="Zyndly Kent Baja" />
<meta name="description" content="Homepage | Tarlac Tours" />
<meta name="keywords" content="Tarlac,Tarlac Tourist,Tours"/>
<!-- Style -->
<link href="/dist/output.css" rel="stylesheet">
<!-- Favicon -->
<title> Home | Tarlac Tours</title>
<link rel="icon" type="image/x-icon" href="/images/favicon/favicon.ico">
</head>
<!-- NAV REGION-->
<nav class="bg-black border-b-2 border-lime-400 shadow-lg">
<div class="max-w-6xl mx-auto px-4">
<div class="flex justify-between">
<div class="flex space-x-7">
<div>
<!-- Logo -->
<a href="/index.html" class="flex items-center py-4 px-2 ">
<img src="https://seeabletarlac.vercel.app/images/logo.png" alt="Logo" class="h-8 w-8 mr-2 shadow-lg shadow-lime-400">
<span class="font-semibold text-white text-lg hover:text-lime-600 ">Tarlac Tours</span>
</a>
</div>
<!--insert primary navbar items if ever -->
<div class="hidden md:flex items-center space-x-1">
</div>
</div>
<!-- secondary navbar items -->
<div class="hidden md:flex items-center space-x-3 font-bold">
<a href="/index.html" class="py-4 px-2 text-lime-600 border-b-4 border-lime-400 font-semibold ">Home</a>
<a href="/tours/district-1/index.html" class="py-4 px-2 text-white font-semibold hover:text-lime-500 transition duration-300">District 1</a>
<a href="/tours/district-2/index.html" class="py-4 px-2 text-white font-semibold hover:text-lime-500 transition duration-300">District 2</a>
<a href="/tours/district-3/index.html" class="py-4 px-2 text-white font-semibold hover:text-lime-500 transition duration-300">District 3</a>
</div>
<!-- Mobile menu button -->
<div class="md:hidden flex items-center">
<button class="outline-none mobile-menu-button">
<svg class=" w-6 h-6 text-white hover:text-lime-500 "
x-show="!showMenu"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</button>
</div>
</div>
</div>
<!-- mobile menu -->
<div class="hidden mobile-menu">
<ul class="">
<li class="active"><a href="index.html" class="block text-sm px-2 py-4 text-white bg-green-500 font-semibold">Home</a></li>
<li><a href="/tours/district-1/index.html" class="block text-sm px-2 py-4 text-white hover:text-lime-500 transition duration-300 font-semibold">District 1</a></li>
<li><a href="/tours/district-2/index.html" class="block text-sm px-2 py-4 text-white hover:text-lime-500 transition duration-300 font-semibold">District 2</a></li>
<li><a href="/tours/district-3/index.html" class="block text-sm px-2 py-4 text-white hover:text-lime-500 transition duration-300 font-semibold">District 3</a></li>
</ul>
</div>
<script>
const btn = document.querySelector("button.mobile-menu-button");
const menu = document.querySelector(".mobile-menu");
btn.addEventListener("click", () => {
menu.classList.toggle("hidden");
});
</script>
</nav>
<!-- END REGION -->
<body class="bg-black">
<!-- Container Div -->
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<h1 class="text-3xl md:text-6xl font-bold text-center text-lime-600">
Welcome to Tarlac Tours
</h1>
<!--District Container -->
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
<h2 class="text-lime-600 mt-10">
District 1
</h2>
<div class="flex flex-row items-center w-full lg:px-8 lg:py-3 py-2">
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/anao/index.html">Anao</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/camiling/index.html">Camiling</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/mayantoc/index.html">Mayantoc</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/moncada/index.html">Moncada</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/paniqui/index.html">Paniqui</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/pura/index.html">Pura</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/ramos/index.html">Ramos</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/san-clemente/index.html">San Clemente</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/san-manuel/index.html">San Manuel</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-1/sta-ignacia/index.html">Sta. Ignacia</a>
</div>
<h2 class="text-lime-600 mt-10">
District 2
</h2>
<div class="flex flex-row items-center w-full lg:px-8 lg:py-3 py-2">
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-2/gerona/index.html">Gerona</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-2/san-jose/index.html">San Jose</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-2/tarlac-city/index.html">Tarlac City</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-2/victoria/index.html">Victoria</a>
</div>
<h2 class="text-lime-600 mt-10">
District 3
</h2>
<div class="flex flex-row items-center w-full lg:px-8 lg:py-3 py-2">
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-3/bamban/index.html">Bamban</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-3/capaz/index.html">Capaz</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-3/concepcion/index.html">Concepcion</a>
<a class="cursor-pointer px-3 py-1 mx-2 hover:bg-lime-800 text-white rounded-full" href="/tours/district-3/la-paz/index.html">La Paz</a>
</div>
<!--End of District 3 -->
</div>
<!--End of Container Div -->
</div>
</body>
<!-- Footer Region-->
<footer>
<div class=" bg-black ">
<!-- border-->
<div class=" layout border-t-2 border-lime-500"> </div>
<div class="max-w-2xl mx-auto text-white py-10">
<div class="text-center">
<h3 class="text-3xl mb-3">See the beauty of Tarlac, Philippines </h3>
<div class="flex justify-center my-10 hover:border-lime-500">
<div class="flex items-center border hover:border-lime-500 w-auto rounded-lg px-4 py-2 mx-2">
<img src="https://seeabletarlac.vercel.app/images/logo.png" class="w-7 md:w-8">
<div class="text-left ml-3">
<a href="https://seeabletarlac.vercel.app/" class='text-gray-200 hover:text-lime-500'>View our website </a>
</div>
</div>
</div>
</div>
<div class="mt-28 flex flex-col md:flex-row md:justify-between items-center text-sm text-gray-400">
<p class="order-2 md:order-1 mt-8 md:mt-0"> © Tarlac Tours | Seeable Tarlac, 2022. </p>
<div class="order-1 md:order-2">
<a href="https://seeabletarlac.vercel.app/about" class="px-2 hover:text-lime-500">About us</a>
<a href="https://seeabletarlac.vercel.app/about/privacy" class="px-2 hover:text-lime-500">Privacy Policy</a>
<a href="https://seeabletarlac.vercel.app/contact" class="px-2 hover:text-lime-500">Contact us</a>
</div>
</div>
</div>
</div>
</footer>
<!-- End Region-->
</html>