Skip to content

Commit 9572755

Browse files
committed
2 parents 2300550 + 38fcaae commit 9572755

File tree

2 files changed

+135
-9
lines changed

2 files changed

+135
-9
lines changed

app/public/stylesheets/profile.css

Lines changed: 99 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,21 +3,19 @@
33
position: relative;
44
margin-top: 150px;
55
width: 100%;
6-
height: 250px;
6+
height: auto;
77
padding: 10px;
88
}
99
#backimg{
1010
width: 100%;
1111
background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRgaC3PsrguhP9iYj1qy9whdD1ZXnmnz-jycqD807LhIeb1Py6G");
12-
height: 200px;
13-
/* background-repeat: no-repeat; */
14-
/* background-size: cover; */
12+
height: 300px;
1513
border-radius: 10px;
1614
}
17-
img{
15+
#profileimg img{
1816
position: absolute;
19-
bottom: 0%;
20-
/* margin-top: 20px; */
17+
bottom: -5%;
18+
margin-top: 20px;
2119
margin-left: 10px;
2220
width: 200px;
2321
height: 200px;
@@ -29,6 +27,99 @@ img{
2927
padding-left: 250px;
3028
}
3129
#text1 span{
32-
3330
margin-left: 50px;
31+
}
32+
.sidenav{
33+
margin-top: 50px;
34+
width: 320px;
35+
border-radius: 10px;
36+
height: 500px;
37+
background-color: rgba(154, 152, 149, 0.119);
38+
text-align: center;
39+
}
40+
#main{
41+
display: flex;
42+
margin: 10px;
43+
}
44+
.sidenav div{
45+
width: 100%;
46+
}
47+
.sidenav #name{
48+
margin-bottom: 10px;
49+
font-size: 50px;
50+
}
51+
.sidenav #uniname{
52+
font-size: 40px;
53+
border-bottom:2px dashed black;
54+
color: #4329A6
55+
}
56+
.sidenav #uni{
57+
margin-top: 10px;
58+
font-size: 20px;
59+
}
60+
.sidenav #addrs{
61+
font-size: 15px;
62+
color: #876CEF;
63+
}
64+
.sidenav #skills{
65+
margin-top: 20px;
66+
font-size: 40px;
67+
color: #4329A6;
68+
border-bottom: 2px dashed black;
69+
}
70+
#skillist{
71+
display: flex;
72+
}
73+
74+
#skill1{
75+
margin: 5px;
76+
font-size: 20px;
77+
width: fit-content;
78+
border-radius: 5px;
79+
height: 25px;
80+
background-color: #876CEF;
81+
color: white;
82+
83+
}
84+
#skill2{
85+
margin: 5px;
86+
font-size: 20px;
87+
width: fit-content;
88+
border-radius: 5px;
89+
height: 25px;
90+
background-color: #876CEF;
91+
color: white;
92+
}
93+
#skill3{
94+
margin: 5px;
95+
font-size: 20px;
96+
width: fit-content;
97+
border-radius: 5px;
98+
height: 25px;
99+
background-color: #876CEF;
100+
color: white;
101+
}
102+
.about{
103+
width: 80%;
104+
margin: 10px;
105+
margin-top: 50px;
106+
border-radius: 20px;
107+
height: auto;
108+
background-color: rgba(192, 190, 190, 0.317);
109+
}
110+
.about .ele{
111+
width: 100%;
112+
height: 150px;
113+
}
114+
.headings1{
115+
font-size: 30px;
116+
margin-left: 10px;
117+
margin-top: 10px;
118+
border-bottom: 3px dashed black;
119+
}
120+
121+
.description{
122+
margin-left: 10px;
123+
margin-top: 10px;
124+
34125
}

app/views/profile.ejs

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,42 @@
4040
<span>Transactions</span>
4141
</div>
4242
</div>
43-
<div class="sidenav"></div>
43+
<div id="main">
44+
<div class="sidenav">
45+
<div id="name">Ranit Pal</div>
46+
<div id="uniname">University</div>
47+
<div id="uni">Lovely Professional University</div>
48+
<div id="addrs">Jalandhar,Punjab</div>
49+
<div id="skills">Skills</div>
50+
<div id="skillist">
51+
<div id="skill1">C++</div>
52+
<div id="skill2">Java</div>
53+
<div id="skill3">JavaScript</div>
54+
</div>
55+
</div>
56+
<div class="about">
57+
<div class="ele">
58+
<div class="headings1">BIOGRAPHY</div>
59+
<div class="description">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reiciendis tenetur enim numquam totam fugiat, ipsum ipsam odit corrupti mollitia eos.</div>
60+
</div>
61+
<div class="ele">
62+
<div class="headings1">PROJECTS</div>
63+
<div class="description">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reiciendis tenetur enim numquam totam fugiat, ipsum ipsam odit corrupti mollitia eos.</div>
64+
</div>
65+
<div class="ele">
66+
<div class="headings1">HACKATHONS</div>
67+
<div class="description">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reiciendis tenetur enim numquam totam fugiat, ipsum ipsam odit corrupti mollitia eos.</div>
68+
</div>
69+
<div class="ele">
70+
<div class="headings1">WORK EXPERIANCES</div>
71+
<div class="description">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reiciendis tenetur enim numquam totam fugiat, ipsum ipsam odit corrupti mollitia eos.</div>
72+
</div>
73+
<div class="ele">
74+
<div class="headings1">EDUCATIONS</div>
75+
<div class="description">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Reiciendis tenetur enim numquam totam fugiat, ipsum ipsam odit corrupti mollitia eos.</div>
76+
</div>
77+
</div>
78+
</div>
4479

4580

4681

0 commit comments

Comments
 (0)