-
Notifications
You must be signed in to change notification settings - Fork 0
/
arts & culture.html
189 lines (178 loc) · 8.96 KB
/
arts & culture.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
177
178
179
180
181
182
183
184
185
186
187
188
189
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<script src="https://www.w3schools.com/lib/w3.js"></script>
<script src="js/Arts & Culture.js" defer></script>
<link rel="stylesheet" href="css/W3.css">
<link rel="stylesheet" href="css/Arts & Culture.css" />
<link rel="icon" type="image/x-icon" href="media/png/logo/logotop.png" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="Ryan" />
<meta name="description" content="Arts & Culture Main" />
<title>Arts & Culture - Tourist Attractions in Singapore</title>
</head>
<body>
<main w3-include-html="header.html"></main>
<script>
//code for inserting navigation panel
w3.includeHTML(); //this calls out the w3school method to be included in the index.html page.
</script>
<!-- Header -->
<header id="title">
<h1 class="big">Arts &<br />Culture</h1>
</header>
<section id="description">
<div id="description-header" class="alignment">
<h2>
<span class="immerse">Immerse youself in Singapore's arts scene</span><br />
<span style="font-size: 45px;">Experience her heritage and history</span>
</h2>
</div>
<hr id="description-hr" />
<div id="description-body">
<p>
Wish to explore the vibrant art scene in Singapore? Interested in catching world-class performances in stunning venues?
Hoping to dive deeper into Singapore's rich culture and heritage?
</p>
<p>These are some places you cannot miss!</p>
</div>
</section>
<!-- Arts -->
<section id="arts-section">
<h1 class="section-header alignment">Arts</h1>
<div class="w3-row-padding w3-padding-16 alignment translucent-box" id="arts-display">
<a class="w3-third grid-section" href="Victoria Theatre.html">
<img src="media/jpg/Victoria Theatre Day.jpg" alt="Victoria Theatre & Concert Hall" class="grid">
<h3 class="art-grid-title">Victoria Theatre & Concert Hall</h3>
<p class="grid-description">
Catch world-class performances in one of Singapore's most
reconisable and oldest performing arts venue
</p>
</a>
<a class="w3-third grid-section" href="National Gallery.html">
<img src="media/jpg/national gallery.jpg" alt="National Gallery Singapore" class="grid">
<h3 class="art-grid-title">National Gallery Singapore</h3>
<p class="grid-description">
Discover the world's largest collection of modern Southeast Asian art
within one of Singapore's most significant buildings
</p>
</a>
<a class="w3-third grid-section" href="Esplanade.html">
<img src="media/jpg/esplanade.jpg" alt="Esplanade" class="grid">
<h3 class="art-grid-title">Esplanade</h3>
<p class="grid-description">
Catch a non-stop line-up of world-class performances at Singapore’s
premier arts centre, situated along the scenic Marina Bay.
</p>
</a>
</div>
</section>
<hr class="section-break-hr" />
<!-- Culture -->
<section id="culture-section">
<h1 class="section-header alignment">Culture</h1>
<div class="w3-row-padding w3-padding-16 alignment translucent-box" id="arts-display">
<a class="w3-third grid-section" href="Little India.html">
<img src="media/jpg/Little India.jpg" alt="Little India" class="grid">
<h3 class="culture-grid-title">Little India</h3>
<p class="grid-description">
Explore the buzzing historic area that shows off the best of Singapore's
Indian community from vibrant culture to incredible shopping
</p>
</a>
<a class="w3-third grid-section" href="Chinatown.html">
<img src="media/jpg/Chinatown.jpg" alt="Chinatown" class="grid">
<h3 class="culture-grid-title">Chinatown</h3>
<p class="grid-description">
Learn more about chinese heritage through Singapore's historic Chinatown,
filled with traditional shops and markets as well as cool stores and cafes
</p>
</a>
<a class="w3-third grid-section" href="Kampong Glam.html">
<img src="media/jpg/Kampong Glam.jpg" alt="Kampong Glam" class="grid">
<h3 class="culture-grid-title">Kampong Glam</h3>
<p class="grid-description">
Experience malay culture and discover Kampong Glam's rich history, living
traditions, excellent eateries and trendy shops in this vibrant neighboorhood
</p>
</a>
</div>
</section>
<!--Like what you've read?-->
<section class="like">
<div>
<div class="like1">
<img src="media/png/email.png" alt="email logo" width="30" height="25" />
<p class="likebig">Like what you've read?</p>
</div>
<div>
<p class="likesmall">Subscribe to our email newsletter!</p>
</div>
<div>
<button type="button" class="button" id="signup" onclick="haveoverlay1()">Sign Up</button>
</div>
</div>
</section>
<!-- popup for signup-->
<div id="overlay1">
<div id="textonsignup">
<button class="closebuttonpopup1" onclick="turnoffoverlay1()">Close</button>
<div>
<p class="signuptitle">Sign Up</p>
<p class="signupcontent">Please fill in this form to sign up for our email newsletter.</p>
<hr />
<div>
<form id="signupForm" onsubmit="alert('Thank you for signing up!')">
<div>
<label for="emailsignup">Email:</label>
<input type="email" id="emailsignup" required class="inputwidth" />
</div>
<div>
<label for="passwordsignup">Password:</label>
<input type="password" id="passwordsignup" maxlength="11" pattern="[0-9][a-z]{10}" class="inputwidth" placeholder="Password should contain a number first, followed by 10 alphabet" required />
</div>
<div class="passwordinput">
<input type="checkbox" id="togglepassword" onclick="myPassword()" />Show Password <!--myPassword() basically show password-->
</div>
<div>
By creating an account, you are allowing us to send emails to you.
</div>
<div>
<button type="submit" class="button">Sign Up</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!--Contact Form------------------------------------------------------------------------------------------------------------->
<footer>
<section id="contact">
<div class="authorimage">
<img src="media/jpg/Ryan.jpg" alt="Photo of author" />
</div>
<div class="contentcontact">
<p>Meet the Author</p>
<p>Ryan Ng</p>
<p>
Ryan is currently a Year 1 student pursuing a diploma in Information Security
& Forensics at Ngee Ann Polytechnic. He is a tech enthusiast who enjoys building
PCs and interacting with new technologies.
</p>
<p>Read more from <a href="https://ngwhryan.wixsite.com/portfolio" target="_blank">Ryan Ng</a></p>
</div>
<div class="social-media">
<div class="smicons">
<a href="https://www.instagram.com/ryan_ngwh/" target="_blank"><img src="media/png/socialmediaicon/instagram.png" alt="instagram" width="30" height="30" /></a>
<a href="https://www.linkedin.com/in/ryan-ngwh/" target="_blank"><img src="media/png/socialmediaicon/linkedin.png" alt="linked in" width="30" height="30" /></a>
<a href="mailto:[email protected]" target="_blank"><img src="media/png/socialmediaicon/emailicon.png" alt="email" width="30" height="30" /></a>
</div>
<div class="toparrow">
<a href="#top"><img src="media/png/toparrow.png" alt="Go to Top" width="50" height="50" title="Go back to the top" /></a>
</div>
</div>
</section>
</footer>
</body>
</html>