mirror of
https://github.com/hnasheralneam/hnasheralneam.github.io.git
synced 2024-11-07 08:05:54 -05:00
hi
This commit is contained in:
parent
9e760ee6ac
commit
4294a35202
2 changed files with 72 additions and 14 deletions
23
index.html
23
index.html
|
@ -2,6 +2,8 @@
|
|||
<html lang="en" dir="ltr">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css">
|
||||
<script src="main.js" charset="utf-8"></script>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<title>Meet Squirrel</title>
|
||||
</head>
|
||||
|
@ -56,9 +58,24 @@
|
|||
<p>You can find the GitHub repository <a href="https://github.com/Squirrel-314/style">here</a>.</p>
|
||||
</div>
|
||||
<div id="personal">
|
||||
<p>Email | <a href="mailto:thehillsidetownship@gmail.com?subject=feedback">thehillsidetownship@gmail.com</a></p>
|
||||
<p>Adress | Oak forest, acorn path, that tree.</p>
|
||||
<p>Hillside Township | <a href="https://hillside-township.github.io/">https://hillside-township.github.io</a></p>
|
||||
<p>You won't find me at</p><br>
|
||||
<hr>
|
||||
<div class="find-me">
|
||||
<a href="javascript:void"><i class="fab fa-twitch"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-dribbble"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-squarespace"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-linkedin-in"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-facebook-f"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-twitter"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-youtube"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-instagram"></i></a>
|
||||
<a href="javascript:void"><i class="fab fa-medium"></i></a>
|
||||
</div>
|
||||
<hr>
|
||||
<i class="fab fa-linux"></i>
|
||||
<p>Email | <a href="mailto:thehillsidetownship@gmail.com?subject=feedback">thehillsidetownship@gmail.com</a></p><br>
|
||||
<p>Adress | Oak forest, acorn path, that tree.</p><br>
|
||||
<p>Hillside Township | <a href="https://hillside-township.github.io/">https://hillside-township.github.io</a></p><br>
|
||||
<img title="I like rainbows" id="linux-rainbow" src="Images/linux.png" alt="">
|
||||
</div>
|
||||
</body>
|
||||
|
|
63
styles.css
63
styles.css
|
@ -97,16 +97,14 @@ Main Sectors
|
|||
}
|
||||
|
||||
#personal {
|
||||
height: 100vh;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
background-color: whitesmoke;
|
||||
position: relative;
|
||||
overflow: scroll;
|
||||
scroll-snap-align: start;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
/*==================================================
|
||||
|
@ -223,20 +221,20 @@ Display Images
|
|||
}
|
||||
|
||||
#schoolarly-bay img:nth-child(2) {
|
||||
bottom: 20%;
|
||||
left: 20%;
|
||||
bottom: 25%;
|
||||
left: 5%;
|
||||
width: 175px;
|
||||
height: 175px;
|
||||
}
|
||||
|
||||
#schoolarly-bay img:nth-child(3) {
|
||||
bottom: 20%;
|
||||
left: 20%;
|
||||
right: 10%;
|
||||
}
|
||||
|
||||
#schoolarly-bay img:nth-child(4) {
|
||||
bottom: 20%;
|
||||
left: 20%;
|
||||
bottom: 10%;
|
||||
left: 25%;
|
||||
width: 125px;
|
||||
height: 125px;
|
||||
}
|
||||
|
@ -245,10 +243,53 @@ Display Images
|
|||
End Section
|
||||
==================================================*/
|
||||
|
||||
.find-me {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
flex-wrap: wrap;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.find-me a {
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
background-color: #f1f1f1;
|
||||
margin: 10px;
|
||||
border-radius: 30%;
|
||||
color: #10ac84;
|
||||
box-shadow: 0 5px 15px -5px #00000070;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
i {
|
||||
line-height: 90px;
|
||||
font-size: 25px;
|
||||
transition: all 0.2s;
|
||||
margin-top: 35%;
|
||||
}
|
||||
|
||||
.find-me a:hover i {
|
||||
transform: scale(1.5);
|
||||
color: whitesmoke;
|
||||
}
|
||||
|
||||
.find-me a:hover {
|
||||
background-color: #262626;
|
||||
}
|
||||
|
||||
#linux-rainbow {
|
||||
size: auto;
|
||||
max-width: 80%;
|
||||
max-width: 60%;
|
||||
max-height: 60%;
|
||||
border-radius: 50px;
|
||||
animation: rainbow-glow 5s infinite;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue