8acec0eaad* Add basic-server-vue example Demonstrates MCP App SDK usage with Vue 3, providing framework parity alongside the existing React and vanilla JS examples. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Add basic-server-svelte example Demonstrates MCP App SDK usage with Svelte, providing parity with the existing basic-server-react and basic-server-vue examples. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Add basic-server-preact example Demonstrates MCP App SDK usage with Preact, providing another lightweight framework option alongside the existing React, Vue, and Svelte examples. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Add basic-server-solid example Demonstrates MCP App SDK usage with Solid.js, providing another reactive framework option alongside the existing React, Vue, Svelte, and Preact examples. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> * Add framework GitHub links to README Link each framework name to its official GitHub repo in basic examples list. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
65 lines
1 KiB
CSS
65 lines
1 KiB
CSS
.main {
|
||
--color-primary: #2563eb;
|
||
--color-primary-hover: #1d4ed8;
|
||
--color-notice-bg: #eff6ff;
|
||
|
||
width: 100%;
|
||
max-width: 425px;
|
||
box-sizing: border-box;
|
||
|
||
> * {
|
||
margin-top: 0;
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
> * + * {
|
||
margin-top: 1.5rem;
|
||
}
|
||
}
|
||
|
||
.action {
|
||
> * {
|
||
margin-top: 0;
|
||
margin-bottom: 0;
|
||
width: 100%;
|
||
}
|
||
|
||
> * + * {
|
||
margin-top: 0.5rem;
|
||
}
|
||
|
||
/* Consistent font for form inputs (inherits from global.css) */
|
||
textarea,
|
||
input {
|
||
font-family: inherit;
|
||
font-size: inherit;
|
||
}
|
||
|
||
button {
|
||
padding: 0.5rem 1rem;
|
||
border: none;
|
||
border-radius: 6px;
|
||
color: white;
|
||
font-weight: bold;
|
||
background-color: var(--color-primary);
|
||
cursor: pointer;
|
||
|
||
&:hover,
|
||
&:focus-visible {
|
||
background-color: var(--color-primary-hover);
|
||
}
|
||
}
|
||
}
|
||
|
||
.notice {
|
||
padding: 0.5rem 0.75rem;
|
||
color: var(--color-primary);
|
||
text-align: center;
|
||
font-style: italic;
|
||
background-color: var(--color-notice-bg);
|
||
|
||
&::before {
|
||
content: "ℹ️ ";
|
||
font-style: normal;
|
||
}
|
||
}
|