Cyper/CyBySide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Added navbar home link + color fades
All checks were successful
Deploy Blog to Folder / deploy (push) Successful in 3s
Details

Browse Source
This commit is contained in:
Cyper
2025-07-27 21:59:02 -04:00
parent beb83a9849
commit 4cffc3ff0d
2 changed files with 20 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
public/css/style.css
View File

@ -86,7 +86,7 @@ footer {
.nav .hamburger ion-icon {
margin-top: 0.15rem;
}
.nav-logo > img {
.nav-logo img {
width: 64px;
height: 64px;
}
@ -114,6 +114,7 @@ footer {
}
.nav-hyperlinks a {
display: flex;
flex-direction: row-reverse; /* row-reverse so `:hover ~ ion-icon` works */
align-items: center;
align-content: center;
text-decoration: none;
@ -122,10 +123,13 @@ footer {
.nav-hyperlinks ion-icon,
.mobile-nav-header ion-icon {
color: rgba(var(--black), .52);
transition: color 0.25s ease-in-out,
background-color 0.25s ease-in-out;
}
.nav-hyperlinks a:hover,
.nav-hyperlinks ion-icon:hover,
.mobile-nav-header ion-icon:hover {
.mobile-nav-header ion-icon:hover,
.nav-hyperlinks a span:hover ~ ion-icon {
color: rgba(var(--black), .86);
}
.nav-hyperlinks ion-icon {
@ -296,12 +300,18 @@ footer ul li:last-child {
}
.footer-socials > a > ion-icon {
color: rgba(var(--lightblue), .86);
background-color: rgba(var(--brown), .86);
background-color: rgba(var(--brown), .52);
border-radius: 100%;
border: var(--borders);
box-sizing: content-box;
padding: 0.5rem;
margin: 0 0.5rem;
transition: color 0.25s ease-in-out,
background-color 0.25s ease-in-out;
}
.footer-socials > a > ion-icon:hover {
background-color: rgba(var(--brown), .86);
}
.footer-socials > a:first-child > ion-icon {
margin-left: 0;