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

This commit is contained in:
2026-04-29 15:01:59 +09:00
parent 37f6c38caa
commit a3acd9320a
14 changed files with 390 additions and 73 deletions

View File

@@ -1,23 +1,105 @@
<template>
<aside class="left-sidebar hidden w-[287px] lg:block">
<div class="left-sidebar__block py-3 pl-0 pr-3">
<p class="left-sidebar__eyebrow text-xs font-semibold uppercase text-muted">
Categories
</p>
<nav class="left-sidebar__nav mt-4 grid gap-2 text-sm">
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/dev">
DEV
<aside class="left-sidebar site-sidebar hidden w-[287px] lg:flex lg:flex-col">
<div class="left-sidebar__scroll min-h-0 flex-1 overflow-y-auto">
<div class="left-sidebar__block site-sidebar-section py-3 pl-0 pr-3">
<nav class="left-sidebar__nav grid gap-1 text-[15px]">
<NuxtLink class="left-sidebar__nav-link flex items-center justify-between py-2 pl-3" to="/">
<span>Home pages</span>
<span></span>
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link py-2 pl-3" to="/tags/note">
Tags
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link py-2 pl-3" to="/pages/about">
Authors
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link py-2 pl-3" to="/posts/hello-sori-studio">
Style
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link flex items-center justify-between py-2 pl-3" to="/posts/custom-writing-tool">
<span>Post types</span>
<span></span>
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link flex items-center justify-between py-2 pl-3" to="/pages/contact">
<span>Members</span>
<span></span>
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link py-2 pl-3" to="/pages/projects">
Landing pages
</NuxtLink>
</nav>
</div>
<div class="left-sidebar__block site-sidebar-section py-5 pl-0 pr-3">
<div class="left-sidebar__section-title flex items-center justify-between text-xs font-semibold uppercase site-muted">
<span>Categories</span>
<span></span>
</div>
<div class="left-sidebar__category-grid mt-4 grid grid-cols-2 gap-x-6 gap-y-4 text-sm">
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/books">
<span class="h-4 w-1 rounded-full bg-orange-500" /> Books
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/business">
<span class="h-4 w-1 rounded-full bg-indigo-500" /> Business
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/dev">
<span class="h-4 w-1 rounded-full bg-cyan-500" /> Tech
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/science">
<span class="h-4 w-1 rounded-full bg-teal-400" /> Science
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/design">
<span class="h-4 w-1 rounded-full bg-fuchsia-500" /> Design
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/music">
<span class="h-4 w-1 rounded-full bg-pink-500" /> Music
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/health">
<span class="h-4 w-1 rounded-full bg-green-500" /> Health
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/play">
<span class="h-4 w-1 rounded-full bg-violet-500" /> Gaming
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/travel">
<span class="h-4 w-1 rounded-full bg-purple-500" /> Travel
</NuxtLink>
<NuxtLink class="left-sidebar__category flex items-center gap-3" to="/tags/diy">
<span class="h-4 w-1 rounded-full bg-yellow-400" /> DIY
</NuxtLink>
</div>
</div>
<div class="left-sidebar__block site-sidebar-section py-5 pl-0 pr-3">
<div class="left-sidebar__section-title flex items-center justify-between text-xs font-semibold uppercase site-muted">
<span>Authors</span>
<span></span>
</div>
<div class="left-sidebar__authors mt-4 grid gap-4 text-sm">
<div class="left-sidebar__author flex items-center gap-3">
<span class="h-8 w-8 rounded-full bg-[#e7c49d]" />
<span><strong class="block">sori</strong><span class="site-soft">Editor</span></span>
</div>
<div class="left-sidebar__author flex items-center gap-3">
<span class="h-8 w-8 rounded-full bg-[#98b7d5]" />
<span><strong class="block">zenn</strong><span class="site-soft">Writer</span></span>
</div>
</div>
</div>
</div>
<footer class="left-sidebar__footer flex items-center justify-between px-1 py-4 text-xs">
<nav class="left-sidebar__footer-nav flex gap-4">
<NuxtLink to="/pages/links">
Portal
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/note">
NOTE
<NuxtLink to="/pages/about">
Docs
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/review">
REVIEW
</NuxtLink>
<NuxtLink class="left-sidebar__nav-link hover:text-muted" to="/tags/play">
PLAY
<NuxtLink to="/pages/projects">
Projects
</NuxtLink>
</nav>
</div>
<span class="left-sidebar__theme-dot"></span>
</footer>
</aside>
</template>