This repository has been archived by the owner on Oct 15, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
168 lines (144 loc) · 7.5 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
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CanarySport</title>
<link rel="stylesheet" href="css/index.css" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
rel="stylesheet">
</head>
<body>
<!-- navbar header -->
<div class="nav-header">
<i class="fa fa-bars fa-3x"></i>
<div class="header-links">
<ul>
<li data-menuanchor="fifthPage">
<a href="login.html" id="userLink" style="color: black">SIGN IN</a>
<div class="dropdown-menu" style="display: none;">
<a href="personal_info.html">Personal Information</a>
<a href="#" id="logout">Log Out</a>
</div>
</li>
<li data-menuanchor="fourthPage"><a href="events.html" style="color: black">START</a></li>
<li data-menuanchor="thirdPage"><a href="#portfolio" style="color: black">CONTACT</a></li>
<li data-menuanchor="secondPage"><a href="#about" style="color: black">ABOUT US</a></li>
</ul>
</div>
</div>
<!-- end navbar header -->
<!-- begin fullpage -->
<div id="fullpage">
<!-- begin section -->
<div class="section aboutme" data-anchor="aboutme">
<div class="opaque-bg animated fadeInDown">
<h1 style="color:white">CANARY<span style="color:#FF6363">/</span>SPORT</h1>
<p><span id="holder"></span><span class="blinking-cursor">|</span></p>
</div>
</div>
<!-- end section -->
<!-- begin section -->
<div class="section" data-anchor="skills">
<div class="content">
<h1 class="wow fadeInDown" data-wow-delay="0.2s">ABOUT US</h1>
<p class="wow fadeInDown" data-wow-delay="0.2s">Hi, we're CanarySport, a passionate team dedicated to providing you with unforgettable sports experiences in Gran Canaria.</p>
<hr width="80%">
<p class="wow fadeInDown" data-wow-delay="0.2s">Based on this beautiful island, we specialize in offering a wide range of activities and services designed for you to make the most of your leisure time. </p>
<p class="wow fadeInDown" data-wow-delay="0.2s">From thrilling water sports to exciting nature excursions, we're here to make your stay in Gran Canaria unique and memorable.</p>
<div class=" wow fadeInUp container-skillbar" data-wow-delay="0.2s">
<div class="skillbar clearfix " data-percent="90%">
<div class="skillbar-title" style="background: #DD1E2F;"><span>SATISFACTION</span></div>
<div class="skillbar-bar" style="background: #DD1E2F;"></div>
<div class="skill-bar-percent">93%</div>
</div> <!-- End Skill Bar -->
<div class="skillbar clearfix " data-percent="80%">
<div class="skillbar-title" style="background: #EBB035;"><span>TRUST</span></div>
<div class="skillbar-bar" style="background: #EBB035;"></div>
<div class="skill-bar-percent">83%</div>
</div> <!-- End Skill Bar -->
<div class="skillbar clearfix " data-percent="75%">
<div class="skillbar-title" style="background: #218559;"><span>EFFICIENCY</span></div>
<div class="skillbar-bar" style="background: #218559;"></div>
<div class="skill-bar-percent">78%</div>
</div> <!-- End Skill Bar -->
<div class="skillbar clearfix " data-percent="45%">
<div class="skillbar-title" style="background: #6840D4;"><span>CREATIVITY</span></div>
<div class="skillbar-bar" style="background: #6840D4;"></div>
<div class="skill-bar-percent">45%</div>
</div> <!-- End Skill Bar -->
<div class="skillbar clearfix " data-percent="30%">
<div class="skillbar-title" style="background: #06A2CB;"><span>CHALLENGES</span></div>
<div class="skillbar-bar" style="background: #06A2CB;"></div>
<div class="skill-bar-percent">30%</div>
</div> <!-- End Skill Bar -->
<div class="skillbar clearfix " data-percent="20%">
<div class="skillbar-title" style="background: #AB4DD2;"><span>ISSUES</span></div>
<div class="skillbar-bar" style="background: #AB4DD2;"></div>
<div class="skill-bar-percent">20%</div>
</div> <!-- End Skill Bar -->
</div>
</div>
</div>
<!-- end section -->
<!-- begin section -->
<div class="section" data-anchor="contact">
<div class="content wow fadeInDown" data-wow-delay="0.2s">
<h1>CONTACT US</h1>
<br>
<div class="footer-content">
<p>Contact Us: <a href="mailto:[email protected]">[email protected]</a></p>
<br>
<p>Follow us on <a href="#">Social Media</a></p>
<br>
<p>© 2024 PDIGS-GranSport. All rights reserved.</p>
</div>
</div>
</div>
<!-- end section -->
</div>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.7.4/jquery.fullPage.min.js"></script>
<script src="js/index.js"></script>
<script type="module">
import { auth } from '/js/firebaseIntegration.js';
document.addEventListener('DOMContentLoaded', function() {
const userLink = document.getElementById('userLink');
const dropdownMenu = document.querySelector('.dropdown-menu');
// Toggle dropdown menu only if logged in
userLink.addEventListener('click', function(event) {
if (auth.currentUser) {
event.preventDefault(); // Prevent default only if user is logged in
dropdownMenu.style.display = dropdownMenu.style.display === 'block' ? 'none' : 'block';
}
});
// Setup logout
document.getElementById('logout').addEventListener('click', function(event) {
event.preventDefault();
auth.signOut().then(() => {
console.log('Logout Successful');
window.location.href = 'index.html'; // Redirect to login after logout
}).catch((error) => {
console.error('Logout Failed', error);
});
});
auth.onAuthStateChanged(user => {
console.log("User status changed: ", user);
if (user) {
userLink.textContent = "MY DATA";
userLink.href = "#"; // Prevent navigation when clicking on "MY DATA"
dropdownMenu.style.display = 'none'; // Ensure dropdown is hidden initially
} else {
userLink.textContent = "SIGN IN";
userLink.href = "login.html"; // Ensure the link points to the login page when not logged in
}
});
});
</script>
</body>
</html>