Skip to content

Major changes in UI #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
aadityamishraa wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Major changes in UI #10

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 6 additions & 3 deletions CSS/social.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
.social {
margin-bottom: 2rem;
height: 90px;
width: 100%;
display: flex;
Expand All @@ -25,8 +26,8 @@
text-decoration: none;
margin: 18px 2px;
margin: 18px 1rem;
box-shadow: 6px 5px 3px 2px black;
box-shadow: -5px 1px 6px -1px rgb(90 90 90);
/* box-shadow: 6px 5px 3px 2px black; */

}

.fa-linkedin {
Expand All @@ -49,5 +50,7 @@
}

.fa:hover {
transform: translateY(-1rem);
transform: translateY(-.2rem);
transition: transform .2s ease-in;
box-shadow: -5px 1px 6px -1px rgb(90 90 90);
}
15 changes: 9 additions & 6 deletions CSS/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: sans-serif;
}

body {
Expand Down Expand Up @@ -46,15 +47,10 @@ h1.card {
text-align: center;
box-shadow: rgba(0, 0, 0, 0.1) 0 0 1px 2px, rgba(0, 0, 0, 0.2) 0 2px 5px 0;
}
.name {
font-family: sans-serif;
/* box-shadow: 10px 10px 91px 0px rgb(191, 193, 79); */

font-size: 37px;
padding-top: 20px;
}

.quote {
font-family:'Times New Roman', Times, serif;
font-size: 16px;
color: #999999;
font-weight: 50;
Expand Down Expand Up @@ -158,3 +154,10 @@ h1.card {
.type-cursor {
color: black;
}

.title {
font-weight: bold;
font-size: 37px;
padding-top: 20px;
margin-bottom: 1.5rem;
}
43 changes: 20 additions & 23 deletions CSS/timline.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,13 @@ body .edu {
height: 100%;
background: #f2f4f8;
}
.qual{
margin-top: 2rem;
margin-bottom: 3rem;
display: flex;
flex-direction: column;
align-items: center;
}
.gallery {
width: 100%;
height: 100px;
Expand All @@ -15,12 +22,13 @@ body .edu {
margin: 30px;
background: transparent;
}

.edu-card > .logo {
grid-area: logo;
}

.edu-details {
padding: 36px;
padding: 10px;
grid-area: details;
font-family: sans-serif;
}
Expand All @@ -34,19 +42,21 @@ body .edu {
.edu-card {
background: #fff;
display: grid;
width: 90%;
justify-content: center;
margin-bottom: 1.5rem;
width: 80%;
height: 160px;
text-align: left;
margin: 49px;
border-radius: 8px;
grid-template-areas: "logo details";
grid-template-columns: 166px 1fr;
box-shadow: 10px 10px 25px rgb(61, 61, 61);
box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
}

.edu-card:hover {
cursor: pointer;
animation: none;
animation: float 3s ease-in-out infinite;
animation: float 2s ease-in-out infinite;
}

.edu-card:hover ~ .edu {
Expand All @@ -72,20 +82,7 @@ body .edu {
line-height: 1.6;
}

@keyframes float {
0% {
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.6);
/* transform: translatey(0px); */
}
50% {
box-shadow: 0px 25px 15px rgba(0, 0, 0, 0.2);
transform: translatey(-20px);
}
100% {
box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.6);
/* transform: translatey(0px); */
}
}


.proj1 {
grid-area: proj1;
Expand Down Expand Up @@ -164,17 +161,17 @@ body .edu {

@keyframes float {
0% {
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.6);
transform: translatey(0px);
}
50% {
box-shadow: 0px 25px 15px rgba(0, 0, 0, 0.2);
transform: translatey(-10px);
transform: translatey(-6px);
}
100% {
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.6);
/* transform: translatey(0px); */
transform: translatey(0px);
}
}

.mywork span {
/* transform: translatey(0px); */
padding: 40px;
Expand Down
32 changes: 15 additions & 17 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,17 +26,15 @@
<div class="column items">
<h1 class="card" onclick="openTab('tab','about')">About</h1>
<h1 class="card" onclick="openTab('tab','edu')">Education<h1>
<h1 class="card" onclick="openTab('tab','mywork')">MY Work</h1>
<h1 class="card" onclick="openTab('tab','mywork')">My Work</h1>
<h1 class="card" onclick="openTab('tab','contact')">Contact</h1>
</div>

<div class="container">

<section class="column tab about">
<section class="column tab about">

<h1 class="name">Mohit Kumar

</h1>
<div class="title">Mohit Kumar</div>
<h1>
<a href="" class="subtitle typewriter typewrite" data-period="2000"
data-type='[ "A Developer", "A Tech Enthusiast","A Free Soul" ]'>
Expand All @@ -57,17 +55,17 @@ <h4 class="profile_heading">Profile Info</h4>
<div>
<div class="person">
<div>
<h6>Name </h6>
<h6>Birthday </h6>
<h6>Country </h6>
<h6>City </h6>
<h6 align="right" style="line-height:30px;">Name<br>
Birthday<br>
Country<br>
City </h6>
</div>

<div>
<h6>: Mohit Kumar</h6>
<h6>: 1Jan 2001</h6>
<h6>: India</h6>
<h6>: Ambala</h6>
<h6 style="line-height:30px;"> &nbsp;: Mohit Kumar<br>
&nbsp;: 1Jan 2001<br>
&nbsp;: India<br>
&nbsp;: Ambala</h6>


</div>
Expand All @@ -94,8 +92,8 @@ <h4 class="profile_heading">Contact Info</h4>
<!-- ==================================================================================== -->

<section class="column tab edu hide">
<div class="heading">Education</div>
<quote class="subtitle">"The ultimate purpose of education is to learn how to find and see the
<div class="title">Education</div>
<quote class="quote">"The ultimate purpose of education is to learn how to find and see<br> the
beauty of creation so that you may feel the joy of life."</quote>
<div class="qual">
<div class="edu-card">
Expand Down Expand Up @@ -147,8 +145,8 @@ <h1 class="sub"> 10th Board | CBSE | 10 CGPA


<div class="project-head">
<h1 class="proj-title">Projects that I worked on and working
</h1>
<div class="title">Projects that I worked on and working
</div>
<h1 class="proj-sub">CRAZY FULL STACK DEVELOPER WHO WANT TO EXPLORE EVERY TECH STACK

</h1>
Expand Down