-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
103 lines (88 loc) · 4.26 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
<html lang ="en">
<head>
<script src="https://kit.fontawesome.com/f3348a7004.js"
crossorigin="anonymous"></script>
<link rel="stylesheet" href=
"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="icon" href="resources/logo1.png" type="image/x-icon" />
<title>Shaaf Yousaf</title>
<link rel="stylesheet" type="text/css" href="css/styles.css">
<meta charset="UTF-8">
<meta name ='viewport' content="width=device-width, initial-scale=1.0">
<title>Home Page</title>
<!-- <script>-->
<!-- window.onload = function() {-->
<!-- var videoElement = document.getElementById("myVideo");-->
<!-- if (window.innerWidth <= 855) {-->
<!-- videoElement.style.display = "none";-->
<!-- }-->
<!-- };-->
<!-- </script>-->
</head>
<video autoplay loop muted playsinline id="myVideo" >
<source src="resources/Test1.webm" type="video/webm">
</video>
<body class="homebckmob">
<!--<div class = 'bcktopbarmob ShowOnMobile'></div>-->
<div class = 'bckfullmob1'></div>
<div class="bckborder porj">
<div class = 'ShowOnMobile'>
<!-- <img class="mobimg" src = 'resources/logo.png' alt = 'logo' ></img>-->
<!-- <h3 class ='page' style="left: 35px; color: rgba(255,255,255,0.45)">⊳ home</h3>-->
<a class="clickedhome" href="menumob.html" style="
text-align:center;
align-content: stretch;
color: rgba(255,215,0,0.51);
">
<i class="fa-solid fa-bars fa-2xl" ></i></a>
</div>
<div class = 'logo' style="display: none">
<!-- <h1 class = 'watermark'>SY</h1>-->
<img class='deskimg' src = 'resources/logo.png' alt = 'logo' ></img>
<h3 class ='page'>⊳ home</h3>
<h3 class ='buildupdate'>updated ━━</h3>
<h3 class ='build'>Dec 2024</h3>
<h3 class ='buildbottom'>━━━━━━━</h3>
<h2 class ='copyright'>© Shaaf Yousaf</h2>
</div>
<div class = 'sidenavbar HideOnMobile' style="mix-blend-mode: plus-lighter">
<h2 class = 'button selected'style="color: gold;">> home</h2>
<!-- <div class="clicked"><i class="fa-solid fa-house fa-2xl"
style="color: #ffffff;"></i></div>-->
<a class = 'button unselected' href = "projects.html" >projects</a>
<!-- <a class = 'button unselected' href = "artproj.html">art projects</a>-->
<a class = 'button unselected' href = "roots.html">roots</a>
</div>
<div class = 'flex_containeru'>
<img class="greetimg ShowOnMobile" src = 'resources/logo.png' alt = 'logo' ></img>
<img class="HideOnMobile" src = 'resources/logo.png' alt = 'logo' style="width: 100px"></img>
<h1 class="greet1" style="font-family: 'myfont2';color: #ffffff82;">welcome to shaaf's</h1>
<h1 class="greet2" style="mix-blend-mode: difference;">ePORTFOLIO</h1>
<!-- <h1 class="greet2"style="mix-blend-mode: difference">YOUSAF</h1>-->
<h1 class="greet1 HideOnMobile" style="mix-blend-mode: difference;margin-top: -10px;margin-bottom: -13px">a developer & storyteller</h1>
<!-- <h1 class="greet1 HideOnMobile" style="mix-blend-mode: difference;margin-top: -10px;margin-bottom: -13px">designer</h1>-->
<h1 class="greet1 ShowOnMobile" style="mix-blend-mode: difference;margin-top: -1vw;margin-bottom: -2vw">a developer & storyteller</h1>
<h1 id="const9" style="margin-left: 25px; color: rgba(211,211,211,0.43); text-transform: none">
& a junior at University of Toronto</h1>
<!-- <h1 id="const8" style="margin-left: 25px; color: white; text-transform: uppercase">-->
<!-- + Video & Graphics Producer</h1>-->
<div class="greetbottom" style="padding-top: 1%">
<div class="hyperroots">
<a class="me" href = "projects.html">explore my projects</a>
<!-- <i class="fa-solid fa-caret-left fa-fade fa-2xl icon" >-->
</i>
</div>
</div>
<!-- <h1 id='linemain' >━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ </h1>-->
<div class = 'greetlink'>
<a href="https://www.upwork.com/freelancers/~0199b5931b4df3a04a?mp_source=share"
class="link fa fa-upwork" target="_blank"></a>
<a href="https://www.linkedin.com/in/shaafyousaf/"
class="link fa fa-linkedin" target="_blank"></a>
<a href="https://github.com/ShaafPlayz"
class="link fa fa-github" target="_blank"></a>
</div>
</div>
</div>
</body>
</html>