Skip to content

Commit ba58baf

Browse files
bogdaniculaebogdaniculae
committed
Restructure docs
1 parent 0cfdbf2 commit ba58baf

File tree

18 files changed

+78
-417
lines changed

18 files changed

+78
-417
lines changed

‎docs/README.md‎

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ title: BCC Design System
55

66
# BCC Design System
77

8+
> **Work in Progress** - Documentation is under development.
9+
810
Design tokens for building consistent BCC applications.
911

1012
## Quick Start
@@ -23,15 +25,7 @@ npm install @bcc-code/design-tokens
2325
</div>
2426
```
2527

26-
## Documentation
27-
28-
| Section | Description |
29-
|---------|-------------|
30-
| [Getting Started](./getting-started/) | Installation and setup guides |
31-
| [Core Concepts](./core-concepts/) | Colors, spacing, typography, dark mode |
32-
| [Assets](./assets/) | Icons and logos |
33-
34-
## Resources
28+
## Links
3529

3630
| Resource | Link |
3731
|----------|------|

‎docs/assets/README.md‎

Lines changed: 0 additions & 13 deletions
This file was deleted.

‎docs/core-concepts/README.md‎

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎docs/core-concepts/guidelines.md‎

Lines changed: 0 additions & 73 deletions
This file was deleted.

‎docs/foundations/README.md‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
---
2+
sectionTitle: Foundations
3+
sectionOrder: 20
4+
title: Overview
5+
---
6+
7+
# Foundations
8+
9+
> **Work in Progress** - This section is under development.
10+
11+
Design tokens for building consistent BCC applications.
12+
13+
- [Color](./colors.md) - Semantic color tokens
14+
- [Typography](./typography.md) - Fonts and text styles
15+
- [Spacing](./spacing.md) - Consistent spacing scale
16+
- [Dark mode](./dark-mode.md) - Theme switching

docs/core-concepts/colors.md renamed to docs/foundations/colors.md

File renamed without changes.

docs/core-concepts/dark-mode.md renamed to docs/foundations/dark-mode.md

File renamed without changes.

docs/core-concepts/spacing.md renamed to docs/foundations/spacing.md

File renamed without changes.

docs/core-concepts/typography.md renamed to docs/foundations/typography.md

File renamed without changes.

‎docs/getting-started/README.md‎

Lines changed: 45 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,52 @@
11
---
22
sectionTitle: Getting Started
33
sectionOrder: 10
4-
title: Overview
5-
order: 0
4+
title: Installation
65
---
76

8-
# Getting Started
7+
# Installation
98

10-
Choose your setup based on your tech stack.
9+
```bash
10+
npm install @bcc-code/design-tokens
11+
```
1112

12-
| Setup | Best for |
13-
|-------|----------|
14-
| [PrimeVue](./primevue.md) | Vue 3 apps with component library |
15-
| [Tailwind](./tailwind.md) | Any project using Tailwind CSS v4 |
16-
| [CSS Variables](./css.md) | Plain CSS, other frameworks |
13+
## Font
14+
15+
Add the Archivo font to your HTML `<head>`:
16+
17+
```html
18+
<link href="https://fonts.googleapis.com/css2?family=Archivo:[email protected]&display=swap" rel="stylesheet" />
19+
```
20+
21+
## Tailwind CSS v4
22+
23+
```css
24+
@import "@bcc-code/design-tokens/tailwind";
25+
```
26+
27+
## PrimeVue
28+
29+
```js
30+
import PrimeVue from "primevue/config";
31+
import BCCPreset from "@bcc-code/design-tokens/primevue";
32+
import "@bcc-code/design-tokens/primevue/overrides";
33+
34+
app.use(PrimeVue, {
35+
theme: {
36+
preset: BCCPreset,
37+
options: { darkModeSelector: ".dark" },
38+
},
39+
});
40+
```
41+
42+
## CSS Variables
43+
44+
```css
45+
@import "@bcc-code/design-tokens/css";
46+
```
47+
48+
Or via CDN:
49+
50+
```html
51+
<link rel="stylesheet" href="https://unpkg.com/@bcc-code/design-tokens@latest/build/bcc/css/auto.css">
52+
```

0 commit comments

Comments
 (0)