@blueprint-chart/docs 1.4.0 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/manifest.json +7 -0
- package/package.json +3 -3
- package/src/handbook/effects-kit.md +45 -0
package/dist/manifest.json
CHANGED
|
@@ -49,6 +49,13 @@
|
|
|
49
49
|
"blurb": "> The core principles behind every good chart: purposefulness, clarity, data-ink ratio, restraint, consistency, starting with grey, the power of comparisons, and the refusal to use 3D.",
|
|
50
50
|
"mdPath": "handbook/design-principles.md"
|
|
51
51
|
},
|
|
52
|
+
{
|
|
53
|
+
"slug": "effects-kit",
|
|
54
|
+
"group": "handbook",
|
|
55
|
+
"title": "Effects Kit",
|
|
56
|
+
"blurb": "> The brand effects kit ported from FIG.07 of the effects kit reference: one law, the ALWAYS / NEVER rules (including the rejected variants), and how each effect maps to a real class or component in `",
|
|
57
|
+
"mdPath": "handbook/effects-kit.md"
|
|
58
|
+
},
|
|
52
59
|
{
|
|
53
60
|
"slug": "frame-elements",
|
|
54
61
|
"group": "handbook",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blueprint-chart/docs",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.5.0",
|
|
4
4
|
"description": "Public documentation for Blueprint Chart — handbook, guide, BPC DSL spec, and lib API reference.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|
|
@@ -49,8 +49,8 @@
|
|
|
49
49
|
"vitepress": "^1.5.0",
|
|
50
50
|
"vitest": "^3.2.4",
|
|
51
51
|
"vue": "^3.5",
|
|
52
|
-
"@blueprint-chart/lib": "1.
|
|
53
|
-
"@blueprint-chart/ui": "1.
|
|
52
|
+
"@blueprint-chart/lib": "1.5.0",
|
|
53
|
+
"@blueprint-chart/ui": "1.5.0"
|
|
54
54
|
},
|
|
55
55
|
"scripts": {
|
|
56
56
|
"dev": "vitepress dev src --host 0.0.0.0 --port 4445",
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Effects Kit
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
# Effects Kit
|
|
6
|
+
|
|
7
|
+
> The brand effects kit ported from FIG.07 of the effects kit reference: one law, the ALWAYS / NEVER rules (including the rejected variants), and how each effect maps to a real class or component in `@blueprint-chart/ui`.
|
|
8
|
+
|
|
9
|
+
## The law
|
|
10
|
+
|
|
11
|
+
Ink and light condense around a point of attention. Everything below is that sentence, enforced.
|
|
12
|
+
|
|
13
|
+
## ALWAYS
|
|
14
|
+
|
|
15
|
+
- Give every grid pool, grain bloom, and gradient an anchor, a data point, cursor, or CTA.
|
|
16
|
+
- On paper, any chartreuse focus dot wears a 2px navy ring, a miniature of the two-circle logo.
|
|
17
|
+
- Keep chartreuse at roughly 4% of any composition, it marks decisions and data, nothing else.
|
|
18
|
+
- Keep inner card edges crisp; texture lives in the ring and the bloom.
|
|
19
|
+
- Use identical grid cell size (20px) and line weight (1px) in both modes.
|
|
20
|
+
- Treat gradients on dark as particle-density ramps, two seeds, optical mixing.
|
|
21
|
+
|
|
22
|
+
## NEVER, including the rejected variants
|
|
23
|
+
|
|
24
|
+
- Full-bleed or uniform grid on any surface (rejected: "the clearing", generic SaaS grid).
|
|
25
|
+
- Thin chartreuse strokes or chartreuse text on white.
|
|
26
|
+
- Grain on charts, data, text zones, app UI, or any light surface.
|
|
27
|
+
- Gradient "drawn line" strokes and sprayed particle shadows (rejected rev 02).
|
|
28
|
+
- Visible start/end gaps in perimeter borders (rejected: pen-lift perimeter).
|
|
29
|
+
- Stencil overspray borders (rejected).
|
|
30
|
+
- Chartreuse in the static logo, nav, or ordinary structure.
|
|
31
|
+
- More than one particle ring or one chartreuse CTA per view.
|
|
32
|
+
|
|
33
|
+
## Effects and their classes
|
|
34
|
+
|
|
35
|
+
- **Grid pool** (`.bc-pool`): the drafting grid revealed radially around an anchor via a mask, never full-bleed; set `--bc-pool-x` / `--bc-pool-y` to place it over the anchor.
|
|
36
|
+
- **Pen & highlighter** (`--bc-mark`, `.bc-highlight`): the one marker with two gestures, chartreuse ink on dark, a chartreuse swipe behind body ink on light.
|
|
37
|
+
- **Grain** (`StippleDefs`): the shared stipple filter defs, referenced by `filter: url(#bc-stipple-a|b|c)`; dark marketing surfaces only (the landing hero), never on charts, data, or app UI.
|
|
38
|
+
- **Particle ring** (`BcRing`): a stippled gradient stroke framing one featured element per view; inner edges stay crisp, ordinary cards keep flat hairlines instead.
|
|
39
|
+
- **Buttons** (`.btn-bc-primary`): the everyday emphasis button, chartreuse fill / navy ink (navy fill / chartreuse ink on light); its hover/focus state is the pooled `.bc-pool`, not a separate button.
|
|
40
|
+
|
|
41
|
+
## See also
|
|
42
|
+
|
|
43
|
+
- [Color & Palettes](/handbook/color)
|
|
44
|
+
- [Design Principles](/handbook/design-principles)
|
|
45
|
+
- [Anti-Patterns](/handbook/anti-patterns)
|