Compare commits

..

2 Commits

Author SHA1 Message Date
Fred Boniface 1116ea9770 Nearly there 2022-10-28 21:02:01 +01:00
Fred Boniface ec45fe67a5 Almost there on the social icon front 2022-10-28 21:01:53 +01:00
2 changed files with 8 additions and 7 deletions

View File

@ -51,7 +51,7 @@
</div> </div>
<div id="sidebar_social"> <div id="sidebar_social">
<a href="https://500px.com/p/fredboniface" target="_blank" rel="noreferrer noopener"> <a href="https://500px.com/p/fredboniface" target="_blank" rel="noreferrer noopener">
<picture class="social_icon" > <picture>
<source media="(min-width: 399px)" srcset="/images/social-icons/500px_seek_114.jxl" type="image/jxl"> <source media="(min-width: 399px)" srcset="/images/social-icons/500px_seek_114.jxl" type="image/jxl">
<source media="(min-width: 399px)" srcset="/images/social-icons/500px_seek_114.webp" type="image/webp"> <source media="(min-width: 399px)" srcset="/images/social-icons/500px_seek_114.webp" type="image/webp">
<source srcset="/images/social-icons/500px_seek_58.jxl" type="image/jxl"> <source srcset="/images/social-icons/500px_seek_58.jxl" type="image/jxl">
@ -60,14 +60,14 @@
</picture> </picture>
</a> </a>
<a href="https://fb.me/fred.boniface" target="_blank" rel="noreferrer noopener"> <a href="https://fb.me/fred.boniface" target="_blank" rel="noreferrer noopener">
<picture class="social_icon" > <picture>
<source media="(min-width: 399px)" srcset="/images/social-icons/fb_blue_144.png" type="image/png"> <source media="(min-width: 399px)" srcset="/images/social-icons/fb_blue_144.png" type="image/png">
<source srcset="/images/social-icons/fb_blue_58.png" type="image/png"> <source srcset="/images/social-icons/fb_blue_58.png" type="image/png">
<img src="/images/social-icons/fb_blue_58.png" alt="Facebook Logo"> <img src="/images/social-icons/fb_blue_58.png" alt="Facebook Logo">
</picture> </picture>
</a> </a>
<a href="https://github.com/frdbonif" target="_blank" rel="noreferrer noopener"> <a href="https://github.com/frdbonif" target="_blank" rel="noreferrer noopener">
<picture class="social_icon" > <picture>
<source media="(min-width: 399px)" srcset="/images/social-icons/gh_white_120.png" type="image/png"> <source media="(min-width: 399px)" srcset="/images/social-icons/gh_white_120.png" type="image/png">
<source srcset="/images/social-icons/gh_white_64.png" type="image/png"> <source srcset="/images/social-icons/gh_white_64.png" type="image/png">
<img src="/images/social-icons/gh_white_64.png" alt="Github Logo"> <img src="/images/social-icons/gh_white_64.png" alt="Github Logo">

View File

@ -139,14 +139,15 @@ body {
} }
#sidebar_social { #sidebar_social {
position: absolute; position: absolute;
display: flex;
bottom: 50px; bottom: 50px;
width: 100%; width: 100%;
margin: auto; margin: auto;
text-align: center; justify-content: center;
} }
.social_icon img { #sidebar_social img {
max-width: 120px; width: 12vw;
width: 20%; max-width: 50px;
} }
@media screen and (min-height: 600px){#sidebar_social img{margin-bottom:40px}} @media screen and (min-height: 600px){#sidebar_social img{margin-bottom:40px}}
@media screen and (max-height: 310px){#sidebar_social{display:none}} @media screen and (max-height: 310px){#sidebar_social{display:none}}