Skip to content

Commit 0f3d53b

Browse files
committed
profile pages
1 parent 54a427a commit 0f3d53b

File tree

8 files changed

+227
-188
lines changed

8 files changed

+227
-188
lines changed

404.html

+137
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,137 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="manifest" href="manifest.json" />
6+
7+
<meta name="mobile-web-app-capable" content="yes" />
8+
<meta name="apple-mobile-web-app-capable" content="yes" />
9+
<meta name="application-name" content="Databased" />
10+
<meta name="apple-mobile-web-app-title" content="Databased" />
11+
<meta name="theme-color" content="#101010" />
12+
<meta name="msapplication-navbutton-color" content="#101010" />
13+
<meta
14+
name="apple-mobile-web-app-status-bar-style"
15+
content="black-translucent"
16+
/>
17+
<meta name="msapplication-starturl" content="/" />
18+
<meta
19+
name="viewport"
20+
content="width=device-width, initial-scale=1, shrink-to-fit=no"
21+
/>
22+
23+
<link
24+
rel="icon"
25+
type="image/png"
26+
sizes="192x192"
27+
href="img/icon-192x192.png"
28+
/>
29+
<link
30+
rel="apple-touch-icon"
31+
type="image/png"
32+
sizes="192x192"
33+
href="img/icon-192x192.png"
34+
/>
35+
<link
36+
rel="icon"
37+
type="image/png"
38+
sizes="256x256"
39+
href="img/icon-256x256.png"
40+
/>
41+
<link
42+
rel="apple-touch-icon"
43+
type="image/png"
44+
sizes="256x256"
45+
href="img/icon-256x256.png"
46+
/>
47+
<link
48+
rel="icon"
49+
type="image/png"
50+
sizes="384x384"
51+
href="img/icon-384x384.png"
52+
/>
53+
<link
54+
rel="apple-touch-icon"
55+
type="image/png"
56+
sizes="384x384"
57+
href="img/icon-384x384.png"
58+
/>
59+
<link
60+
rel="icon"
61+
type="image/png"
62+
sizes="512x512"
63+
href="img/icon-512x512.png"
64+
/>
65+
<link
66+
rel="apple-touch-icon"
67+
type="image/png"
68+
sizes="512x512"
69+
href="img/icon-512x512.png"
70+
/>
71+
72+
<title>Databased | IISc's Undergraduate CS Club</title>
73+
<link rel="stylesheet" href="css/common.css" />
74+
<link rel="stylesheet" href="css/profilePage.css" />
75+
<link rel="icon" href="./img/favicon-32x32.png" type="image/x-icon" />
76+
</head>
77+
78+
<body>
79+
<div id="loader"></div>
80+
<header>
81+
<nav>
82+
<div class="nav-box">
83+
<a href="#" class="headerLogo">
84+
<img src="img/Logo_transparent.png" />
85+
</a>
86+
87+
<a href="#about" class="nav-list-link">About</a>
88+
<a href="/learn" class="nav-list-link">Learn</a>
89+
<a href="#events" class="nav-list-link">Events</a>
90+
<a href="#blogs" class="nav-list-link">Blog</a>
91+
<a href="#contact" class="nav-list-link">Contact</a>
92+
93+
<a id="nav-hamburger" data-state="inactive">
94+
<span></span><span></span><span></span>
95+
<p>&times;</p>
96+
</a>
97+
</div>
98+
</nav>
99+
100+
<div id="mobileMenu">
101+
<a href="#about">About</a>
102+
<a href="/learn">Learn</a>
103+
<a href="#events">Events</a>
104+
<a href="#blogs">Blog</a>
105+
<a href="#contact">Contact</a>
106+
</div>
107+
</header>
108+
<main>
109+
<div id="person-details">
110+
<div id="profile-photo"></div>
111+
112+
<div id="profile-name"></div>
113+
<div id="profile-bio"></div>
114+
<div id="profile-links">
115+
<a href="" id="profile-email" target="_blank"
116+
>
117+
<span class="material-symbols-outlined">
118+
mail
119+
</span>
120+
</a>
121+
<a href="" id="profile-linkedin" target="_blank"
122+
><img src="img/social/linkedin.png"
123+
/></a>
124+
<a href="" id="profile-github" target="_blank"
125+
><img src="img/social/github.png"
126+
/></a>
127+
</div>
128+
</div>
129+
</main>
130+
131+
<footer>
132+
<img src="img/Logo_transparent.png" />
133+
</footer>
134+
<script src="js/common.js"></script>
135+
<script src="js/404handler.js"></script>
136+
</body>
137+
</html>

