satr14/5th-site-expanded
1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

new styles for buttom items

Browse source
This commit is contained in:
Satria 2026-03-19 11:00:57 +07:00
commit 499317ac09
2 changed files with 18 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/lib/index.ts
View file

@ -189,9 +189,7 @@ export default {
links: { links: {
"git": "https://git.satr14.my.id", "git": "https://git.satr14.my.id",
"fetch.sh": "https://fetch.satr14.my.id", "fetch.sh": "https://fetch.satr14.my.id",
"flake.nix": "https://git.satr14.my.id/satr14/nix-flake", "flake.nix": "https://flake.satr14.my.id",
"is-a.dev": "https://is-a.dev/",
"part-of.my.id": "https://part-of.my.id/",
}, },
communities: { communities: {
"part-of.my.id": { "part-of.my.id": {

35
src/routes/+page.svelte
View file

@ -99,27 +99,26 @@
<span class="bg-ctp-surface0 text-ctp-text px-2 py-1 rounded-full no-underline text-xs sm:text-sm">{skill}</span> <span class="bg-ctp-surface0 text-ctp-text px-2 py-1 rounded-full no-underline text-xs sm:text-sm">{skill}</span>
{/each} {/each}
</p> </p>
<p class="flex flex-wrap gap-1"> <div class="flex flex-row gap-1">
{#each Object.entries(data.links) as [title, url], i} {#each Object.entries(data.links) as [title, url]}
{#if i > 0}<span class="text-ctp-subtext1">~</span>{/if} <a href={url} target="_blank" class="flex items-center justify-between rounded-lg px-2 py-1 hover:bg-ctp-surface0 text-sm">
<a href={url} target="_blank">{title}</a> {title}
<span class="text-ctp-overlay1 text-xs">↗</span>
</a>
{/each} {/each}
</p> </div>
</article> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-2 py-4">
<!-- hate optimizing images ;-; --> {#each Object.entries(data.communities) as [name, details]}
<section class="flex flex-wrap gap-4 px-4 pb-4"> <a href={details.url} target="_blank" class="flex items-center gap-3 rounded-lg p-2 hover:bg-ctp-surface0">
{#each Object.entries(data.communities) as [name,details], i} <img src={details.icon} alt={name} class="size-9 rounded-lg" />
<div class="inline-block">
<div class="flex gap-2">
<img src={details.icon} alt={name} class="size-12 rounded-lg">
<div> <div>
<h2 class="text-base m-0"><a href={details.url}>{name}</a></h2> <span class="text-sm block leading-tight text-ctp-text font-bold">{name}</span>
<span>{details.role}</span> <span class="text-xs text-ctp-subtext0">{details.role}</span>
</div> </div>
</div> </a>
</div> {/each}
{/each} </div>
</section> </article>
</main> </main>
</div> </div>
</div> </div>