New data-demo attribute for demo blocks in documentation. Replaced 16 files worth of inline style="" wrappers with <div data-demo>. Only remaining style= is charts --size data injection (legitimate). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
37 lines
913 B
Markdown
37 lines
913 B
Markdown
---
|
|
title: "Forms"
|
|
description: "Form element styling in ASW — inputs, selects, textareas, and labels."
|
|
type: docs
|
|
weight: 34
|
|
date: 2026-04-11
|
|
tags: ["components", "forms", "inputs"]
|
|
ai-disclosure: "generated"
|
|
ai-model: "claude-sonnet-4-6"
|
|
ai-provider: "Anthropic"
|
|
---
|
|
|
|
All standard form elements are styled out of the box. Labels, inputs, selects, and textareas share consistent sizing and focus rings that respect the accent token.
|
|
|
|
## Inline Demo
|
|
|
|
<div data-demo>
|
|
<form onsubmit="return false">
|
|
<label>
|
|
Name
|
|
<input type="text" placeholder="Jane Smith">
|
|
</label>
|
|
<label>
|
|
Role
|
|
<select>
|
|
<option>Agent</option>
|
|
<option>Human</option>
|
|
<option>Both</option>
|
|
</select>
|
|
</label>
|
|
<label>
|
|
Notes
|
|
<textarea rows="3" placeholder="Optional notes…"></textarea>
|
|
</label>
|
|
<button type="submit">Submit</button>
|
|
</form>
|
|
</div>
|