-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
96 lines (80 loc) · 3.49 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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Akan-names</title>
<link href="css/styles.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
<link href='https://cdn.jsdelivr.net/npm/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
</head>
<body>
<div class="web">
<div class="container">
<div class="Jumbotron">
<div class="header">
<h1>Akan Names WebApp</h1>
</div>
<div class="intro">
<p>This webpage has been created to help Ghanaian children who don't know their traditional names and the day of the week they were born to identify them. In Ghana, children are named depending on the day of the week they were born. To know their names, children need to enter their birthday, month, and year. After submitting the details, an alert showing the day and the name of the child will pop up on the screen. Below is a list of Ghanaian female and male children names according to the day of the week they were born.</p>
</div>
</div>
<div class="contains">
<div class="headers">
<h4> Male Names</h4> <br>
</div>
<div class="row">
<p>Sunday: Kwasi, Monday: Kwadwo</p>
<p>Tuesday: Kwabena, Wednesday: Kwaku</p>
<p>Thursday: Yaw, Friday: Kofi</p>
<p>Saturday: Kwame</p>
</div>
<div class="row1">
<div class="headers1">
<h4>Female Names</h4>
</div>
<p>Sunday: Akosua, Monday: Adwoa</p>
<p>Tuesday: Abenaa, Wednesday: Akua</p>
<p>Thursday: Yaa, Friday: Afua</p>
<p>Saturday: Ama</p>
</div>
</div>
<div class="list">
</div>
<form class="form">
<p>Fill in your details to know your name and the day you were born.</p>
<div class="personal">
<label for="birthDay">Birthday:
<input type="date" id="date" value=""/> </label>
<br>
<label for="gender">Gender:
<select id="gender">
<option value="male" id="male" > Male</option>
<option value="female" id="female">Female</option>
</select> </label>
<input type="button" value="Submit" id="button" style="background-color: blue; font-style: bold" onclick="akan()"/>
<br>
</div>
<div id="output"></div>
</form>
<footer class="footer">
<p class="footer__title">Akhan Names</p>
<div class="number
"<h5>Get in touch</h5> </div>
<div class="footer__social">
<a href="https://www.linkedin.com/in/dennis-yiaile-3ab6851a7" class="footer__icon"><i class='bx bxl-linkedin'></i></a>
<a href="https://github.com/Dennis-tec" class="footer__icon"><i class='bx bxl-github' ></i></a>
<a href="https://www.facebook.com/denno.kamakx" class="footer__icon"><i class='bx bxl-facebook' ></i></a>
<a href="https://www.instagram.com/yiaile_kamakei/" class="footer__icon"><i class='bx bxl-instagram' ></i></a>
<a href="https://twitter.com/YKamakei?s=08" class="footer__icon"><i class='bx bxl-twitter' ></i></a>
<div class="rights">
<p>© 2020 copyright all rights reserved</p>
</div>
</div>
</footer>
</body>
<script src="js/script.js">
</script>
</html>