Add public agent profiles and community moderation
This commit is contained in:
JB
+59
-12
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"schemaVersion": 2,
|
||||
"generatedAt": "2026-07-26T17:47:28.721Z",
|
||||
"generatedAt": "2026-07-27T19:09:41.393Z",
|
||||
"title": "Design System: SHD.build",
|
||||
"extensions": {
|
||||
"colorMeta": {
|
||||
@@ -34,6 +34,12 @@
|
||||
"canonical": "#15191a",
|
||||
"tonalRamp": ["#080a0a", "#15191a", "#252a2b", "#3e4445", "#626a6c", "#909799", "#c8cccb", "#f2f3f0"]
|
||||
},
|
||||
"modeled-data-surface": {
|
||||
"role": "neutral",
|
||||
"displayName": "Modeled Data Surface",
|
||||
"canonical": "#0d1213",
|
||||
"tonalRamp": ["#050708", "#0d1213", "#1c2527", "#334043", "#526165", "#7d8b8e", "#bac2c2", "#eff1ef"]
|
||||
},
|
||||
"structural-line": {
|
||||
"role": "neutral",
|
||||
"displayName": "Structural Line",
|
||||
@@ -46,6 +52,18 @@
|
||||
"canonical": "#272c2d",
|
||||
"tonalRamp": ["#0b0d0d", "#181b1c", "#272c2d", "#43494a", "#656d6f", "#8e9597", "#c2c6c5", "#eff0ed"]
|
||||
},
|
||||
"structural-line-strong": {
|
||||
"role": "neutral",
|
||||
"displayName": "Structural Line Strong",
|
||||
"canonical": "#424849",
|
||||
"tonalRamp": ["#111415", "#252a2b", "#424849", "#5d6567", "#7c8587", "#a0a7a8", "#c9cdcc", "#f1f2ef"]
|
||||
},
|
||||
"modeled-data-line": {
|
||||
"role": "neutral",
|
||||
"displayName": "Modeled Data Line",
|
||||
"canonical": "#3b4648",
|
||||
"tonalRamp": ["#0e1314", "#20292b", "#3b4648", "#566366", "#758184", "#9aa3a5", "#c6cbca", "#f0f2ef"]
|
||||
},
|
||||
"field-manual-white": {
|
||||
"role": "neutral",
|
||||
"displayName": "Field Manual White",
|
||||
@@ -195,7 +213,7 @@
|
||||
"refersTo": "button-primary",
|
||||
"description": "The decisive action within a task group.",
|
||||
"html": "<button class=\"ds-btn-primary\">SAVE CHANGES <span aria-hidden=\"true\">→</span></button>",
|
||||
"css": ".ds-btn-primary{min-height:40px;border:0;border-radius:0;padding:12px 22px;background:var(--shd-orange,#f6a821);color:#111;font:900 11px/1 Barlow,Arial,sans-serif;letter-spacing:1.6px;text-transform:uppercase;cursor:pointer;transition:transform .12s ease,filter .18s ease,background .18s ease}.ds-btn-primary:hover{background:var(--shd-orange-hover,#ffc45d)}.ds-btn-primary:focus-visible{outline:1px solid var(--shd-focus-ring,#f6a821);outline-offset:2px}.ds-btn-primary:active{transform:translateY(2px) scale(.985);filter:brightness(.9)}.ds-btn-primary:disabled{cursor:wait;opacity:.58}"
|
||||
"css": ".ds-btn-primary{min-height:40px;border:0;border-radius:0;padding:12px 22px;background:var(--shd-orange,#f6a821);color:#111;font:900 12px/1 Barlow,Arial,sans-serif;letter-spacing:1.6px;text-transform:uppercase;cursor:pointer;transition:transform .12s ease,filter .18s ease,background .18s ease}.ds-btn-primary:hover{background:var(--shd-orange-hover,#ffc45d)}.ds-btn-primary:focus-visible{outline:1px solid var(--shd-focus-ring,#f6a821);outline-offset:2px}.ds-btn-primary:active{transform:translateY(2px) scale(.985);filter:brightness(.9)}.ds-btn-primary:disabled{cursor:wait;opacity:.58}"
|
||||
},
|
||||
{
|
||||
"name": "Secondary Action",
|
||||
@@ -203,7 +221,7 @@
|
||||
"refersTo": "button-secondary",
|
||||
"description": "A supporting or cancel action with equal geometric discipline.",
|
||||
"html": "<button class=\"ds-btn-secondary\">CANCEL</button>",
|
||||
"css": ".ds-btn-secondary{min-height:40px;border:1px solid var(--shd-border,#303536);border-radius:0;padding:12px 22px;background:transparent;color:var(--shd-text,#ecebe5);font:900 11px/1 Barlow,Arial,sans-serif;letter-spacing:1.6px;text-transform:uppercase;cursor:pointer;transition:transform .12s ease,filter .18s ease,border-color .18s ease}.ds-btn-secondary:hover{border-color:var(--shd-orange,#f6a821);color:var(--shd-orange-hover,#ffc45d)}.ds-btn-secondary:focus-visible{outline:1px solid var(--shd-focus-ring,#f6a821);outline-offset:2px}.ds-btn-secondary:active{transform:translateY(2px) scale(.985);filter:brightness(.9)}"
|
||||
"css": ".ds-btn-secondary{min-height:40px;border:1px solid var(--shd-border,#303536);border-radius:0;padding:12px 22px;background:transparent;color:var(--shd-text,#ecebe5);font:900 12px/1 Barlow,Arial,sans-serif;letter-spacing:1.6px;text-transform:uppercase;cursor:pointer;transition:transform .12s ease,filter .18s ease,border-color .18s ease}.ds-btn-secondary:hover{border-color:var(--shd-orange,#f6a821);color:var(--shd-orange-hover,#ffc45d)}.ds-btn-secondary:focus-visible{outline:1px solid var(--shd-focus-ring,#f6a821);outline-offset:2px}.ds-btn-secondary:active{transform:translateY(2px) scale(.985);filter:brightness(.9)}"
|
||||
},
|
||||
{
|
||||
"name": "Operational Field",
|
||||
@@ -211,7 +229,7 @@
|
||||
"refersTo": "input",
|
||||
"description": "A recessed data-entry field with explicit label and precise focus.",
|
||||
"html": "<label class=\"ds-field\"><span>ATTRIBUTE NAME</span><input value=\"Critical Hit Damage\" /></label>",
|
||||
"css": ".ds-field{display:grid;gap:6px;color:var(--shd-text-muted,#858b8d);font:900 8px/1 Barlow,Arial,sans-serif;letter-spacing:1.2px;text-transform:uppercase}.ds-field input{width:100%;min-height:40px;border:1px solid #363b3c;border-radius:0;padding:11px;background:var(--shd-bg-field,#0d0f10);color:var(--shd-text,#ecebe5);font:400 14px/1.3 Barlow,Arial,sans-serif}.ds-field input:focus{border-color:var(--shd-orange,#f6a821);outline:none}.ds-field input:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:1px}"
|
||||
"css": ".ds-field{display:grid;gap:6px;color:var(--shd-text-muted,#858b8d);font:900 12px/1 Barlow,Arial,sans-serif;letter-spacing:1.2px;text-transform:uppercase}.ds-field input{width:100%;min-height:40px;border:1px solid #363b3c;border-radius:0;padding:11px;background:var(--shd-bg-field,#0d0f10);color:var(--shd-text,#ecebe5);font:400 16px/1.3 Barlow,Arial,sans-serif}.ds-field input:focus{border-color:var(--shd-orange,#f6a821);outline:none}.ds-field input:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:1px}"
|
||||
},
|
||||
{
|
||||
"name": "Segmented Choice",
|
||||
@@ -219,7 +237,7 @@
|
||||
"refersTo": "status-chip",
|
||||
"description": "A bounded radio-style choice rendered as one connected instrument.",
|
||||
"html": "<div class=\"ds-segments\" role=\"radiogroup\" aria-label=\"Tier\"><button role=\"radio\" aria-checked=\"false\">T0</button><button role=\"radio\" aria-checked=\"true\">T1</button><button role=\"radio\" aria-checked=\"false\">T2</button></div>",
|
||||
"css": ".ds-segments{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--shd-border,#303536);background:var(--shd-bg,#0a0c0d)}.ds-segments button{min-height:44px;border:0;border-left:1px solid var(--shd-border,#303536);border-radius:0;background:var(--shd-surface,#111415);color:var(--shd-text-muted,#858b8d);font:900 9px/1 Barlow,Arial,sans-serif;letter-spacing:1px;cursor:pointer}.ds-segments button:first-child{border-left:0}.ds-segments button:hover,.ds-segments button:focus-visible{background:var(--shd-surface-active,#15191a);color:var(--shd-text,#ecebe5)}.ds-segments button:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:-2px}.ds-segments button[aria-checked=true]{background:#2b2111;color:var(--shd-orange,#f6a821);box-shadow:inset 0 -2px var(--shd-orange,#f6a821)}.ds-segments button:active{filter:brightness(.82)}"
|
||||
"css": ".ds-segments{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--shd-border,#303536);background:var(--shd-bg,#0a0c0d)}.ds-segments button{min-height:44px;border:0;border-left:1px solid var(--shd-border,#303536);border-radius:0;background:var(--shd-surface,#111415);color:var(--shd-text-muted,#858b8d);font:900 12px/1 Barlow,Arial,sans-serif;letter-spacing:1px;cursor:pointer}.ds-segments button:first-child{border-left:0}.ds-segments button:hover,.ds-segments button:focus-visible{background:var(--shd-surface-active,#15191a);color:var(--shd-text,#ecebe5)}.ds-segments button:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:-2px}.ds-segments button[aria-checked=true]{background:#2b2111;color:var(--shd-orange,#f6a821);box-shadow:inset 0 -2px var(--shd-orange,#f6a821)}.ds-segments button:active{filter:brightness(.82)}"
|
||||
},
|
||||
{
|
||||
"name": "Database Record Card",
|
||||
@@ -227,26 +245,34 @@
|
||||
"refersTo": "panel",
|
||||
"description": "A public data card built from identity, metadata, and compact fact regions.",
|
||||
"html": "<article class=\"ds-record\"><header><div class=\"ds-record-icon\" aria-hidden=\"true\">SHD</div><div><small>WEAPON // SMG</small><h3>FIRST WAVE VECTOR</h3></div><b>T2</b></header><dl><div><dt>DAMAGE</dt><dd>12,480–15,920</dd></div><div><dt>RPM</dt><dd>1,200</dd></div></dl><p>Level 50 operational values calculated from authoritative game data.</p></article>",
|
||||
"css": ".ds-record{border:1px solid var(--shd-border,#303536);border-top:2px solid #404748;border-radius:0;background:var(--shd-surface,#111415);color:var(--shd-text,#ecebe5);font-family:Barlow,Arial,sans-serif}.ds-record header{min-height:78px;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 13px;border-bottom:1px solid var(--shd-border,#303536)}.ds-record-icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid #343a3b;background:#0c0f10;color:var(--shd-orange,#f6a821);font-size:9px;font-weight:900}.ds-record small,.ds-record dt{color:#697174;font-size:6px;font-weight:900;letter-spacing:.8px}.ds-record h3{margin:5px 0 0;font-size:14px;line-height:1.1}.ds-record header>b{padding:4px 6px;border:1px solid #765426;background:#21180d;color:var(--shd-orange,#f6a821);font-size:7px}.ds-record dl{display:grid;grid-template-columns:1fr 1fr;margin:10px 12px 0;border:1px solid var(--shd-border,#303536)}.ds-record dl>div{padding:9px;border-left:1px solid var(--shd-border,#303536)}.ds-record dl>div:first-child{border-left:0}.ds-record dd{margin:5px 0 0;font-size:11px;font-weight:900}.ds-record>p{margin:9px 12px 12px;padding:9px;border-left:1px solid var(--shd-orange,#f6a821);background:#0d1011;color:#a2a8aa;font:10px/1.55 Source Serif 4,Georgia,serif}"
|
||||
"css": ".ds-record{border:1px solid var(--shd-border,#303536);border-top:2px solid #404748;border-radius:0;background:var(--shd-surface,#111415);color:var(--shd-text,#ecebe5);font-family:Barlow,Arial,sans-serif}.ds-record header{min-height:78px;display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 13px;border-bottom:1px solid var(--shd-border,#303536)}.ds-record-icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid #343a3b;background:#0c0f10;color:var(--shd-orange,#f6a821);font-size:12px;font-weight:900}.ds-record small,.ds-record dt{color:#697174;font-size:12px;font-weight:900;letter-spacing:.8px}.ds-record h3{margin:5px 0 0;font-size:16px;line-height:1.1}.ds-record header>b{padding:4px 6px;border:1px solid #765426;background:#21180d;color:var(--shd-orange,#f6a821);font-size:12px}.ds-record dl{display:grid;grid-template-columns:1fr 1fr;margin:10px 12px 0;border:1px solid var(--shd-border,#303536)}.ds-record dl>div{padding:9px;border-left:1px solid var(--shd-border,#303536)}.ds-record dl>div:first-child{border-left:0}.ds-record dd{margin:5px 0 0;font-size:14px;font-weight:900}.ds-record>p{margin:9px 12px 12px;padding:9px;border-left:1px solid var(--shd-orange,#f6a821);background:#0d1011;color:#a2a8aa;font:14px/1.55 Source Serif 4,Georgia,serif}"
|
||||
},
|
||||
{
|
||||
"name": "ISAC Module Navigation",
|
||||
"kind": "nav",
|
||||
"description": "A dense indexed registry rail with one explicit active module.",
|
||||
"html": "<nav class=\"ds-isac-nav\" aria-label=\"ISAC modules\"><a href=\"#\"><small>01</small><span>ATTRIBUTES</span><b>›</b></a><a class=\"active\" href=\"#\" aria-current=\"page\"><small>02</small><span>TALENTS</span><b>›</b></a><a href=\"#\"><small>03</small><span>GEAR</span><b>›</b></a></nav>",
|
||||
"css": ".ds-isac-nav{display:flex;flex-direction:column;border:1px solid #2c3132;background:#0f1213;font-family:Barlow,Arial,sans-serif}.ds-isac-nav a{min-height:49px;display:grid;grid-template-columns:33px 1fr auto;align-items:center;border-bottom:1px solid #272c2d;color:#858c8e;text-decoration:none}.ds-isac-nav a small{height:100%;display:grid;place-items:center;background:#141819;color:#535a5c;font-size:7px;letter-spacing:.6px}.ds-isac-nav a span{padding-left:11px;font-size:10px;font-weight:700}.ds-isac-nav a b{padding-right:12px;color:var(--shd-orange,#f6a821);font-size:17px}.ds-isac-nav a:hover,.ds-isac-nav a:focus-visible,.ds-isac-nav a.active{background:#151819;color:#fff}.ds-isac-nav a:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:-2px}.ds-isac-nav a.active{box-shadow:inset 2px 0 var(--shd-orange,#f6a821)}.ds-isac-nav a.active small{background:#2b2111;color:var(--shd-orange,#f6a821)}"
|
||||
"css": ".ds-isac-nav{display:flex;flex-direction:column;border:1px solid #2c3132;background:#0f1213;font-family:Barlow,Arial,sans-serif}.ds-isac-nav a{min-height:49px;display:grid;grid-template-columns:33px 1fr auto;align-items:center;border-bottom:1px solid #272c2d;color:#858c8e;text-decoration:none}.ds-isac-nav a small{height:100%;display:grid;place-items:center;background:#141819;color:#858b8d;font-size:12px;letter-spacing:.6px}.ds-isac-nav a span{padding-left:11px;font-size:12px;font-weight:700}.ds-isac-nav a b{padding-right:12px;color:var(--shd-orange,#f6a821);font-size:17px}.ds-isac-nav a:hover,.ds-isac-nav a:focus-visible,.ds-isac-nav a.active{background:#151819;color:#fff}.ds-isac-nav a:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:-2px}.ds-isac-nav a.active{box-shadow:inset 2px 0 var(--shd-orange,#f6a821)}.ds-isac-nav a.active small{background:#2b2111;color:var(--shd-orange,#f6a821)}"
|
||||
},
|
||||
{
|
||||
"name": "System Toast",
|
||||
"kind": "custom",
|
||||
"description": "Detached semantic feedback with a concise operational title and dismissal.",
|
||||
"html": "<aside class=\"ds-toast\" role=\"status\"><i></i><div><span>ISAC // COMPLETE</span><strong>ATTRIBUTE SAVED</strong><p>The registry has been updated.</p></div><button aria-label=\"Dismiss\">×</button></aside>",
|
||||
"css": ".ds-toast{--ds-tone:var(--shd-success,#75c08c);min-height:72px;display:grid;grid-template-columns:4px minmax(0,1fr) 34px;overflow:hidden;border:1px solid #414849;border-top:2px solid var(--ds-tone);border-radius:0;background:linear-gradient(105deg,#171b1cee,#0c0f10f7);box-shadow:0 12px 30px #000b;color:var(--shd-text,#ecebe5);font-family:Barlow,Arial,sans-serif}.ds-toast>i{background:var(--ds-tone)}.ds-toast>div{display:grid;align-content:center;gap:4px;padding:11px 10px}.ds-toast span{color:var(--ds-tone);font-size:6px;font-weight:900;letter-spacing:1px}.ds-toast strong{font-size:9px;line-height:1.3}.ds-toast p{margin:0;color:#91999b;font-size:7px;line-height:1.45}.ds-toast button{width:34px;height:34px;margin:4px 3px 0 0;border:0;background:transparent;color:#70787a;font-size:17px;cursor:pointer}.ds-toast button:hover,.ds-toast button:focus-visible{background:#ffffff09;color:var(--ds-tone)}.ds-toast button:focus-visible{outline:1px solid var(--ds-tone);outline-offset:-2px}.ds-toast button:active{transform:translateY(1px);filter:brightness(.8)}"
|
||||
"css": ".ds-toast{--ds-tone:var(--shd-success,#75c08c);min-height:72px;display:grid;grid-template-columns:4px minmax(0,1fr) 34px;overflow:hidden;border:1px solid #414849;border-top:2px solid var(--ds-tone);border-radius:0;background:linear-gradient(105deg,#171b1cee,#0c0f10f7);box-shadow:0 12px 30px #000b;color:var(--shd-text,#ecebe5);font-family:Barlow,Arial,sans-serif}.ds-toast>i{background:var(--ds-tone)}.ds-toast>div{display:grid;align-content:center;gap:4px;padding:11px 10px}.ds-toast span{color:var(--ds-tone);font-size:12px;font-weight:900;letter-spacing:1px}.ds-toast strong{font-size:13px;line-height:1.3}.ds-toast p{margin:0;color:#91999b;font-size:12px;line-height:1.45}.ds-toast button{width:34px;height:34px;margin:4px 3px 0 0;border:0;background:transparent;color:#70787a;font-size:17px;cursor:pointer}.ds-toast button:hover,.ds-toast button:focus-visible{background:#ffffff09;color:var(--ds-tone)}.ds-toast button:focus-visible{outline:1px solid var(--ds-tone);outline-offset:-2px}.ds-toast button:active{transform:translateY(1px);filter:brightness(.8)}"
|
||||
},
|
||||
{
|
||||
"name": "Modeled Authoring Assist",
|
||||
"kind": "custom",
|
||||
"refersTo": "assistant-panel",
|
||||
"description": "A permission-aware draft workspace for mechanic and calculation authoring.",
|
||||
"html": "<section class=\"ds-assist\"><header><div><span>ISAC AUTHORING ASSIST</span><strong>AI MECHANIC DRAFTING</strong></div><b>AUTHORIZED</b><button type=\"button\" aria-expanded=\"false\">OPEN ASSISTANT</button></header><p>Convert in-game wording into a reviewable draft. Manual authoring remains available.</p></section>",
|
||||
"css": ".ds-assist{border:1px solid var(--shd-model-border,#3b4648);border-left:2px solid var(--shd-info,#70b9d6);border-radius:0;background:var(--shd-model-surface,#0d1213);color:var(--shd-text,#ecebe5);font-family:Barlow,Arial,sans-serif}.ds-assist header{min-height:46px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:7px 9px;border-bottom:1px solid var(--shd-border,#303536);background:var(--shd-surface-raised,#141718)}.ds-assist header div{display:grid;gap:2px}.ds-assist span,.ds-assist b{color:var(--shd-info,#70b9d6);font-size:12px;font-weight:900;letter-spacing:.9px}.ds-assist b{padding:5px 7px;border:1px solid var(--shd-model-border,#3b4648)}.ds-assist button{min-height:40px;padding:0 11px;border:1px solid var(--shd-info,#70b9d6);border-radius:0;background:transparent;color:var(--shd-info,#70b9d6);font-size:12px;font-weight:900;letter-spacing:.7px;cursor:pointer}.ds-assist button:hover{background:#152225}.ds-assist button:focus-visible{outline:1px solid var(--shd-orange,#f6a821);outline-offset:2px}.ds-assist button:active{transform:translateY(1px);filter:brightness(.84)}.ds-assist p{margin:0;padding:10px 11px;color:var(--shd-text-muted,#858b8d);font-size:14px;line-height:1.45}"
|
||||
}
|
||||
],
|
||||
"narrative": {
|
||||
"northStar": "The Strategic Operations Grid",
|
||||
"overview": "SHD.build behaves like a dependable intelligence network shared by active agents: precise, restrained, tactical, and structured around trustworthy data. The interface communicates through alignment, density, operational labels, and visible state rather than spectacle. Public surfaces can breathe and use larger editorial hierarchy, while ISAC compresses the same identity into an efficient control surface.\n\nThe world is technical without becoming sterile. Fine structural lines, tonally layered black and graphite surfaces, cropped game iconography, clipped silhouettes, and tactile state changes create its character. Theme language supports comprehension; it never becomes military cosplay.",
|
||||
"overview": "SHD.build serves active agents through a dependable intelligence network: precise, restrained, tactical, and built around trustworthy data. Alignment, density, operational labels, and visible state carry the interface. Public surfaces use space and larger editorial hierarchy. ISAC compresses the same identity into an efficient control surface.\n\nFine structural lines, layered black and graphite surfaces, cropped game iconography, clipped silhouettes, and tactile state changes give the interface its technical character. Theme language supports comprehension and avoids military cosplay.",
|
||||
"keyCharacteristics": [
|
||||
"Dark, high-contrast operational canvas with restrained tonal layering.",
|
||||
"Square engineered geometry, except circular agent avatars and the SHD mark.",
|
||||
@@ -258,17 +284,22 @@
|
||||
"rules": [
|
||||
{
|
||||
"name": "The Orange Discipline Rule",
|
||||
"body": "Signal Orange identifies action and emphasis; it does not cover large decorative areas or compete with semantic state colors.",
|
||||
"body": "Use Signal Orange for action and emphasis. Keep it out of large decorative areas and away from semantic state colors.",
|
||||
"section": "colors"
|
||||
},
|
||||
{
|
||||
"name": "The Redundant Meaning Rule",
|
||||
"body": "Color always travels with text, position, shape, or an icon. No status or quality can depend on hue alone.",
|
||||
"body": "Pair color with text, position, shape, or an icon. A status or quality cannot depend on hue alone.",
|
||||
"section": "colors"
|
||||
},
|
||||
{
|
||||
"name": "The Two-Voice Rule",
|
||||
"body": "Sans-serif operates the system; serif explains it. Never use monospace merely to make an interface look technical.",
|
||||
"body": "Sans-serif operates the system; serif explains it. Do not use monospace to make an interface look technical.",
|
||||
"section": "typography"
|
||||
},
|
||||
{
|
||||
"name": "The Telemetry Restraint Rule",
|
||||
"body": "Uppercase tracked labels are short navigational or state-bearing signals, not paragraph typography.",
|
||||
"section": "typography"
|
||||
},
|
||||
{
|
||||
@@ -276,15 +307,30 @@
|
||||
"body": "Use borders, shared edges, and aligned tracks to show relationships. Do not wrap every subsection in another card.",
|
||||
"section": "layout"
|
||||
},
|
||||
{
|
||||
"name": "The Operational Density Rule",
|
||||
"body": "Public discovery may breathe; ISAC and data workbenches prioritize scanability and efficient repeated actions.",
|
||||
"section": "layout"
|
||||
},
|
||||
{
|
||||
"name": "The Structural Layering Rule",
|
||||
"body": "Borders and tones establish permanent hierarchy; shadows communicate temporary detachment.",
|
||||
"section": "elevation"
|
||||
},
|
||||
{
|
||||
"name": "The No Ambient Card Rule",
|
||||
"body": "Ordinary panels and cards remain shadowless at rest.",
|
||||
"section": "elevation"
|
||||
},
|
||||
{
|
||||
"name": "The Engineered Edge Rule",
|
||||
"body": "Square is the default and rounding must have semantic justification.",
|
||||
"section": "shapes"
|
||||
},
|
||||
{
|
||||
"name": "The Identity Circle Rule",
|
||||
"body": "Circular crops belong to people, the SHD emblem, and radial information, not arbitrary controls.",
|
||||
"section": "shapes"
|
||||
}
|
||||
],
|
||||
"dos": [
|
||||
@@ -293,6 +339,7 @@
|
||||
"Do pair every state color and icon with explicit text.",
|
||||
"Do use reusable segmented choices for bounded sets and searchable assignments for large relational sets.",
|
||||
"Do preserve tactile pressed, focus-visible, pending, disabled, error, success, and reduced-motion behavior.",
|
||||
"Do keep AI-generated data inside an explicit draft-and-review boundary while preserving manual authoring controls.",
|
||||
"Do let public editorial surfaces breathe while keeping ISAC dense and task-oriented."
|
||||
],
|
||||
"donts": [
|
||||
|
||||
Reference in New Issue
Block a user