zenn/sori.studio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

공개 화면 테마와 패널 구조 보정

Browse Source
This commit is contained in:
zenn
2026-04-29 15:01:59 +09:00
parent 37f6c38caa
commit a3acd9320a
14 changed files with 390 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
pages/index.vue
View File

@@ -20,16 +20,59 @@ const posts = [
<template>
<MainColumn>
<section class="home-hero site-section">
<div class="home-hero__inner site-section-header">
<p class="home-hero__eyebrow text-xs font-semibold uppercase text-muted">
Personal Blog / CMS
</p>
<h1 class="home-hero__title mt-3 text-5xl font-semibold leading-tight tracking-normal">
sori.studio
<div class="home-hero__inner site-section-header text-center">
<h1 class="home-hero__title mx-auto max-w-[620px] text-3xl font-semibold leading-tight tracking-normal md:text-[28px]">
Ideas <em>published</em> for meaningful conversation, discussed and shaped by the community
</h1>
<p class="home-hero__description mt-4 max-w-xl text-base leading-7 text-muted">
<p class="home-hero__description mx-auto mt-3 max-w-[500px] text-base leading-7 site-muted">
글을 쌓고, 프로젝트와 링크를 연결하고, 오래 쓰기 좋은 개인 블로그를 직접 구축합니다.
</p>
<form class="home-hero__subscribe mx-auto mt-5 flex max-w-[345px] gap-2">
<input class="home-hero__input min-w-0 flex-1 rounded-lg px-3 py-2 text-sm site-input" placeholder="Your email">
<button class="home-hero__button rounded-lg px-5 py-2 text-sm font-semibold site-button" type="button">
Subscribe
</button>
</form>
</div>
</section>
<section class="home-featured site-section">
<div class="home-featured__header site-section-body flex items-center justify-between">
<h2 class="home-featured__title text-sm font-semibold uppercase site-muted">
Featured
</h2>
<div class="home-featured__controls flex gap-4">
<span>‹</span>
<span>›</span>
</div>
</div>
<div class="home-featured__items grid grid-cols-1 gap-4 px-6 pb-6 md:grid-cols-3">
<article class="home-featured__card h-[146px] rounded-lg bg-[linear-gradient(135deg,#071b22,#0f827c)] p-4 text-white">
<h3 class="mt-20 text-sm font-semibold leading-tight">
Essential tools and techniques for getting started
</h3>
</article>
<article class="home-featured__card h-[146px] rounded-lg bg-[linear-gradient(135deg,#182434,#d4b06b)] p-4 text-white">
<h3 class="mt-20 text-sm font-semibold leading-tight">
Setting up your first home server from scratch
</h3>
</article>
<article class="home-featured__card h-[146px] rounded-lg bg-[linear-gradient(135deg,#141414,#8a5a44)] p-4 text-white">
<h3 class="mt-20 text-sm font-semibold leading-tight">
Writing notes that stay useful over time
</h3>
</article>
</div>
</section>
<section class="home-latest site-section">
<div class="home-latest__header site-section-body flex items-center justify-between">
<h2 class="home-latest__title text-sm font-semibold uppercase site-muted">
Latest
</h2>
<button class="home-latest__view rounded-lg px-3 py-2 text-sm site-input" type="button">
목록
</button>
</div>
</section>