-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
140 lines (129 loc) · 6.48 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
<html lang="en" data-bs-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Philippines</title>
<link rel="stylesheet" href="style.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<link rel="icon" type="image/x-icon" href="./assets/Flag.jpeg">
</head>
<body>
<!--NavBar Down below-->
<div class="card">
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="#"><img src="./assets/Flag.jpeg" alt="Flag" width="30"> Philippines</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Culture</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Food</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
<h2>Images of beautiful Philippines</h2>
<div class="card">
<div class="px-4 pt-5 my-5 text-center border-bottom">
<h1 class="display-4 fw-bold text-body-emphasis">Filipino Food</h1>
<div class="col-lg-6 mx-auto">
<p class="lead mb-4">
Filipino Chicken Adobo,
the national dish of the Philippines is the most delicious chicken braised in vinegar,
soy sauce and lots of garlic.</p>
</div>
<div class="overflow-hidden" style="max-height: 30vh;">
<div class="container px-5">
<img src="./assets/Adobo.jpg" class="img-fluid border rounded-3 shadow-lg mb-4" alt="Example image" width="700" height="900" loading="lazy">
</div>
</div>
</div>
</div>
<h3 class="header">Image Slider</h3>
<div class="container">
<div id="carouselExampleIndicators" class="carousel slide">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./assets/Manila.jpg" class="d-block w-100" alt="Manila">
</div>
<div class="carousel-item">
<img src="./assets/Bataan.jpg" class="d-block w-100" alt="Bataan">
</div>
<div class="carousel-item">
<img src="./assets/Island.jpg" class="d-block w-100" alt="Island">
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
<h4 class="head">Culture Of the Philippines</h4>
<div class="flex-layout">
<div class="card" style="width: 18rem;">
<img src="./assets/Culture.jpg" class="card-img-top" alt="Culture">
<div class="card-body">
<p class="card-text">
The Philippines is a country full of love, light, laughter, and food.
With a slight influence from America and some parts of Asia, the culture
of the Philippines is mainly a blend of Filipino and Spanish Catholic traditions.
</p>
</div>
</div>
<div class="card" style="width: 18rem;">
<img src="./assets/Family.jpg" class="card-img-top" alt="Family">
<div class="card-body">
<p class="card-text">
The Filipinos take pride in their families. Their daily life revolves around close and extended family.
Parents, grandparents, uncles and aunts, cousins, and very close friends are all an integral part, moving
down to the third and fourth generation as well.
</p>
</div>
</div>
<div class="card" style="width: 18rem;">
<img src="./assets/Art.jpeg" class="card-img-top" alt="Art">
<div class="card-body">
<p class="card-text">
Arts in the Philippines gives a good insight into the cultural diversity of the nation.
All areas like music, dance, theatre, paintings, and literature are very much part of the Filipino culture.
Filipinos are incredibly talented in music, and subsequently, dance. Even in the 21st century, folk music
and dances have not lost momentum.
</p>
</div>
</div>
</div>
<!--Footer-->
<footer class="py-3 my-4">
<ul class="nav justify-content-center border-bottom pb-3 mb-3">
<li class="nav-item"><a href="#" class="nav-link px-2 text-body-secondary">Home</a></li>
<li class="nav-item"><a href="#" class="nav-link px-2 text-body-secondary">Features</a></li>
<li class="nav-item"><a href="#" class="nav-link px-2 text-body-secondary">About</a></li>
</ul>
<p class="text-center text-body-secondary">© 2023. All Rights Reserved. Designed by Brandon Torres</p>
</footer>
<!--Bootstrap JS link-->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
</body>
</html>