feat: make icons clickable and fix: alignment

This commit is contained in:
jabuxas 2024-10-10 16:00:00 -03:00
parent 3b2f718dc3
commit 7a4d7d2e05

View File

@ -61,12 +61,18 @@
text-decoration: none; text-decoration: none;
color: #d4d4d4; color: #d4d4d4;
font-weight: bolder; font-weight: bolder;
display: flex;
align-items: center;
} }
.icon { .icon {
font-family: "JetBrainsMono Nerd Font"; font-family: "JetBrainsMono Nerd Font";
} }
.icon:before {
margin-right: 20px;
}
.mail-icon:before { .mail-icon:before {
content: "\f42f"; content: "\f42f";
font-size: 2em; font-size: 2em;
@ -114,24 +120,19 @@
</div> </div>
<div class="bottom-level"> <div class="bottom-level">
<div class="link-item"> <div class="link-item">
<span class="mail-icon icon"></span> <a class="mail-icon icon" href="mailto:jabuxas@proton.me">my contact email</a>
<a href="mailto:jabuxas@proton.me">my contact email</a>
</div> </div>
<div class="link-item"> <div class="link-item">
<span class="github-icon icon"></span> <a class="github-icon icon" href="https://github.com/jabuxas" target="_blank">my github</a>
<a href="https://github.com/jabuxas" target="_blank">my github</a>
</div> </div>
<div class="link-item"> <div class="link-item">
<span class="gitea-icon icon"></span> <a class="gitea-icon icon" href="https://git.jabuxas.xyz/jabuxas" target="_blank">my gitea</a>
<a href="https://git.jabuxas.xyz/jabuxas" target="_blank">my gitea</a>
</div> </div>
<div class="link-item"> <div class="link-item">
<span class="blog-icon icon"></span> <a class="blog-icon icon" href="https://blog.jabuxas.xyz" target="_blank">my blog</a>
<a href="https://blog.jabuxas.xyz" target="_blank">my blog</a>
</div> </div>
<div class="link-item"> <div class="link-item">
<span class="paste-icon icon"></span> <a class="paste-icon icon" href="https://paste.jabuxas.xyz" target="_blank">my paste</a>
<a href="https://paste.jabuxas.xyz" target="_blank">my paste</a>
</div> </div>
</div> </div>
</div> </div>