css/profilePage.css

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
body{
2+
background: linear-gradient(#180834 0,
3+
#26032c)!important;
4+
}
5+
main{
6+
min-height: calc(100vh - 100px);
7+
text-align: center;
8+
}
9+
footer{
10+
margin: 0;
11+
}
12+
#profile-photo{
13+
display: block;
14+
margin: 100px auto 25px auto;
15+
width: 200px;
16+
height: 200px;
17+
border-radius: 100%;
18+
background-size: cover;
19+
background-position: center;
20+
}
21+
#profile-name{
22+
font-size: 2.5rem;
23+
font-weight: 600;
24+
font-family: 'Montserrat', sans-serif;
25+
margin-bottom: 20px;
26+
}
27+
#profile-bio{
28+
font-size: 18px;
29+
max-width: 600px;
30+
margin: 0 auto;
31+
}
32+
#profile-links{
33+
margin: 20px 0;
34+
}
35+
#profile-links a{
36+
text-decoration: none;
37+
margin: 0 5px;
38+
}
39+
#profile-links a img{
40+
width: 36px;
41+
height: 36px;
42+
}
43+
#profile-links a span{
44+
vertical-align: top;
45+
background-color: #FFC107;
46+
color: #000;
47+
font-size: 26px;
48+
border-radius: 100%;
49+
padding: 5px;
50+
}

css/profiles.css

-56
This file was deleted.

index.html

+8-8
Original file line numberDiff line numberDiff line change
@@ -174,25 +174,25 @@
174174
referrerpolicy="no-referrer-when-downgrade"
175175
></iframe>
176176
<div id="contactDetails">
177-
<a class="email" href="mailto:">
177+
<a class="email" href="mailto:[email protected]">
178178
<span class="material-symbols-outlined"> mail </span>
179-
<span>email@databased</span>
179+
<span>[email protected]</span>
180180
</a>
181-
<a class="phone" href="tel:">
181+
<a class="phone" href="tel:+918825063816">
182182
<span class="material-symbols-outlined"> call </span>
183-
<span>+91 1234567890</span>
183+
<span>+91 88250 63816</span>
184184
</a>
185185
<div class="socials">
186-
<a href="#" class="facebook"
186+
<a href="#" class="facebook" target="_blank"
187187
><img src="img/social/facebook.png"
188188
/></a>
189-
<a href="#" class="instagram"
189+
<a href="#" class="instagram" target="_blank"
190190
><img src="img/social/instagram.png"
191191
/></a>
192-
<a href="#" class="linkedin"
192+
<a href="#" class="linkedin" target="_blank"
193193
><img src="img/social/linkedin.png"
194194
/></a>
195-
<a href="#" class="github"><img src="img/social/github.png" /></a>
195+
<a href="#" target="_blank" class="github"><img src="img/social/github.png" /></a>
196196
</div>
197197
</div>
198198
</div>

js/404handler.js

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
if (document.location.href.indexOf("/member/") > -1)
2+
{
3+
var username = document.location.href.split("/member/")[1].split("/")[0];
4+
username = "sirjanhansda";
5+
fetch(`https://api.airtable.com/v0/appHwUzo4ARCQQlwr/Profiles?filterByFormula=username='${username}'`, {
6+
method: "GET",
7+
headers: {
8+
Accept: "application/json",
9+
"Content-Type": "application/json",
10+
Authorization: `Bearer pat2bEq3dsaXHSBH9.2edd33a7b1c2de8fd5e4fe14b82900cf807d2c9b56dfead6a8bdd48715826409`,
11+
},
12+
})
13+
.then((response) => response.json())
14+
.then((data) => {
15+
if(data.records.length > 0){
16+
if(data.records[0].fields.Photo){
17+
var photo = data.records[0].fields.Photo[0].url;
18+
}
19+
else{
20+
var photo = "img/user.png";
21+
}
22+
bio = data.records[0].fields.Bio ? data.records[0].fields.Bio : "";
23+
document.querySelector("#profile-photo").style.backgroundImage = `url(${photo})`;
24+
document.querySelector("#profile-name").innerHTML = data.records[0].fields.Name;
25+
document.querySelector("#profile-bio").innerHTML = bio;
26+
document.querySelector("#profile-email").href = "mailto:" + data.records[0].fields.Email;
27+
document.querySelector("#profile-linkedin").href = data.records[0].fields.LinkedIn;
28+
document.querySelector("#profile-github").href = data.records[0].fields.GitHub;
29+
unload();
30+
}
31+
});
32+
}

js/index.js

-1
Original file line numberDiff line numberDiff line change
@@ -132,7 +132,6 @@ function loadBlogs({ feed }) {
132132

133133
if(entry.media$thumbnail){
134134
var thumbSrc = entry.media$thumbnail.url;
135-
console.log(thumbSrc);
136135
thumbSrc = thumbSrc.split("/s72-")[0] + "/s600-c/" + thumbSrc.split("/s72-")[1].split('/')[1];
137136
}
138137
else{

js/profile.js

-47
This file was deleted.

0 commit comments

Comments
 (0)