neon443/neon443.github.io
1
0
Fork 0
mirror of https://github.com/neon443/neon443.github.io.git synced 2026-03-11 07:09:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

finally settled on a topbar design

Browse Source
This commit is contained in:
Nihaal Sharma
2023-06-04 14:04:08 +01:00
parent e4d2039a28
commit c3f545edc1
1 changed files with 19 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
style.css
View File

@@ -80,17 +80,33 @@
} }
.barItem h1 { .barItem h1 {
}
.barItem:hover {
flex: 1.5;
background-color: #eee;
} }
.barItem a:hover { .barItem a:hover {
background-color: #111; background-color: #111;
color: #eee; color: #eee;
animation-name: NAME;
animation-delay: 0.2s;
animation-duration: 4s;
animation-iteration-count: infinite;
-webkit-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
-moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25); box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
} }
.bar:has(a:hover) .barItem { .bar:has(a:hover) .barItem {
} }
@keyframes wiggleRainbow{
0% {background-color:red;}
25% {background-color:yellow;}
50% {background-color:blue;}
75% {background-color:green;}
100% {background-color:red;}
}
/* Bar styling*/ /* Bar styling*/
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
@@ -107,6 +123,9 @@
.barItem * { .barItem * {
color: #ddd; color: #ddd;
} }
.barItem:hover {
background-color: #555;
}
.barItem a:hover { .barItem a:hover {
background-color: #eee; background-color: #eee;
color: #111; color: #111;