hnasheralneam/profile-site
1
0
Fork 0
mirror of https://github.com/hnasheralneam/hnasheralneam.github.io.git synced 2024-11-07 16:15:54 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update styles.css

Browse source
This commit is contained in:
Squirrel-314 2020-12-02 13:02:52 -05:00
parent 20f3339a8f
commit b769a38f56
1 changed files with 48 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
styles.css
View file

@ -156,6 +156,44 @@ Other
} }
} }
@keyframes rainbow-glow {
0% {
box-shadow: none;
}
50% {
box-shadow: 2px 2px 1px red,
4px 4px 1px orange,
6px 6px 1px yellow,
8px 8px 1px lightgreen,
10px 10px 1px lightblue,
12px 12px 1px purple,
2px -2px 1px red,
4px -4px 1px orange,
6px -6px 1px yellow,
8px -8px 1px lightgreen,
10px -10px 1px lightblue,
12px -12px 1px purple,
-2px 2px 1px red,
-4px 4px 1px orange,
-6px 6px 1px yellow,
-8px 8px 1px lightgreen,
-10px 10px 1px lightblue,
-12px 12px 1px purple,
-2px -2px 1px red,
-4px -4px 1px orange,
-6px -6px 1px yellow,
-8px -8px 1px lightgreen,
-10px -10px 1px lightblue,
-12px -12px 1px purple;
}
100% {
box-shadow: none;
}
}
/*================================================== /*==================================================
Display Images Display Images
==================================================*/ ==================================================*/
@ -166,9 +204,14 @@ Display Images
bottom: 30px; bottom: 30px;
right: 60px; right: 60px;
border-radius: 50%; border-radius: 50%;
transition: all .8s;
animation: darkness-grows 3s infinite; animation: darkness-grows 3s infinite;
} }
.display-image-dark:hover {
transform: rotateX(360deg);
}
.display-image-light { .display-image-light {
width: 150px; width: 150px;
height: 150px; height: 150px;
@ -176,9 +219,14 @@ Display Images
bottom: 30px; bottom: 30px;
right: 60px; right: 60px;
border-radius: 50%; border-radius: 50%;
transition: all .8s;
animation: heavenly-glow 3s infinite; animation: heavenly-glow 3s infinite;
} }
.display-image-light:hover {
transform: rotateY(360deg);
}
#schoolarly-bay img:nth-child(2) { #schoolarly-bay img:nth-child(2) {
bottom: 20%; bottom: 20%;
left: 20%; left: 20%;