Mobile site fixup :)
pipeline / build-and-push-images (push) Successful in 10m54s

This commit is contained in:
2025-06-10 16:46:51 +02:00
parent 86a8ea9b97
commit e726de5a30
2 changed files with 58 additions and 14 deletions
+12 -12
View File
@@ -31,33 +31,33 @@
<!-- Links -->
<div id="links-div">
<a href="/blog" style="grid-column: 1;">
<img src="/assets/fluent-mdl2_blog.svg" style="width: 150px; height: 150px;"/>
<p style="text-align: center;">Blog</p>
<img src="/assets/fluent-mdl2_blog.svg" class="link-image"/>
<p class="link-text">Blog</p>
</a>
<a href="https://github.com/vhaudiquet/" style="grid-column: 2;">
<img src="/assets/github-mark.png" style="width: 150px; height: 150px;"/>
<p style="text-align: center;">GitHub</p>
<img src="/assets/github-mark.png" class="link-image"/>
<p class="link-text">GitHub</p>
</a>
<a href="https://git.vhaudiquet.fr/vhaudiquet/" style="grid-column: 3;">
<img src="/assets/logo_black.svg" style="width: 150px; height: 150px;"/>
<p style="text-align: center;">Gitea</p>
<img src="/assets/logo_black.svg" class="link-image"/>
<p class="link-text">Gitea</p>
</a>
<a href="mailto:valentin.haudiquet@ens-rennes.fr">
<img src="/assets/arobase.svg" style="width: 150px; height: 150px;"/>
<p style="text-align: center;">Mail</p>
<img src="/assets/arobase.svg" class="link-image"/>
<p class="link-text">Mail</p>
</a>
<a href="/cv/">
<img src="/assets/icon-park-solid_people.svg" style="width: 150px; height: 150px;"/>
<p style="text-align: center;">CV</p>
<img src="/assets/icon-park-solid_people.svg" class="link-image"/>
<p class="link-text">CV</p>
</a>
<a href="/about/">
<img src="/assets/mdi_about.svg" style="width: 150px; height: 150px;"/>
<p style="text-align: center;">About</p>
<img src="/assets/mdi_about.svg" class="link-image"/>
<p class="link-text">About</p>
</a>
</div>
+45 -1
View File
@@ -97,6 +97,14 @@ a:active {
color: grey;
}
.link-image {
width: 150px;
height: 150px;
}
.link-text {
text-align: center;
}
strong {
font-family: 'Inter', sans-serif;
font-style: normal;
@@ -123,7 +131,7 @@ strong {
}
@media only screen and (max-width: 1000px) {
/* Mobile version */
/* Tablet, small screens version */
#header-img {
align-self: center;
}
@@ -156,3 +164,39 @@ strong {
margin-top: 100px;
}
}
@media only screen and (max-width: 450px) {
/* Mobile version */
#header-img {
width: 80%;
height: auto;
}
#header-div {
margin-top: 30px;
}
h1 {
font-size: 50px;
}
h2 {
font-size: 30px;
}
h4 {
font-size: 30px;
}
p {
font-size: 20px;
}
#header-paragraph {
font-size: 26px;
}
#links-div {
margin-top: 40px;
}
.link-image {
width: 70px;
height: 70px;
}
}