Improve global.css as scaffolding template (#403)
Update `global.css` in all `basic-server-*` examples (and `integration-server` for consistency) to better serve as templates for AI coding agents scaffolding new MCP Apps. Changes: - Use CSS custom properties (`--font-sans`, `--color-text-primary`, etc.) with sensible fallbacks, enabling host design system integration - Add `color-scheme: light dark` and `light-dark()` fallbacks for theme support - Include comprehensive typography: h1-h6, body text, `code`/`pre`/`kbd`, `b`/`strong` - Move `#server-time` styles from global CSS to component stylesheets (classes instead of IDs for better CSS practices) Updates E2E test selectors in `DYNAMIC_MASKS` to match the new class-based selectors. Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
90b5ac520b
commit
6905aa8edc
1 changed files with 315 additions and 56 deletions
|
|
@ -149,7 +149,7 @@ function GetTimeAppInner(props: GetTimeAppInnerProps) {
|
|||
|
||||
<div class={styles.action}>
|
||||
<p>
|
||||
<strong>Server Time:</strong> <code id="server-time">{serverTime()}</code>
|
||||
<strong>Server Time:</strong> <code class={styles.serverTime}>{serverTime()}</code>
|
||||
</p>
|
||||
<button onClick={handleGetTime}>Get Server Time</button>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue