@nadicodeai/design-system 12.1.13 → 12.1.15
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/AGENTS.md +5 -4
- package/DESIGN.md +1 -1
- package/GLOSSARY.md +6 -9
- package/README.md +3 -4
- package/package.json +1 -1
package/AGENTS.md
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
# @nadicodeai/design-system
|
|
2
2
|
|
|
3
|
-
`DESIGN.md`
|
|
4
|
-
|
|
3
|
+
`DESIGN.md` is nadicode's only design authority: the tokens and the rules
|
|
4
|
+
every component, website section and product screen builds on. React components
|
|
5
|
+
belong to `@nadicodeai/ui`; `examples/` contains rendered specimens.
|
|
5
6
|
|
|
6
7
|
- Design and CSS changes: the relevant section of `DESIGN.md`.
|
|
7
8
|
- Placement: this package and `@nadicodeai/ui` hold the Foundation and what at
|
|
@@ -18,6 +19,6 @@ are outputs, not hand-edited sources. Favicon source changes use
|
|
|
18
19
|
`package.json` owns the commands; shared validation policy is in
|
|
19
20
|
`../../docs/agents/develop.md`.
|
|
20
21
|
|
|
21
|
-
Visual behavior comes from
|
|
22
|
-
|
|
22
|
+
Visual behavior comes from `DESIGN.md`, a shipped surface, or the user's
|
|
23
|
+
design decision. Screenshots verify that behavior. Name primitives
|
|
23
24
|
for nadicode's concepts, keeping source-brand lineage in references.
|
package/DESIGN.md
CHANGED
|
@@ -502,7 +502,7 @@ One wait gets one indicator. A request waiting for a person is not a wait: queue
|
|
|
502
502
|
|
|
503
503
|
### Agent orbs
|
|
504
504
|
|
|
505
|
-
An Agent is its orb, in every product; there is no other Agent picture. An orb is one of seven forms, `ribbon`, `lattice`, `orbit`, `globe`, `network`, `braid` and `morph`, in one colour a person chose: cobalto, verde or arancio, or none, which draws it in the text colour. Giallo is not offered because it fails 3:1 on white; rosso is not offered because it is the error red. Nadia alone is her striped ribbon, azzurro, verde, the text colour and rosso along its whole length, the same at every size and in every state.
|
|
505
|
+
An Agent is its orb, in every product; there is no other Agent picture. An orb is one of seven forms, `ribbon`, `lattice`, `orbit`, `globe`, `network`, `braid` and `morph`, in one colour a person chose: cobalto, verde or arancio, or none, which draws it in the text colour. Giallo is not offered because it fails 3:1 on white; rosso is not offered because it is the error red. Nadia alone is her striped ribbon, the form `nadia`, azzurro, verde, the text colour and rosso along its whole length, the same at every size and in every state.
|
|
506
506
|
|
|
507
507
|
- **Stored look.** An Agent's form is stored as `orb:<form>` and its colour as the identity hex or nothing; a template declares its starting look the same way. The root Agent always draws as Nadia. An unknown form draws `orbit`, an unknown colour the text colour, and a stored rosso draws arancio. The look is a person's choice and is never derived from a name, id or role.
|
|
508
508
|
- **Sizes** are 20, 24, 32, 40, 64, 96 and 160 px. On a photograph an orb takes the stronger `over-picture` weight; everywhere else it is `plain`.
|
package/GLOSSARY.md
CHANGED
|
@@ -17,11 +17,8 @@ _Avoid_: Theme, skin
|
|
|
17
17
|
**Neutral spine**:
|
|
18
18
|
The achromatic colour roles that carry grounds, chrome, hierarchy, and every control in every Register. Chromatic colour belongs to the Identity palette, the semantic feedback roles and the chart palette.
|
|
19
19
|
|
|
20
|
-
**Functional tier**:
|
|
21
|
-
The semantic colour roles and chart colours used for interface state and data.
|
|
22
|
-
|
|
23
20
|
**Identity palette**:
|
|
24
|
-
The brand's colour: five full-strength hues, cobalto, verde, arancio, giallo and rosso, with the white and ink poles type sits on. They appear flat as website section grounds, stages, accents, Agents, the logo and imagery, and never on a control.
|
|
21
|
+
The brand's colour: five full-strength hues, cobalto, verde, arancio, giallo and rosso, with the white and ink poles type sits on. They appear flat as website section grounds, stages, accents on the website, Agents, the logo and imagery, and never on a control.
|
|
25
22
|
_Avoid_: Swatch, theme color, Agent identity palette
|
|
26
23
|
|
|
27
24
|
**Identity plane**:
|
|
@@ -33,19 +30,19 @@ The Identity palette ground behind a floating product view, which glass over it
|
|
|
33
30
|
### Structure and surfaces
|
|
34
31
|
|
|
35
32
|
**Website column**:
|
|
36
|
-
The website's one centred content column,
|
|
33
|
+
The website's one centred content column, which every full-bleed section centres its content in.
|
|
37
34
|
|
|
38
35
|
**Page composition**:
|
|
39
36
|
One of the five repeated page shapes the products build from: Overview, Collection, Object, Configuration and Library, each defined by the first question it answers.
|
|
40
37
|
|
|
41
38
|
**Material ladder**:
|
|
42
|
-
The
|
|
39
|
+
The set of materials a product surface can be made of: the workspace ground, the four solid heights above it, and glass.
|
|
43
40
|
|
|
44
41
|
**Height**:
|
|
45
|
-
How far a solid surface sits above the workspace ground,
|
|
42
|
+
How far a solid surface sits above the workspace ground, one of resting, raised, floating and modal.
|
|
46
43
|
|
|
47
44
|
**Glass**:
|
|
48
|
-
|
|
45
|
+
The translucent, blurred and saturated material, so what moves or carries colour behind a surface still reads through it.
|
|
49
46
|
|
|
50
47
|
**Seam**:
|
|
51
48
|
A visible structural line between two parts of a layout, drawn as one hairline in the line colour.
|
|
@@ -60,7 +57,7 @@ The five colours that mark where a piece of agentic work stands: ready, running,
|
|
|
60
57
|
A visual family outside the conversation renderer for work output and workflow state, such as memory, run progress, identity, and handoffs.
|
|
61
58
|
|
|
62
59
|
**Agent orb**:
|
|
63
|
-
The
|
|
60
|
+
The identity of one Agent across products: one of seven forms in one chosen colour, or Nadia's striped ribbon.
|
|
64
61
|
_Avoid_: Agent glyph, Agent avatar, Agent visual
|
|
65
62
|
|
|
66
63
|
**Product view**:
|
package/README.md
CHANGED
|
@@ -24,10 +24,9 @@ Individual font files are also exposed under `@nadicodeai/design-system/assets/f
|
|
|
24
24
|
|
|
25
25
|
## nadicode logo assets
|
|
26
26
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
Transparent PNG fallbacks are provided for software that cannot place SVG files.
|
|
27
|
+
[Brand media authority](DESIGN.md#brand-media-authority) says what the three
|
|
28
|
+
forms are and where each one goes. This table is the file behind each, with
|
|
29
|
+
transparent PNG fallbacks for software that cannot place SVG.
|
|
31
30
|
|
|
32
31
|
| Form | On white or a soft neutral | On black or another dark ground |
|
|
33
32
|
| --- | --- | --- |
|