adjusted socials icons sizes

This commit is contained in:
liyunze 2024-06-10 14:50:56 +08:00
parent 3fed2a7203
commit 0b13b82462

View file

@ -307,18 +307,24 @@ import Layout from "../layouts/Layout.astro";
fill="#fff"></path> fill="#fff"></path>
</svg> </svg>
</div> </div>
<div
class="relative w-12 h-12 bg-white rounded-full
border-8 border-solid border-black z-20"
>
<div <div
id="github-icon" id="github-icon"
class="icon-box w-12 h-12 bg-white rounded-full flex justify-center items-center" class="icon-box w-12 h-12 rounded-full 2-10
absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"
> >
<svg <svg
width="42px" width="38px"
height="42px" height="38px"
viewBox="0 0 48 48" viewBox="0 0 48 48"
fill="none" fill="none"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
><g id="SVGRepo_bgCarrier" stroke-width="0" ><g
></g><g id="SVGRepo_bgCarrier"
stroke-width="0"></g><g
id="SVGRepo_tracerCarrier" id="SVGRepo_tracerCarrier"
stroke-linecap="round" stroke-linecap="round"
stroke-linejoin="round"></g><g stroke-linejoin="round"></g><g
@ -342,6 +348,7 @@ import Layout from "../layouts/Layout.astro";
</g></svg </g></svg
> >
</div> </div>
</div>
<div> <div>
<h2 class="font-bold text-xl">Github</h2> <h2 class="font-bold text-xl">Github</h2>
<p class="text-[#ccc]">liyunze-coding</p> <p class="text-[#ccc]">liyunze-coding</p>
@ -385,8 +392,8 @@ import Layout from "../layouts/Layout.astro";
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px" x="0px"
y="0px" y="0px"
width="32px" width="28px"
height="32px" height="28px"
viewBox="0 0 31.665 31.665" viewBox="0 0 31.665 31.665"
fill="#fff" fill="#fff"
style="0 0 31.665 31.665;" style="0 0 31.665 31.665;"
@ -516,8 +523,7 @@ import Layout from "../layouts/Layout.astro";
<img <img
src="/images/socials/kofi_s_logo_nolabel.webp" src="/images/socials/kofi_s_logo_nolabel.webp"
alt="ko-fi logo" alt="ko-fi logo"
class="w-8 h-8" width="28"
width="32"
/> />
</div> </div>
<div> <div>
@ -609,10 +615,13 @@ import Layout from "../layouts/Layout.astro";
fill="#fff"></path> fill="#fff"></path>
</svg> </svg>
</div> </div>
<div id="twitter-icon" class="icon-box"> <div
id="twitter-icon"
class="icon-box bg-[#2daae1] rounded-full w-12 h-12 flex justify-center items-center"
>
<svg <svg
width="48px" width="38px"
height="48px" height="38px"
viewBox="126.444 2.281 589 589" viewBox="126.444 2.281 589 589"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
fill="#000000" fill="#000000"
@ -664,13 +673,18 @@ import Layout from "../layouts/Layout.astro";
fill="#fff"></path> fill="#fff"></path>
</svg> </svg>
</div> </div>
<div id="threads-icon" class="icon-box w-12 h-12"> <div
id="threads-icon"
class="icon-box w-12 h-12
flex justify-center items-center
bg-black rounded-full"
>
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
aria-label="Threads" aria-label="Threads"
viewBox="0 0 192 192" viewBox="0 0 192 192"
width="32px" width="28px"
height="32px" height="28px"
fill="#fff" fill="#fff"
><path ><path
class="x19hqcy" class="x19hqcy"
@ -783,11 +797,15 @@ import Layout from "../layouts/Layout.astro";
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
} }
.icon-box::before { .icon-box::before {
content: ""; content: "";
z-index: 2; z-index: -2;
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;