* feat: add readServerResource() and listServerResources() api to App class * test: add listServerResources and readServerResource integration tests
94 lines
2.8 KiB
CSS
94 lines
2.8 KiB
CSS
:root {
|
|
color-scheme: light dark;
|
|
|
|
/*
|
|
* Fallbacks for host style variables used by this app.
|
|
* The host may provide these (and many more) via the host context.
|
|
*/
|
|
--color-text-primary: light-dark(#1f2937, #f3f4f6);
|
|
--color-text-inverse: light-dark(#f3f4f6, #1f2937);
|
|
--color-text-info: light-dark(#1d4ed8, #60a5fa);
|
|
--color-background-primary: light-dark(#ffffff, #1a1a1a);
|
|
--color-background-inverse: light-dark(#1a1a1a, #ffffff);
|
|
--color-background-info: light-dark(#eff6ff, #1e3a5f);
|
|
--color-ring-primary: light-dark(#3b82f6, #60a5fa);
|
|
--border-radius-md: 6px;
|
|
--border-width-regular: 1px;
|
|
--font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
|
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
|
|
--font-weight-normal: 400;
|
|
--font-weight-bold: 700;
|
|
--font-text-md-size: 1rem;
|
|
--font-text-md-line-height: 1.5;
|
|
--font-heading-3xl-size: 2.25rem;
|
|
--font-heading-3xl-line-height: 1.1;
|
|
--font-heading-2xl-size: 1.875rem;
|
|
--font-heading-2xl-line-height: 1.2;
|
|
--font-heading-xl-size: 1.5rem;
|
|
--font-heading-xl-line-height: 1.25;
|
|
--font-heading-lg-size: 1.25rem;
|
|
--font-heading-lg-line-height: 1.3;
|
|
--font-heading-md-size: 1rem;
|
|
--font-heading-md-line-height: 1.4;
|
|
--font-heading-sm-size: 0.875rem;
|
|
--font-heading-sm-line-height: 1.4;
|
|
|
|
/* Spacing derived from host typography */
|
|
--spacing-unit: var(--font-text-md-size);
|
|
--spacing-xs: calc(var(--spacing-unit) * 0.25);
|
|
--spacing-sm: calc(var(--spacing-unit) * 0.5);
|
|
--spacing-md: var(--spacing-unit);
|
|
--spacing-lg: calc(var(--spacing-unit) * 1.5);
|
|
|
|
/* App accent color (customize for your brand) */
|
|
--color-accent: #2563eb;
|
|
--color-text-on-accent: #ffffff;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html, body {
|
|
font-family: var(--font-sans);
|
|
font-size: var(--font-text-md-size);
|
|
font-weight: var(--font-weight-normal);
|
|
line-height: var(--font-text-md-line-height);
|
|
color: var(--color-text-primary);
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
h1 {
|
|
font-size: var(--font-heading-3xl-size);
|
|
line-height: var(--font-heading-3xl-line-height);
|
|
}
|
|
h2 {
|
|
font-size: var(--font-heading-2xl-size);
|
|
line-height: var(--font-heading-2xl-line-height);
|
|
}
|
|
h3 {
|
|
font-size: var(--font-heading-xl-size);
|
|
line-height: var(--font-heading-xl-line-height);
|
|
}
|
|
h4 {
|
|
font-size: var(--font-heading-lg-size);
|
|
line-height: var(--font-heading-lg-line-height);
|
|
}
|
|
h5 {
|
|
font-size: var(--font-heading-md-size);
|
|
line-height: var(--font-heading-md-line-height);
|
|
}
|
|
h6 {
|
|
font-size: var(--font-heading-sm-size);
|
|
line-height: var(--font-heading-sm-line-height);
|
|
}
|
|
|
|
code, pre, kbd {
|
|
font-family: var(--font-mono);
|
|
font-size: 1em;
|
|
}
|
|
|
|
b, strong {
|
|
font-weight: var(--font-weight-bold);
|
|
}
|