-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
176 lines (160 loc) · 7.79 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
<!--
Copyright (C) 2023 Alessandro Amatucci Girlanda
This file is part of Capoeira - Website.
Capoeira - Website is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Capoeira - Website is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Capoeira - Website. If not, see
<https: //www.gnu.org/licenses />.
-->
<!DOCTYPE html>
<html lang="en">
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<link href="styles.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Fjalla+One|Libre+Baskerville" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4"
crossorigin="anonymous"></script>
<script src="interactive.js"></script>
<meta name="viewport" content="initial-scale=1" , width="device-width">
<title>Home</title>
</head>
<body>
<!-- Bootstrap - Navigation Bar -->
<nav class="navbar navbar-expand-lg bg-light">
<div class="container-fluid">
<a id="navbar-pic-space" class="navbar-brand" href="index.html">
<img id="navbar-pic" src="pictures/logo.jpg" alt="Logo">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link active-link nav-link-button active" aria-current="page"
href="index.html">Home</a>
<a class="nav-link nav-link-button" href="history.html">History</a>
<a class="nav-link nav-link-button" href="shop.html">Shop</a>
<a class="nav-link nav-link-button" href="movements.html">Movements</a>
</div>
</div>
</div>
</nav>
<!-- Main Picture -->
<div id="main-home-pic-container">
<img id="main-home-pic" src="pictures/home/pic1.jpg" alt="Capoeira Wallpaper">
</div>
<!--
-- What is it? -- Table (Bootstrap is used)
- 1 Row and 2 Columns:
Column 1: header and text
Column 2: Picture
-->
<div class="container home-text-container">
<div class="row">
<div class="col align-self-center">
<h2 id="about">About Capoeira</h2>
<p>
Capoeira is a Brazilian martial art disguised as a dance and performed to musical instruments and
traditional Brazilian songs.
It is comprised of specific offensive and defensive movements and, unlike in other martial arts,
the participant is constantly in motion because of the basic movement, the ginga.
The movements also consist of positions on the ground, kicks, sweeps and acrobatics.
Some believe that capoeira originated in Africa, others say that it was formed in Brazil.
The regional style of capoeira originated in the 1930s in Brazil and, unlike capoeira angola,
is usually practiced to a quicker beat and kicks are performed in an upright and aggressive style.
</p>
</div>
<div class="col align-self-center">
<img id="about-pic" class="home-pic" src="pictures/home/pic2.jpg" alt="Roda">
</div>
</div>
</div>
<div class="container home-text-container">
<div class="row">
<div class="col align-self-center">
<img id="fight-pic" class="home-pic" src="pictures/home/pic3.jpg" alt="Capoeiristas Playing">
</div>
<div class="col align-self-center">
<h2>Dance or Fight?</h2>
<p>
Capoeira is best described not as a dance but as a sport in which the participants—historically,
sometimes with blades strapped to their ankles or held between their toes—swing their legs high in
attack, perform aerial somersaults, and pass within a hairsbreadth of each other’s knees, head,
groin, or stomach.
Flexibility, stamina, rapidity of movement, and malicia (deception) are more important than sheer
muscular strength.
Although marked by the use of graceful, fluid, and often acrobatic movements as a means to escape
rather than block an attack, the “game” of capoeira, as it is called by its practitioners, can
nonetheless be lethal when contact is actually made with a well-timed, well-placed blow.
</p>
</div>
</div>
</div>
<footer>
<div class="container-fluid" style="width: 80%">
<div class="row">
<div class="col">
<img id="footer-logo" src="pictures/logo.jpg" alt="Logo">
</div>
<div class="col">
<table class="footer-table-col">
<tr>
<th><a href="index.html#top">Home</a></th>
</tr>
<tr>
<td><a href="index.html#about">About Capoeira</a></td>
</tr>
<tr>
<td><a href="index.html#fight-pic">Dance or Fight</a></td>
</tr>
</table>
</div>
<div class="col">
<table class="footer-table-col">
<tr>
<th><a href="history.html#top">History</a></th>
</tr>
</table>
</div>
<div class="col">
<table class="footer-table-col">
<tr>
<th><a href="shop.html#top">Shop</a></th>
</tr>
<tr>
<td><a href="shop.html#instruments">Instruments</a></td>
</tr>
<tr>
<td><a href="shop.html#clothes">Clothes</a></td>
</tr>
</table>
</div>
<div class="col">
<table class="footer-table-col">
<tr>
<th><a href="movements.html#top">Movements</a></th>
</tr>
<tr>
<td><a href="movements.html#ginga">Ginga</a></td>
</tr>
<tr>
<td><a href="movements.html#movements">General Movements</a></td>
</tr>
</table>
</div>
</div>
</div>
<div id="footer-copyright">© Capoeira Curioso 2023</div>
</footer>
</body>
</html>