add socials

This commit is contained in:
Emile Clark-Boman 2026-02-04 01:23:13 +10:00
parent 17cb6a537c
commit f132b754a5
3 changed files with 90 additions and 2 deletions

View file

@ -8,7 +8,7 @@ main {
}
#bg-canvas {
display:block;
display: block;
position: fixed;
inset: 0;
@ -44,3 +44,22 @@ main {
font-family: monospace;
font-size: 1.5em
}
socials-list {
display: flex;
flex-direction: column;
/* justify-content: start; */
align-content: centerr;
align-items: start;
gap: 1ch;
}
socials-item {
}
.icon-social {
height: 2ch;
}

View file

@ -22,6 +22,9 @@ Variables:
--theme-bg: var(--palette-rose-pine-base);
--theme-text: var(--palette-rose-pine-text);
--theme-icon: var(--palette-rose-pine-pine);
--theme-icon-off: var(--palette-rose-pine-foam);
--theme-tty-border: var(--palette-rose-pine-rose);
--theme-tty-prompt: var(--palette-rose-pine-foam);
--theme-tty-command: var(--palette-rose-pine-iris);

View file

@ -73,7 +73,73 @@
<div class="centered-container">
<div class="centered cryframe" style="display: flex; flex-direction: row; gap: 20px;">
<img src="baked/avatar.png" loading="eager" height="150">
<p>hi!! i'm cry (they/them)</p>
<div>
<p>hi!! i'm cry (they/them)</p>
<div class="socials-list">
<!-- <div class="socials-item"> -->
<!-- REF: https://dashboardicons.com/icons/forgejo -->
<!-- <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" id="Layer_1" x="0" y="0" version="1.1" viewBox="38.5 0.5 135 211" class="icon-social"> -->
<!-- <style> -->
<!-- .stroke { -->
<!-- fill: none; -->
<!-- stroke: var(--theme-icon); -->
<!-- stroke-width: 15; -->
<!-- } -->
<!-- .stroke-off { -->
<!-- fill: none; -->
<!-- stroke: var(--theme-icon-off); -->
<!-- stroke-width: 15; -->
<!-- } -->
<!-- </style> -->
<!-- <g transform="translate(6 6)"> -->
<!-- <path class="stroke-off" style="stroke-width: 25" d="M58 168V70c0-27.6 22.4-50 50-50h20"/> -->
<!-- <path class="stroke" style="stroke-width: 25" d="M58 168v-30c0-27.6 22.4-50 50-50h20"/> -->
<!-- <circle class="stroke-off" cx="142" cy="20" r="18"/> -->
<!-- <circle class="stroke" cx="142" cy="88" r="18"/> -->
<!-- <circle class="stroke" cx="58" cy="180" r="18"/> -->
<!-- </g> -->
<!-- </svg> -->
<!-- </div> -->
<div class="socials-item">
<!-- REF: https://dashboardicons.com/icons/bluesky -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 30.56 512 450.84" class="icon-social">
<path style="fill: var(--theme-icon)" d="M111 60.9c58.7 44.1 121.8 133.4 145 181.4 23.2-47.9 86.3-137.3 145-181.4 42.4-31.8 111-56.4 111 21.9 0 15.6-9 131.3-14.2 150.1-18.3 65.3-84.9 82-144.1 71.9 103.5 17.6 129.9 76 73 134.4-108 110.9-155.3-27.8-167.4-63.4-2.2-6.5-3.3-9.6-3.3-7 0-2.6-1.1.5-3.3 7-12.1 35.5-59.4 174.2-167.4 63.4-56.9-58.4-30.5-116.8 73-134.4-59.2 10.1-125.8-6.5-144.1-71.8C9 214.2 0 98.5 0 82.8 0 4.5 68.6 29.1 111 60.9"/>
</svg>
<span>
Bluesky <a href="https://bsky.app/profile/dobutterfliescry.bsky.social" rel="author">@dobutterfliescry.bsky.social</a>
</span>
</div>
<div class="socials-item">
<!-- REF: https://dashboardicons.com/icons/discord -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0.02 57.8 511.92 396.3" class="icon-social">
<path style="fill: var(--theme-icon)" d="M433.7 91a416.5 416.5 0 0 0-105.6-33.2c-4.6 8.2-9.9 19.3-13.5 28.1-39.4-5.9-78.4-5.9-117.1 0-3.7-8.8-9.1-19.9-13.7-28.1-37.1 6.4-72.6 17.7-105.7 33.3-66.8 101-85 199.5-75.9 296.6 44.3 33.1 87.3 53.2 129.6 66.4 10.4-14.4 19.7-29.6 27.7-45.7-15.3-5.8-29.9-13-43.7-21.3 3.7-2.7 7.2-5.6 10.7-8.5 84.2 39.4 175.8 39.4 259 0 3.5 2.9 7.1 5.8 10.7 8.5-13.9 8.3-28.5 15.5-43.8 21.3 8 16 17.3 31.3 27.7 45.7 42.3-13.2 85.3-33.3 129.6-66.4 10.8-112.5-18-210.1-76-296.7M170.9 328c-25.3 0-46-23.6-46-52.4s20.3-52.4 46-52.4 46.5 23.6 46 52.4c.1 28.8-20.2 52.4-46 52.4m170.2 0c-25.3 0-46-23.6-46-52.4s20.3-52.4 46-52.4 46.5 23.6 46 52.4c0 28.8-20.3 52.4-46 52.4"/>
</svg>
<span>
Discord <a href="https://discordapp.com/users/320442794969792513" rel="author">@_cry64</a>
</span>
</div>
<div class="socials-item">
<!-- REF: https://dashboardicons.com/icons/github -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 512 512" class="icon-social">
<path style="fill-rule: evenodd; clip-rule: evenodd; fill: var(--theme-icon)" d="M256 6.3C114.6 6.3 0 120.9 0 262.3c0 113.3 73.3 209 175 242.9 12.8 2.2 17.6-5.4 17.6-12.2 0-6.1-.3-26.2-.3-47.7-64.3 11.8-81-15.7-86.1-30.1-2.9-7.4-15.4-30.1-26.2-36.2-9-4.8-21.8-16.6-.3-17 20.2-.3 34.6 18.6 39.4 26.2 23 38.7 59.8 27.8 74.6 21.1 2.2-16.6 9-27.8 16.3-34.2-57-6.4-116.5-28.5-116.5-126.4 0-27.8 9.9-50.9 26.2-68.8-2.6-6.4-11.5-32.6 2.6-67.8 0 0 21.4-6.7 70.4 26.2 20.5-5.8 42.2-8.6 64-8.6s43.5 2.9 64 8.6c49-33.3 70.4-26.2 70.4-26.2 14.1 35.2 5.1 61.4 2.6 67.8 16.3 17.9 26.2 40.6 26.2 68.8 0 98.2-59.8 120-116.8 126.4 9.3 8 17.3 23.4 17.3 47.4 0 34.2-.3 61.8-.3 70.4 0 6.7 4.8 14.7 17.6 12.2C438.7 471.3 512 375.3 512 262.3c0-141.4-114.6-256-256-256"/>
</svg>
<span>
Github <a href="https://github.com/emilelcb" rel="author">@emilelcb</a>
</span>
</div>
</div>
</div>
</div>
</div>
</main>