-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
244 lines (232 loc) · 12.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
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
<!DOCTYPE html>
<html>
<head>
<meta charset=""UTF-8">
<meta http-equiv=""X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Taseen Rahman</title>
<link rel="stylesheet" href="CSS/style.css">
<script src="https://kit.fontawesome.com/d7ac14ee54.js" crossorigin="anonymous"></script>
</head>
<body>
<div id="header">
<div class="container">
<nav>
<img src="Images/tkr-tech-logo-transparent-2.png" class="logo">
<ul id="sidemenu">
<li><a href="#header">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">My Work</a></li>
<li><a href="#contact">Contact</a></li>
<i class="fa-solid fa-xmark" onclick="closemenu()"></i>
</ul>
<i class="fa-solid fa-bars" onclick="openmenu()"></i>
</nav>
<div class="header-text">
<p>Computer Scientist</p>
<h1>Hi, I'm <span>Taseen</span><br>I'm a student at Queen Mary University of London</h1>
</div>
</div>
</div>
<div>
<!----------about---------->
</div>
<div id="about">
<div class="container">
<div class="row">
<div class="about-col-1">
<img src="Images/Taseen.jpg">
</div>
<div class="about-col-2">
<h1 class="subtitle">About Me</h1>
<p>
👋 Hello there! I'm Taseen, a dedicated computer science student at Queen Mary University of London.
It's no secret that I LOVE technology, and my passion for it knows no bounds.
<br><br>
💡 Whether it's delving into the intricacies of coding, exploring the latest tech trends, or experimenting with innovative solutions,
I thrive on the dynamic nature of the digital landscape. Technology isn't just a field of study for me as I
actively embrace and integrate into my own life - like with my own custom smart home!
<br><br>
🚀 As I navigate the ever-evolving tech landscape, I'm not just a spectator; I'm an enthusiastic participant.
My personal and academic pursuits reflect my unwavering commitment to staying at the forefront of innovation.
<br><br>
🤝 Join me on this exhilarating ride through the digital realm, where curiosity meets coding, and passion fuels progress.
Let's explore the limitless possibilities that technology unfolds, one line of code at a time.
</p>
<div class="tab-titles">
<p class="tab-links active-link" onclick="opentab('skills')">Skills</p>
<p class="tab-links" onclick="opentab('experience')">Experience</p>
<p class="tab-links" onclick="opentab('education')">Education</p>
</div>
<div class="tab-contents active-tab" id="skills">
<ul>
<li><span>Python</span><br>
Being the language i grew up on, it's undeniably my favourite. With years of experience with python
I'm proud to list it as a skill.
</li>
<li><span>Java</span><br>
Learning Java at uni has incredible. Being an object oriented programming makes it so powerful and is
definitely a language I love to use.
</li>
<li><span>HTML</span><br>
The fundamental language behind the construction of this website, it's a skill i deem essential!
</li>
</ul>
</div>
<div class="tab-contents" id="experience">
<ul>
<li><span>Vue Cinema</span><br>
As a Customer Assistant at Vue, I operated efficiently behind the till while also maintaining a clean and welcoming cinema environment.
My role extended beyond transactions to actively contribute to a positive customer experience throughout the venue.
</li>
<li><span>Soundstage Hi-Fi</span><br>
As Web Developer I was responsible for maintaining the website as well completing search engine optimisations, elevating the brand’s online presence.
Additionally, I lead social media initiatives and ad campaigns, engaging audiophiles and expanding the company’s reach.
</li>
<li><span>Smart Home Consultant</span><br>
I've always had a love for smart homes and after buiulding my own one using Home Assistant I started building them for customers. Using job sites
such as Fiverr, I was able to find clients for which I designed UI dashboards, did hardware plans, integrated their devices, and
developed automations.
</li>
</ul>
</div>
<div class="tab-contents" id="education">
<ul>
<li><span>2022-2025</span><br>BSc Computer Science - Queen Mary University of London</li>
<li><span>2020-2022</span><br>Maths, Physics, Computer Science A-Levels - Ashmole academy</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-----------Projects/Services CURRENTLY HIDDEN IN CSS----------->
<div id="projects">
<div class="container">
<h1 class="subtitle">Projects</h1>
<div class="projects-list">
<div>
<i class="fa-solid fa-house-signal"></i>
<h2>Smart Home</h2>
<p>asfdasif dfyidgifasgdf iasd 8asytdusaygdusad d wtdi s </p>
<a href="#">Learn More</a>
</div>
<div>
<i class="fa-solid fa-house-signal"></i>
<h2>Smart Home 2</h2>
<p>asfdasif dfyidgifasgdf iasd 8asytdusaygdusad d wtdi s </p>
<a href="#">Learn More</a>
</div>
<div>
<i class="fa-solid fa-house-signal"></i>
<h2>Smart Home 3</h2>
<p>asfdasif dfyidgifasgdf iasd 8asytdusaygdusad d wtdi s </p>
<a href="#">Learn More</a>
</div>
</div>
</div>
</div>
<!---------Portfolio---------->
<div id="portfolio">
<div class="container">
<h1 class="subtitle">My Work</h1>
<div class="work-list">
<div class="work">
<img src="Images/smart-home.png" alt="">
<div class="layer">
<h3>Smart Home</h3>
<p>ajhsdiuh awgdiwa asgdi w uiwsd gs wgi dwwds.</p>
<a href="#"><i class="fa-solid fa-link"></i></a>
</div>
</div>
<div class="work">
<img src="Images/govee-glide.jpeg" alt="">
<div class="layer">
<h3>Govee LAN API Python Controller</h3>
<p>This python script utilises the Govee LAN API to control the device over the local network.</p>
<a href="https://github.com/Taseen18/GoveeLAN"><i class="fa-solid fa-link"></i></a>
</div>
</div>
<div class="work">
<img src="Images/Gabriel-Leblanc-Historic-Mac-Xserve.512.png" alt="">
<div class="layer">
<h3>Smart Home 3</h3>
<p>ajhsdiuh awgdiwa asgdi w uiwsd gs wgi dwwds.</p>
<a href="#"><i class="fa-solid fa-link"></i></a>
</div>
</div>
</div>
<!--<a href="#" class="btn">See More</a> UNCOMMENT TO ADD BUTTON-->
</div>
</div>
<!--contact-->
<div id="contact">
<div class="container">
<div class="row">
<div class="contact-left">
<h1 class="subtitle">Contact Me</h1>
<p><i class="fa-solid fa-phone"></i>(+44) 7482999002</p>
<div class="social-icons">
<a href="https://www.linkedin.com/in/taseen-rahman-694486258"><i class="fa-brands fa-linkedin"></i></a>
<a href="https://github.com/Taseen18"><i class="fa-brands fa-square-github"></i></a>
</div>
<a href="" download class="btn btn2">Download CV</a>
</div>
<div class="contact-right">
<form name="submit-to-google-sheet">
<input type="text" name="Name" placeholder="Your Name" required>
<input type="email" name="Email" placeholder="Your Email" required>
<textarea name="Message"rows="6" placeholder="Your Message"></textarea>
<button type="submit" class="btn btn2">Submit</button>
</form>
<span id="msg"></span>
</div>
</div>
</div>
<div class="copyright">
<p>Copyright Taseen Rahman</p>
</div>
</div>
<script>
var tablinks = document.getElementsByClassName("tab-links");
var tabcontents = document.getElementsByClassName("tab-contents");
function opentab(tabname){
for(tablink of tablinks){
tablink.classList.remove("active-link");
}
for(tabcontent of tabcontents){
tabcontent.classList.remove("active-tab");
}
event.currentTarget.classList.add("active-link");
document.getElementById(tabname).classList.add("active-tab")
}
</script>
<script>
var sidemenu = document.getElementById("sidemenu")
function openmenu(){
sidemenu.style.right = "0";
}
function closemenu(){
sidemenu.style.right = "-200px";
}
</script>
<script>
const scriptURL = 'https://script.google.com/macros/s/AKfycbz8xZjZ7R0XbvTySNa92pVIVLQ10F5YiSFs6nwtQJespsPlX-g9jM5T0YKrcPKG7t0j/exec'
const form = document.forms['submit-to-google-sheet']
const msg = document.getElementById("msg")
form.addEventListener('submit', e => {
e.preventDefault()
fetch(scriptURL, { method: 'POST', body: new FormData(form)})
.then(response => {
msg.innerHTML = "Success"
setTimeout(function(){
msg.innerHTML = ""
},5000)
form.reset()
})
.catch(error => console.error('Error!', error.message))
})
</script>
</body>
</html>