Overview
Skeleton uses the 'S1' rendering fidelity.
Design
Box Model
Resize/Reflow
[images]
Validity Criteria:
- Covers spacing and dimensions: Identifying spacing and dimensions to ensure pieces are A11Y compliant. Use min-width/min-height instead of height/width/max-height/max-width. Define padding/margins in PX, and min-width/min-height in relative measures.
- Covers responsive/adaptive layout: Given the box models, clearly identify how the layout adapts to breakpoints and responsiveness.
[Images]
States
| State | Default Graphic | Default Styling |
|---|---|---|
| Idle |  | [vs standard idle] background: neutral-000 (#FFFFFF) skeleton: neutral-080 (#EBEDF0) |
| Focus |  | [vs standard idle] background: brand-200 (#EBF6FF) border: 1px solid brand-500 (#1394E5) |
| Disabled |  | [vs standard idle] cursor: disabled |
| Read-only | N/A (no required cases) | N/A |
| Hover |  | [vs standard idle] background: brand-200 (#EBF6FF) |
| Error | N/A (no required cases) | N/A |
Configurations
Not applicable
Use Cases
| Original Scenario | Dimsum's version |
|---|---|
| No known-of cases | N/A |
Examples
| hypothetical scenario graphic | hypothetical scenario solution | hypothetical scenario description |
|---|---|---|
| No known-of scenarios | No known-of solutions | N/A |
Digital Accessibility
Same as standard
Variants
Not applicable
Usage Warnings
No known-of issues
Reference
Not applicable