Improve main page info div layout

This commit is contained in:
EnumDev 2025-03-27 22:03:21 +02:00
parent 6824a1d110
commit c3a2d58324
2 changed files with 22 additions and 10 deletions

View File

@ -26,7 +26,15 @@
animation: fadeIn 1s linear 1.25s forwards; animation: fadeIn 1s linear 1.25s forwards;
} }
.link img { #bio {
margin-bottom: 20px;
}
#socials {
margin-top: 20px;
}
.social-link img {
width: 32px; width: 32px;
height: 32px; height: 32px;
} }

View File

@ -18,14 +18,18 @@
<div id="main"> <div id="main">
<img id="pfp" src="assets/pfp.jpg" alt="Profile Picture"> <img id="pfp" src="assets/pfp.jpg" alt="Profile Picture">
<div id="info"> <div id="info">
<div id="bio">
<h1>EnumDev</h1> <h1>EnumDev</h1>
<span>Computer programmer and Linux enthusiast</span> <span>Computer programmer and Linux enthusiast</span>
<br><br> </div>
<a class="link" href="https://git.enumerated.dev/EnumDev"><img src="assets/socials/gitea-logo.png" alt="Gitea"></a> <hr>
<a class="link" href="https://gitlab.com/EnumDev"><img src="assets/socials/gitlab-logo.png" alt="Gitlab"></a> <div id="socials">
<a class="link" href="https://github.com/EnumuratedDev"><img src="assets/socials/github-logo.png" alt="Github"></a> <a class="social-link" href="https://git.enumerated.dev/EnumDev"><img src="assets/socials/gitea-logo.png" alt="Gitea"></a>
<a class="link" href="https://bsky.app/profile/enumerated.dev"><img src="assets/socials/bsky-logo.png" alt="BlueSky"></a> <a class="social-link" href="https://gitlab.com/EnumDev"><img src="assets/socials/gitlab-logo.png" alt="Gitlab"></a>
<a class="link" href="https://x.com/EnumDev_"><img src="assets/socials/x-logo.png" alt="X/Twitter"></a> <a class="social-link" href="https://github.com/EnumuratedDev"><img src="assets/socials/github-logo.png" alt="Github"></a>
<a class="social-link" href="https://bsky.app/profile/enumerated.dev"><img src="assets/socials/bsky-logo.png" alt="BlueSky"></a>
<a class="social-link" href="https://x.com/EnumDev_"><img src="assets/socials/x-logo.png" alt="X/Twitter"></a>
</div>
</div> </div>
</div> </div>
</body> </body>