-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
102 lines (89 loc) · 4.22 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Discover Milnerton & Dunoon, Cape Town</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<div class="header-overlay">
<h1>Discover Milnerton & Dunoon, Cape Town</h1>
<nav>
<ul>
<li><a href="#milnerton">Milnerton</a></li>
<li><a href="#dunoon">Dunoon</a></li>
<li><a href="#facts">Facts & FAQs</a></li>
<li><a href="#gallery">Gallery</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
</div>
</header>
<section id="milnerton" class="hometown-section">
<h2>Explore Milnerton</h2>
<p>Milnerton, a coastal suburb, is known for its beautiful beaches, picturesque lagoon, and stunning views of Table Mountain. The area's iconic Milnerton Lighthouse and the calm waters of the lagoon are perfect for scenic walks, water sports, and family outings.</p>
<button onclick="learnMore('Milnerton')">Learn More</button>
</section>
<section id="dunoon" class="hometown-section">
<h2>Discover Dunoon</h2>
<p>Dunoon is a lively township, known for its vibrant culture, close-knit community, and energetic street markets. The area is rapidly developing, blending modern infrastructure with traditional community living. Experience the warmth and energy of Dunoon's people as they work toward a brighter future.</p>
<button onclick="learnMore('Dunoon')">Learn More</button>
</section>
<section id="facts" class="facts-section">
<h2>Facts & FAQs</h2>
<div class="facts-container">
<div class="fact-item">
<h3>Did You Know?</h3>
<p>Milnerton Beach is one of the few places in Cape Town where you can see both Table Mountain and Robben Island in the same view.</p>
</div>
<div class="fact-item">
<h3>FAQ: How do people commute?</h3>
<p>Many locals rely on the MyCiti bus service and Golden Arrow for daily commutes. Both are affordable and provide extensive coverage across Cape Town.</p>
</div>
<div class="fact-item">
<h3>What landmarks are nearby?</h3>
<p>Milnerton Golf Club, the oldest golf course in Cape Town, is a favorite spot for both locals and visitors.</p>
</div>
</div>
</section>
<section id="gallery" class="gallery-section">
<h2>Local Highlights</h2>
<div class="gallery">
<div class="gallery-item">
<img src="Images/milnerton-beach.jpeg" alt="Milnerton Beach">
<p>Milnerton Beach at sunset.</p>
</div>
<div class="gallery-item">
<img src="Images/dunoon-market.jpeg" alt="Dunoon Market">
<p>The bustling markets of Dunoon.</p>
</div>
<div class="gallery-item">
<img src="Images/school-children.jpeg" alt="Children walking to school">
<p>Children walking to school in Dunoon.</p>
</div>
<div class="gallery-item">
<img src="Images/gettyimages-mycity.jpg" alt="Commuters">
<p>Commuters heading to work using MyCiti and Golden Arrow buses.</p>
</div>
</div>
</section>
<section id="contact" class="contact-section">
<h2>Get in Touch</h2>
<form>
<label for="name">Your Name</label>
<input type="text" id="name" name="name" placeholder="Enter your name" required>
<label for="email">Email</label>
<input type="email" id="email" name="email" placeholder="Enter your email" required>
<label for="message">Message</label>
<textarea id="message" name="message" placeholder="Your message" required></textarea>
<button type="submit">Send Message</button>
</form>
</section>
<footer>
<p>2024 Discover Milnerton & Dunoon.</p>
</footer>
<script src="script.js"></script>
</body>
</html>