Merge pull request 'Feat/foundation company colors' (#12) from feat/foundation-company-colors into main
Deploy Storybook / deploy (push) Successful in 1m23s
Deploy Storybook / deploy (push) Successful in 1m23s
Reviewed-on: #12
This commit was merged in pull request #12.
This commit is contained in:
shkim4 committed
commit
228944a06b
6 files changed
+1470
-26
No files matched your search
@@ -25,7 +25,7 @@ const preview: Preview = {
|
||||
includeNames: true,
|
||||
order: [
|
||||
"Foundation",
|
||||
["Color", "Typography", "Layout"],
|
||||
["Color", "Company Colors", "Typography", "Layout"],
|
||||
"Components",
|
||||
[
|
||||
"Form",
|
||||
|
||||
@@ -6,16 +6,16 @@ This is a classification record. No Story IDs, exports or titles are renamed. HI
|
||||
|
||||
## Summary
|
||||
|
||||
- PRIMARY: 65
|
||||
- VERIFICATION: 212
|
||||
- UTILITY: 15
|
||||
- PRIMARY: 82
|
||||
- VERIFICATION: 252
|
||||
- UTILITY: 38
|
||||
- LEGACY / DUPLICATE: 0
|
||||
- KEEP: 65
|
||||
- HIDE: 227
|
||||
- MERGE_CANDIDATE: 31
|
||||
- KEEP: 82
|
||||
- HIDE: 290
|
||||
- MERGE_CANDIDATE: 33
|
||||
- DELETE_CANDIDATE: 0
|
||||
- Story files: 63
|
||||
- Stories: 292
|
||||
- Story files: 82
|
||||
- Stories: 372
|
||||
- Hierarchy: Foundation → Components → Patterns → Center Graphic → Theme
|
||||
|
||||
## Full inventory
|
||||
@@ -43,7 +43,7 @@ Source: `src/center/center-information.stories.tsx`; meta.tags: []
|
||||
|
||||
Source: `src/center/center-overview.stories.tsx`; meta.tags: []
|
||||
|
||||
- Overview — Overview; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- Overview — Overview; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### Center Graphic/Spatial
|
||||
|
||||
@@ -325,7 +325,7 @@ Source: `src/components/progress.stories.tsx`; meta.tags: []
|
||||
|
||||
Source: `src/components/publisher-regression.stories.tsx`; meta.tags: ["verification"]
|
||||
|
||||
- ConsumersRegression — Consumers Regression; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- ConsumersRegression — Consumers Regression; tags: ["verification","play-fn"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### Components/Form/Radio Group
|
||||
|
||||
@@ -445,6 +445,7 @@ Source: `src/components/table.stories.tsx`; meta.tags: []
|
||||
Source: `src/components/tabs.stories.tsx`; meta.tags: []
|
||||
|
||||
- All — Tabs; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- DefaultApi — Default API; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- Secondary — Secondary; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- SelectedFirst — Selected First; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- SelectedLast — Selected Last; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
@@ -504,6 +505,12 @@ Source: `src/foundation/color.stories.tsx`; meta.tags: []
|
||||
|
||||
- All — Color; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### Foundation/Company Colors
|
||||
|
||||
Source: `src/foundation/company-colors.stories.tsx`; meta.tags: []
|
||||
|
||||
- All — Company Colors; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### Foundation/Layout
|
||||
|
||||
Source: `src/foundation/layout.stories.tsx`; meta.tags: []
|
||||
@@ -516,6 +523,73 @@ Source: `src/foundation/typography.stories.tsx`; meta.tags: []
|
||||
|
||||
- All — Typography; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### OrgChart/Components/Cards
|
||||
|
||||
Source: `src/org-chart/org-chart-cards.stories.tsx`; meta.tags: ["internal"]
|
||||
|
||||
- BusinessManagement — Business Management; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- BusinessPlanning — Business Planning; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- TalentGrowth — Talent Growth; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- IntegratedSystem — Integrated System; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- DesignPlanning — Design Planning; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- SolutionSales — Solution Sales; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- TopLeader — 최상위 리더; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- OrganizationLeader — 조직장; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- Employee — 일반 직원; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### OrgChart/Department Colors
|
||||
|
||||
Source: `src/org-chart/org-chart-department-colors.stories.tsx`; meta.tags: []
|
||||
|
||||
- DepartmentColors — Department Colors; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### OrgChart/Expanded OrgChart
|
||||
|
||||
Source: `src/org-chart/org-chart-expanded.stories.tsx`; meta.tags: []
|
||||
|
||||
- ExpandedOrgChart — Expanded OrgChart; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### OrgChart/Full Composition
|
||||
|
||||
Source: `src/org-chart/org-chart-full-composition.stories.tsx`; meta.tags: []
|
||||
|
||||
- FullComposition — Full Composition; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### OrgChart/Verification/Overview
|
||||
|
||||
Source: `src/org-chart/org-chart-overview-internal.stories.tsx`; meta.tags: ["internal"]
|
||||
|
||||
- Logo — Logo; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- PositionSummary — Position Summary; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- AffiliationSummary — Affiliation Summary; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### OrgChart/Overview
|
||||
|
||||
Source: `src/org-chart/org-chart-p1.stories.tsx`; meta.tags: []
|
||||
|
||||
- LogoPersonnelSummary — Overview; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### OrgChart/Components/Summaries
|
||||
|
||||
Source: `src/org-chart/org-chart-summary.stories.tsx`; meta.tags: ["internal"]
|
||||
|
||||
- PositionSummary — Position Summary; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- AffiliationSummary — Affiliation Summary; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- StatusSummary — Status Summary; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### OrgChart/Content
|
||||
|
||||
Source: `src/org-chart/org-chart.stories.tsx`; meta.tags: ["internal"]
|
||||
|
||||
- BasicOrganization — Basic Organization; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- OrganizationHierarchy — Organization Hierarchy; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- EmployeeCards — Employee Cards; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- OrganizationSummary — Organization Summary; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- JSONDataUpdate — JSON Data Update; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- LoadingEmptyError — Loading / Empty / Error; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- ResponsiveContainer — Responsive Container; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- MultipleInstances — Multiple Instances; tags: ["internal"]; UTILITY; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### Patterns/Layout/Dashboard
|
||||
|
||||
Source: `src/patterns/dashboard-layout.stories.tsx`; meta.tags: []
|
||||
@@ -543,6 +617,7 @@ Source: `src/patterns/data-table.stories.tsx`; meta.tags: []
|
||||
Source: `src/patterns/filter-bar.stories.tsx`; meta.tags: []
|
||||
|
||||
- All — Filter Bar; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- DraftApplied — Draft / Applied; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### Patterns/Layout/GNB
|
||||
|
||||
@@ -605,6 +680,106 @@ Source: `src/patterns/page-header.stories.tsx`; meta.tags: []
|
||||
|
||||
- All — Page Header; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### SW/Footer
|
||||
|
||||
Source: `src/sw/sw-footer.stories.tsx`; meta.tags: []
|
||||
|
||||
- FullFooter — SW Footer; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- ToolGroups — 도구 그룹별 표시; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- FigmaVariants — Figma 디자인별 Variant (35 노드); tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- CustomContent — 도구 및 메뉴 변경 예제; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- Responsive — Responsive More; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- Parts — 개별 부품 (조합용); tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Header
|
||||
|
||||
Source: `src/sw/sw-header-dropdown.stories.tsx`; meta.tags: []
|
||||
|
||||
- ComposedControls — Dropdown; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Header
|
||||
|
||||
Source: `src/sw/sw-header-home-menu.stories.tsx`; meta.tags: []
|
||||
|
||||
- HomeMenu — Home Menu; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- HomeMenuCaptureDefault — Home Menu · 비교 캔버스 · Default; tags: ["!autodocs","verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuHeaderComposition — Home Menu · Header 조합 · 로고 클릭; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuDynamicData — Home Menu · Props · 데이터 변경; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuStandalone — Home Menu · 단독 사용 · 조합형; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuPropertyBarCheck — Home Menu · 속성Bar 비교 (26:10492); tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuCapturePropertyBar — Home Menu · 비교 캔버스 · 속성Bar; tags: ["!autodocs","verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuIntegration — Home Menu · 통합 · Popup · Escape; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HomeMenuCaptureResponsive — Home Menu · 비교 캔버스 · 반응형; tags: ["!autodocs","verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Header
|
||||
|
||||
Source: `src/sw/sw-header-open.stories.tsx`; meta.tags: []
|
||||
|
||||
- DocumentOpen — Document Open; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- HiddenSubControls — Hidden Sub Controls; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Header
|
||||
|
||||
Source: `src/sw/sw-header.stories.tsx`; meta.tags: []
|
||||
|
||||
- DetailButtons — Detail Buttons (Shared States); tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- Overview — SW Header; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- InteractiveStates — Interactive States; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- WindowMoveMotion — Window Move Motion; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- LogoSlot — Logo; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- DocumentDropdown — Document Dropdown; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- ResponsiveMore — Responsive More; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- KGuide — K Guide; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Popup
|
||||
|
||||
Source: `src/sw/sw-popup.stories.tsx`; meta.tags: []
|
||||
|
||||
- CustomContent — Custom Content; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- MultiplePopups — Multiple Popups; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Step Header
|
||||
|
||||
Source: `src/sw/sw-process-header.stories.tsx`; meta.tags: []
|
||||
|
||||
- ProcessHeader — Step Header; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- Responsive — Responsive More; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- SplitOpen — 화면 분할; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- MultiStep — Multi Step; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- FixedWidths — Fixed Widths; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- ProcessBar — Process Bar; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- MultiStepManyGroups — Multi Step · Many Groups; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- MultiStepManySteps — Multi Step · Many Steps; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- States — States; tags: ["verification"]; VERIFICATION; HIDE; MERGE_CANDIDATE. Representative board may cover the same specimen; keep direct QA until behavioral equivalence is reviewed.
|
||||
- ThemeOverride — Theme Override; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Popup
|
||||
|
||||
Source: `src/sw/sw-property-panel.stories.tsx`; meta.tags: []
|
||||
|
||||
- PropertyPanelCompare — Property Panel; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
|
||||
### SW/Theme
|
||||
|
||||
Source: `src/sw/sw-theme.stories.tsx`; meta.tags: []
|
||||
|
||||
- ThemeInheritance — Theme Inheritance; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### SW/Viewer
|
||||
|
||||
Source: `src/sw/sw-viewer.stories.tsx`; meta.tags: []
|
||||
|
||||
- ViewerHeader — Viewer Header; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- MenuGroups — Menu Groups; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- States — Item States; tags: ["verification"]; VERIFICATION; HIDE; MERGE_CANDIDATE. Representative board may cover the same specimen; keep direct QA until behavioral equivalence is reviewed.
|
||||
- Dropdowns — Header + Dropdown; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- SettingsPanel — Settings Popup; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- ContentVariants — Settings Popup; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- VariableSize — Variable Size Popups; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
- Logo — Logo; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- Responsive — Responsive More; tags: []; PRIMARY; KEEP. Representative story or distinct reference page.
|
||||
- CompareWithSWHeader — SWHeader vs Viewer Header; tags: ["verification"]; VERIFICATION; HIDE. Keep direct URL and tag-filter access; excluded from default sidebar.
|
||||
|
||||
### Theme/Designer Playground
|
||||
|
||||
Source: `src/theme/designer-theme.stories.tsx`; meta.tags: ["internal"]
|
||||
|
||||
+1251
-15
File diff suppressed because it is too large.
Load diff
@@ -36,3 +36,5 @@ Orange Dark 1·2의 원본 Needs Review 상태와 [이전 검수 보고서](../r
|
||||
페이지 소개는 `한맥 브랜드 컬러`로 표시한다. 그룹 설명의 단계 순서 나열 문구는 제공하지 않으며, 개별 컬러칩의 단계명과 HEX는 유지한다.
|
||||
|
||||
[Color 대표 Story](../../src/foundation/color.stories.tsx)는 한맥그린·한맥브라운·한맥오렌지 3개 그룹에 각 8개, 총 24개 컬러칩만 표시한다. Green 8/8·Brown 8/8·Orange 8/8 확정이며 단계명·현재 HEX와 Default 기본색 강조를 유지한다. 2026-10-11 최종 표시 요청에 따라 Brown Deep, Orange Light·Mid·Dark·Deep의 별도 표시, Accent·Semantic·Gradients 섹션과 개발용 Token·CSS Variable·Runtime Key 설명은 제거한다. Legacy Button 색상과 Accent·Semantic·Gradient의 실제 Key·값·소비처는 보존한다. 기존 Component mapping을 새 값에 연결하지 않으며 public Key·Property·type·Default·API·schemaVersion 1과 서비스 partial JSON 호환성을 유지한다. [Runtime Theme](runtime-theme.md)의 geometry/상태 권한과 Designer의 기존 17개 상위 역할 입력 UI는 확대하지 않는다. 한맥오렌지의 미확정 브랜드 단계는 없다. [표시 정리 검증 기록](../reports/foundation-color-display-cleanup-2026-10-11.md).
|
||||
|
||||
[Company Colors Story](../../src/foundation/company-colors.stories.tsx)는 Foundation > Color와 별도 메뉴(Color 바로 아래)이며 7개 계열사·14개 컬러를 회사별로 표시한다. 데이터는 OrgChart의 기존 `companyColorPresets`를 그대로 읽고(메인 → 서브 순서, 메인은 Default 강조 재사용) HEX를 중복 정의하지 않는다. Theme 토큰·`themes/*.json`·공개 계약은 변경하지 않으며 Foundation > Color의 3그룹 24칩은 그대로다.
|
||||
@@ -0,0 +1,28 @@
|
||||
import type { Meta, StoryObj } from "@storybook/react-vite"
|
||||
import { companyColorPresets } from "@hm-design/org-chart"
|
||||
import { ReferencePage, ReferenceSection } from "./reference"
|
||||
|
||||
// Company colors come from the existing OrgChart presets; HEX values are never duplicated here.
|
||||
// The chip markup and classes are shared with Foundation/Color (foundation.css).
|
||||
const companies = Object.values(companyColorPresets)
|
||||
|
||||
function CompanyColorChip({ label, hex, main }: { label: string; hex: string; main: boolean }) {
|
||||
return <article className="hm-brand-color-chip" data-company-color={hex} data-base={main ? "" : undefined}>
|
||||
<div className="hm-foundation-swatch" style={{ background: hex }} />
|
||||
<h3>{label}</h3><p data-color-value>{hex.toUpperCase()}</p>
|
||||
</article>
|
||||
}
|
||||
|
||||
function CompanyColorsPage() {
|
||||
return <ReferencePage title="Company Colors" intro="계열사 브랜드 컬러">
|
||||
{companies.map(company => <ReferenceSection key={company.companyId} title={company.companyName} note="">
|
||||
<div className="hm-brand-color-row" data-company-id={company.companyId}>
|
||||
<CompanyColorChip label="메인" hex={company.primary} main />
|
||||
{company.secondary.map((hex, index) => <CompanyColorChip key={hex} label={`서브 ${index + 1}`} hex={hex} main={false} />)}
|
||||
</div>
|
||||
</ReferenceSection>)}
|
||||
</ReferencePage>
|
||||
}
|
||||
const meta = { title: "Foundation/Company Colors", parameters: { layout: "fullscreen" } } satisfies Meta
|
||||
export default meta
|
||||
export const All: StoryObj<typeof meta> = { name: "Company Colors", render: () => <CompanyColorsPage /> }
|
||||
Vendored
+3
@@ -38,3 +38,6 @@
|
||||
/* New common background stop IDs stay on one line at the supported widths. */
|
||||
.hm-foundation .hm-color-gradient-stops .hm-brand-color-chip[data-gradient-stop-token] { flex-basis: 220px; }
|
||||
.hm-foundation .hm-color-foreground-sample { padding: 16px; background: var(--hm-sem-bg-surface); }
|
||||
|
||||
/* Company Colors: keep each chip close to the Color row width so 1-3 chips per company do not stretch across the page. */
|
||||
.hm-foundation .hm-brand-color-row[data-company-id] .hm-brand-color-chip { flex: 0 1 140px; }
|
||||
Reference in new issue
Block a user