v1.0.0: 구조 클래스 중복 스타일 최종 정리

Made-with: Cursor
This commit is contained in:
2026-04-17 14:47:54 +09:00
parent 1e095798e3
commit bdb84ddd09
6 changed files with 11 additions and 32 deletions

View File

@@ -239,29 +239,8 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
object-fit: contain;
}
.menu-groups {
display: block;
}
.menu-groups__list {
display: flex;
flex-direction: column;
}
.menu-group {
border-bottom: 0;
}
.menu-group--nav {
gap: 0;
}
.menu-group__trigger,
.menu-group__link {
display: flex;
align-items: center;
width: 100%;
padding: 6px 0;
border: 0;
border-radius: 18px;
background: none;
@@ -685,7 +664,6 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
min-width: 0;
}
.topbar__sidebar-toggle {
display: inline-flex;
align-items: center;

File diff suppressed because one or more lines are too long

View File

@@ -4,6 +4,7 @@
- `package.json` 버전을 `1.0.0`으로 증가.
- `partials/site/topbar.hbs`: `topbar__inner` 구조 클래스를 복구하고 `topbar__brand`, `topbar__search`, `topbar__actions` 구간의 중복 Tailwind 유틸(`flex`, `h-full`, `items-center`, `justify-end` 등)을 정리해 구조 클래스와 유틸 충돌을 최소화.
- `partials/site/sidebar-right.hbs`: 추천 fallback 목록 컨테이너의 `rounded-theme`를 제거해 주변 섹션과 모서리 스타일을 통일.
- `partials/site/sidebar-left.hbs`, `assets/built/screen.css`: `menu-groups` 구간에서 `display/gap/border-bottom` 단순 구조 속성을 Tailwind 유틸(`block`, `gap-0`, `border-b-0`)로 이동하고 중복 CSS 선언을 제거.
- `docs/spec.md`, `docs/map.md`, `docs/deploy.md`, `docs/history.md` 버전을 `v1.0.0`으로 동기화.
- `npm run build:tailwind``assets/built/tailwind.css` 재생성.

View File

@@ -1,10 +1,10 @@
{{#if recommendations}}
<ul class="flex flex-col gap-1 rounded-theme overflow-hidden" data-recommendations="">
<ul class="flex flex-col gap-1 overflow-hidden" data-recommendations="">
{{#each recommendations as |rec|}}
<li>
<a class="py-1 text-[0.8rem] leading-tight flex items-center gap-2 hover:opacity-75" href="{{rec.url}}" data-recommendation="{{rec.id}}" target="_blank" rel="noopener">
{{#if rec.favicon}}
<img class="w-[18px] h-[18px] rounded-[8px] aspect-square object-cover" src="{{rec.favicon}}" alt="" loading="lazy" onerror="this.style.display='none'">
<img class="w-[18px] h-[18px] rounded-[4px] aspect-square object-cover" src="{{rec.favicon}}" alt="" loading="lazy" onerror="this.style.display='none'">
{{/if}}
<h3 class="font-medium line-clamp-1 text-ellipsis overflow-hidden" title="{{rec.title}}">{{rec.title}}</h3>
</a>

View File

@@ -1,7 +1,7 @@
<aside class="sidebar sidebar--left h-full flex flex-col">
<nav class="menu-groups border-b border-brd pl-4 pr-3 sm:pl-5 xl:pl-0 py-3" data-nav="menu" data-primary-nav x-data="{ homePagesOpen: true, secondaryNavOpen: false, membersOpen: false }">
<nav class="menu-groups block border-b border-brd pl-4 pr-3 sm:pl-5 xl:pl-0 py-3" data-nav="menu" data-primary-nav x-data="{ homePagesOpen: true, secondaryNavOpen: false, membersOpen: false }">
<ul class="menu-groups__list flex flex-col gap-0.75 text-typ text-sm">
<li class="menu-group menu-group--nav nav-toggle is-mainitem flex items-center flex-wrap w-full relative group" :class="{ 'is-open': homePagesOpen }" data-label="Home pages" data-slug="home-pages" data-length="10" aria-haspopup="true">
<li class="menu-group menu-group--nav border-b-0 gap-0 nav-toggle is-mainitem flex items-center flex-wrap w-full relative group" :class="{ 'is-open': homePagesOpen }" data-label="Home pages" data-slug="home-pages" data-length="10" aria-haspopup="true">
<a class="menu-group__link menu-group__link--toggle flex gap-2 items-center flex-1 py-1.5 rounded-theme transition-[padding]" href="#" role="button" @click.prevent="homePagesOpen = !homePagesOpen" :aria-expanded="homePagesOpen.toString()" aria-haspopup="true">
<span class="menu-link__marker w-1 h-4 rounded-sm rounded-l-none transition-all"></span>
<span class="menu-link__label">Home pages</span>
@@ -18,7 +18,7 @@
</li>
{{#if @site.secondary_navigation}}
<li class="menu-group menu-group--nav nav-toggle is-mainitem flex items-center flex-wrap w-full relative group menu-group--secondary-nav" :class="{ 'is-open': secondaryNavOpen }" data-label="More links" data-slug="secondary-nav" aria-haspopup="true">
<li class="menu-group menu-group--nav border-b-0 gap-0 nav-toggle is-mainitem flex items-center flex-wrap w-full relative group menu-group--secondary-nav" :class="{ 'is-open': secondaryNavOpen }" data-label="More links" data-slug="secondary-nav" aria-haspopup="true">
<a class="menu-group__link menu-group__link--toggle flex gap-2 items-center flex-1 py-1.5 rounded-theme transition-[padding]" href="#" role="button" @click.prevent="secondaryNavOpen = !secondaryNavOpen" :aria-expanded="secondaryNavOpen.toString()" aria-haspopup="true">
<span class="menu-link__marker w-1 h-4 rounded-sm rounded-l-none transition-all"></span>
<span class="menu-link__label">More links</span>
@@ -35,7 +35,7 @@
</li>
{{/if}}
<li class="menu-group menu-group--nav menu-group--link flex items-center flex-wrap w-full relative group" data-label="Tags" data-slug="tags" data-length="4">
<li class="menu-group menu-group--nav menu-group--link border-b-0 gap-0 flex items-center flex-wrap w-full relative group" data-label="Tags" data-slug="tags" data-length="4">
<a class="menu-group__link flex gap-2 items-center flex-1 py-1.5 rounded-theme transition-[padding]" href="/tags/">
<span class="menu-link__marker w-1 h-4 rounded-sm rounded-l-none transition-all"></span>
<span class="menu-link__label">Tags</span>

View File

@@ -1,6 +1,6 @@
<header class="topbar border-b border-brd bg-bgr/95 supports-[backdrop-filter]:bg-bgr/80">
<div class="topbar__inner">
<div class="topbar__brand">
<div class="topbar__brand flex h-full items-center gap-3 px-4 lg:px-0">
<button class="topbar__sidebar-toggle group" type="button" data-left-sidebar-toggle aria-expanded="true" aria-label="Toggle left sidebar">
<span class="topbar__sidebar-toggle-icon topbar__sidebar-toggle-icon--open">
<i class="icon icon-layout-sidebar size-6 stroke-2" role="presentation">
@@ -31,7 +31,7 @@
{{/if}}
</a>
</div>
<div class="topbar-search topbar__search">
<div class="topbar-search topbar__search flex h-full min-w-0 items-center justify-center px-4">
<button class="search-trigger flex w-full min-w-0 max-w-xs items-center gap-2.5 rounded-xl border border-brd bg-bgr px-3.5 py-2 text-sm text-typ-tone transition-colors hover:bg-bgr-tone hover:text-typ" type="button" data-search-open aria-label="Open search">
<i class="icon icon-search shrink-0 size-5 md:size-4 stroke-2 md:stroke-[2.25] fill-bgr-tone [&amp;&gt;svg]:fill-inherit" role="presentation">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-search" width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
@@ -44,7 +44,7 @@
<span class="search-shortcut shrink-0">/</span>
</button>
</div>
<div class="topbar__actions relative">
<div class="topbar__actions relative flex h-full items-center justify-end gap-2 px-4 lg:px-0">
<button class="w-8 h-8 cursor-pointer icon-button--user-menu inline-flex items-center justify-center rounded-theme overflow-hidden {{#unless @member}}bg-bgr hover:bg-bgr-tone{{/unless}}" type="button" aria-label="Open user menu" data-user-menu-toggle>
{{#if @member}}
<figure class="relative w-8 h-8 pointer-events-none" data-member-avatar-figure>