@m3ui-vue/m3ui-vue 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +82 -23
- package/dist/components/MChart.vue.d.ts +2 -3
- package/dist/components/MContainer.vue.d.ts +1 -1
- package/dist/components/MTerminal.vue.d.ts +4 -4
- package/dist/components/MTooltip.vue.d.ts +1 -1
- package/dist/m3ui.css +1 -1
- package/dist/m3ui.js +1201 -1169
- package/dist/m3ui.js.map +1 -1
- package/package.json +1 -1
- package/src/components/MChart.vue +54 -47
- package/src/components/MCodeEditor.vue +52 -36
- package/src/components/MMarkdown.vue +24 -17
- package/src/components/MRichTextEditor.vue +101 -67
- package/src/components/MTerminal.vue +10 -8
package/README.md
CHANGED
|
@@ -1,16 +1,22 @@
|
|
|
1
|
-
#
|
|
1
|
+
# M3UI Vue
|
|
2
2
|
|
|
3
3
|
Material 3 component library for Vue 3 + Tailwind CSS v4.
|
|
4
4
|
|
|
5
5
|
80+ components following [Material Design 3](https://m3.material.io/) guidelines with 20 built-in color palettes, dark mode, and full TypeScript support.
|
|
6
6
|
|
|
7
|
-
##
|
|
7
|
+
## Quick Start
|
|
8
|
+
|
|
9
|
+
### 1. Install
|
|
8
10
|
|
|
9
11
|
```bash
|
|
10
|
-
pnpm add @m3ui/vue
|
|
12
|
+
pnpm add @m3ui-vue/m3ui-vue
|
|
13
|
+
# or
|
|
14
|
+
npm install @m3ui-vue/m3ui-vue
|
|
11
15
|
```
|
|
12
16
|
|
|
13
|
-
Add
|
|
17
|
+
### 2. Add Google Fonts
|
|
18
|
+
|
|
19
|
+
Add the following to your `index.html` `<head>`:
|
|
14
20
|
|
|
15
21
|
```html
|
|
16
22
|
<link
|
|
@@ -19,49 +25,99 @@ Add the Google Fonts link to your `index.html`:
|
|
|
19
25
|
/>
|
|
20
26
|
```
|
|
21
27
|
|
|
22
|
-
|
|
28
|
+
### 3. Configure CSS
|
|
29
|
+
|
|
30
|
+
In your main stylesheet (e.g. `src/style.css`):
|
|
23
31
|
|
|
24
32
|
```css
|
|
25
33
|
@import 'tailwindcss';
|
|
26
|
-
@import '@m3ui/vue/theme';
|
|
27
|
-
@import '@m3ui/vue/palettes'; /* optional — 20 color palettes */
|
|
34
|
+
@import '@m3ui-vue/m3ui-vue/theme';
|
|
35
|
+
@import '@m3ui-vue/m3ui-vue/palettes'; /* optional — includes 20 color palettes */
|
|
36
|
+
|
|
37
|
+
/* Required: tells Tailwind to scan the library for class names */
|
|
38
|
+
@source '../node_modules/@m3ui-vue/m3ui-vue';
|
|
28
39
|
```
|
|
29
40
|
|
|
30
|
-
|
|
41
|
+
### 4. Register the Plugin (optional)
|
|
31
42
|
|
|
32
|
-
```
|
|
33
|
-
|
|
43
|
+
```ts
|
|
44
|
+
// main.ts
|
|
45
|
+
import { createApp } from 'vue'
|
|
46
|
+
import { createM3UI } from '@m3ui-vue/m3ui-vue'
|
|
47
|
+
import App from './App.vue'
|
|
48
|
+
|
|
49
|
+
const app = createApp(App)
|
|
50
|
+
app.use(createM3UI({ palette: 'teal' })) // sets initial palette
|
|
51
|
+
app.mount('#app')
|
|
34
52
|
```
|
|
35
53
|
|
|
54
|
+
The plugin is optional — without it the default purple palette is used.
|
|
55
|
+
|
|
36
56
|
## Usage
|
|
37
57
|
|
|
38
58
|
```vue
|
|
39
59
|
<script setup>
|
|
40
|
-
import { MButton, MCard, MTextField, useToast
|
|
60
|
+
import { MButton, MCard, MTextField, useToast } from '@m3ui-vue/m3ui-vue'
|
|
41
61
|
|
|
42
62
|
const toast = useToast()
|
|
63
|
+
const name = ref('')
|
|
43
64
|
</script>
|
|
44
65
|
|
|
45
66
|
<template>
|
|
46
67
|
<MCard>
|
|
47
|
-
<MTextField v-model="name" label="
|
|
48
|
-
<MButton icon="save" @click="toast.success('
|
|
49
|
-
|
|
68
|
+
<MTextField v-model="name" label="Name" />
|
|
69
|
+
<MButton icon="save" @click="toast.success('Saved!')">
|
|
70
|
+
Save
|
|
50
71
|
</MButton>
|
|
51
72
|
</MCard>
|
|
52
73
|
</template>
|
|
53
74
|
```
|
|
54
75
|
|
|
55
|
-
|
|
76
|
+
## Color Palettes
|
|
56
77
|
|
|
57
|
-
|
|
58
|
-
import { createApp } from 'vue'
|
|
59
|
-
import { createM3UI } from '@m3ui/vue'
|
|
78
|
+
M3UI ships with 20 pre-built color palettes, each with light and dark variants:
|
|
60
79
|
|
|
61
|
-
|
|
62
|
-
|
|
80
|
+
`purple` (default), `indigo`, `navy`, `blue`, `cyan`, `teal`, `green`, `lime`, `olive`, `amber`, `sand`, `orange`, `deep-orange`, `brown`, `red`, `coral`, `crimson`, `pink`, `violet`, `slate`
|
|
81
|
+
|
|
82
|
+
### Switching Palettes at Runtime
|
|
83
|
+
|
|
84
|
+
```vue
|
|
85
|
+
<script setup>
|
|
86
|
+
import { useColorPalette } from '@m3ui-vue/m3ui-vue'
|
|
87
|
+
|
|
88
|
+
const { palette, palettes, set } = useColorPalette()
|
|
89
|
+
</script>
|
|
90
|
+
|
|
91
|
+
<template>
|
|
92
|
+
<select @change="set(($event.target as HTMLSelectElement).value)">
|
|
93
|
+
<option v-for="p in palettes" :key="p.id" :value="p.id" :selected="p.id === palette">
|
|
94
|
+
{{ p.label }}
|
|
95
|
+
</option>
|
|
96
|
+
</select>
|
|
97
|
+
</template>
|
|
63
98
|
```
|
|
64
99
|
|
|
100
|
+
The selection is persisted to `localStorage` automatically.
|
|
101
|
+
|
|
102
|
+
## Dark Mode
|
|
103
|
+
|
|
104
|
+
```vue
|
|
105
|
+
<script setup>
|
|
106
|
+
import { useTheme } from '@m3ui-vue/m3ui-vue'
|
|
107
|
+
|
|
108
|
+
const { theme, cycle } = useTheme()
|
|
109
|
+
// theme: 'light' | 'dark' | 'system'
|
|
110
|
+
</script>
|
|
111
|
+
|
|
112
|
+
<template>
|
|
113
|
+
<MButton @click="cycle">
|
|
114
|
+
Theme: {{ theme }}
|
|
115
|
+
</MButton>
|
|
116
|
+
</template>
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
The theme is persisted to `localStorage` and respects `prefers-color-scheme` when set to `system`.
|
|
120
|
+
|
|
65
121
|
## Components
|
|
66
122
|
|
|
67
123
|
### Inputs
|
|
@@ -77,17 +133,20 @@ MAlert, MSnackbar (toast), MDialog, MConfirmDialog, MBottomSheet, MSideSheet, MP
|
|
|
77
133
|
MTabs, MMenu, MMenuItem, MContextMenu, MBreadcrumbs, MStepper, MPagination, MNavigationBar, MNavigationRail, MNavigationDrawer, MTopAppBar, MAppBar, MSegmentedButton
|
|
78
134
|
|
|
79
135
|
### Layout
|
|
80
|
-
MContainer, MGrid, MStack, MSplitter, MMasonry, MDivider
|
|
136
|
+
MContainer, MGrid, MStack, MSplitter, MMasonry, MDivider, MExpansionPanel
|
|
81
137
|
|
|
82
138
|
### Advanced
|
|
83
139
|
MRichTextEditor, MCodeEditor, MJsonEditor, MKanban, MScheduler, MChart, MTerminal, MFileUpload, MTour, MCommandPalette, MSpotlightSearch, MHotkeys, MDragDropList, MTransferList, MInfiniteScroll
|
|
84
140
|
|
|
85
141
|
### Composables
|
|
86
|
-
`useTheme()
|
|
142
|
+
- `useTheme()` — light/dark/system theme with `cycle()`
|
|
143
|
+
- `useColorPalette()` — switch between 20 palettes at runtime
|
|
144
|
+
- `useToast()` — programmatic toast notifications
|
|
145
|
+
- `useFieldBg()` — context-aware field background color
|
|
87
146
|
|
|
88
147
|
## Optional Dependencies
|
|
89
148
|
|
|
90
|
-
Some components require
|
|
149
|
+
Some components require peer packages. Install only what you need:
|
|
91
150
|
|
|
92
151
|
| Component | Install |
|
|
93
152
|
|---|---|
|
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
import { type ChartData, type ChartOptions } from 'chart.js';
|
|
2
1
|
type ChartType = 'line' | 'bar' | 'pie' | 'doughnut' | 'radar';
|
|
3
2
|
type __VLS_Props = {
|
|
4
3
|
type: ChartType;
|
|
5
|
-
data:
|
|
6
|
-
options?:
|
|
4
|
+
data: Record<string, any>;
|
|
5
|
+
options?: Record<string, any>;
|
|
7
6
|
height?: string;
|
|
8
7
|
};
|
|
9
8
|
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
@@ -9,10 +9,10 @@ type __VLS_Slots = {} & {
|
|
|
9
9
|
default?: (props: typeof __VLS_1) => any;
|
|
10
10
|
};
|
|
11
11
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
12
|
-
padding: boolean;
|
|
13
12
|
maxWidth: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "full";
|
|
14
13
|
fluid: boolean;
|
|
15
14
|
centered: boolean;
|
|
15
|
+
padding: boolean;
|
|
16
16
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
17
17
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
18
18
|
declare const _default: typeof __VLS_export;
|
|
@@ -5,10 +5,10 @@ type __VLS_Props = {
|
|
|
5
5
|
minHeight?: string;
|
|
6
6
|
};
|
|
7
7
|
declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
|
|
8
|
-
write: (text: string) =>
|
|
9
|
-
writeln: (text: string) =>
|
|
10
|
-
clear: () =>
|
|
11
|
-
focus: () =>
|
|
8
|
+
write: (text: string) => any;
|
|
9
|
+
writeln: (text: string) => any;
|
|
10
|
+
clear: () => any;
|
|
11
|
+
focus: () => any;
|
|
12
12
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
13
13
|
input: (args_0: string) => any;
|
|
14
14
|
line: (args_0: string) => any;
|
|
@@ -8,8 +8,8 @@ type __VLS_Slots = {} & {
|
|
|
8
8
|
default?: (props: typeof __VLS_1) => any;
|
|
9
9
|
};
|
|
10
10
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
11
|
-
delay: number;
|
|
12
11
|
placement: "top" | "bottom" | "left" | "right";
|
|
12
|
+
delay: number;
|
|
13
13
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
14
14
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
15
15
|
declare const _default: typeof __VLS_export;
|
package/dist/m3ui.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.bs-scrim[data-v-941a89e7]{transition:opacity .3s}.bs-enter-from .bs-scrim[data-v-941a89e7],.bs-leave-to .bs-scrim[data-v-941a89e7]{opacity:0}.bs-panel[data-v-941a89e7]{transition:transform .32s cubic-bezier(.2,0,0,1),opacity .24s}.bs-enter-from .bs-panel[data-v-941a89e7]{opacity:0;transform:translateY(40%)}.bs-leave-to .bs-panel[data-v-941a89e7]{opacity:0;transform:translateY(100%)!important}@keyframes m3-wavy-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes m3-wavy-travel{0%{stroke-dashoffset:0}to{stroke-dashoffset:calc(var(--m3-wave-len) * -1px)}}@media (prefers-reduced-motion:reduce){.animate-\[m3-wavy-spin_2\.8s_linear_infinite\]{animation:2.8s linear infinite m3-wavy-spin}.animate-\[m3-wavy-travel_2s_linear_infinite\]{animation:none!important}}.code-editor-container[data-v-13fd6808] .cm-editor{height:100%;min-height:inherit;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.875rem}.code-editor-container[data-v-13fd6808] .cm-editor.cm-focused{outline:none}.code-editor-container[data-v-13fd6808] .cm-scroller{min-height:inherit}.code-editor-container[data-v-13fd6808] .cm-gutters{background:var(--color-surface-container);border-right:1px solid var(--color-outline-variant);color:var(--color-on-surface-variant)}.code-editor-container[data-v-13fd6808] .cm-activeLineGutter{background:var(--color-surface-container-high)}.code-editor-container[data-v-13fd6808] .cm-activeLine{background:var(--color-surface-container-lowest)}.code-editor-container[data-v-13fd6808] .cm-selectionBackground{background:var(--color-primary-container)!important}.code-editor-container[data-v-13fd6808] .cm-cursor{border-left-color:var(--color-primary)}.code-editor-container[data-v-13fd6808] .cm-matchingBracket{background:var(--color-tertiary-container);color:var(--color-on-tertiary-container)}.code-editor-container[data-v-13fd6808] .cm-foldGutter span{color:var(--color-on-surface-variant)}.hue-slider[data-v-9ee0043f]{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}.hue-slider[data-v-9ee0043f]::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0006}.hue-slider[data-v-9ee0043f]::-moz-range-thumb{cursor:pointer;background:#fff;border:none;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0006}.m3-cmd-enter-active[data-v-da578f14],.m3-cmd-leave-active[data-v-da578f14]{transition:opacity .15s}.m3-cmd-enter-from[data-v-da578f14],.m3-cmd-leave-to[data-v-da578f14]{opacity:0}.m3-cmd-enter-active .cmd-box[data-v-da578f14],.m3-cmd-leave-active .cmd-box[data-v-da578f14]{transition:transform .15s}.m3-cmd-enter-from .cmd-box[data-v-da578f14],.m3-cmd-leave-to .cmd-box[data-v-da578f14]{transform:scale(.95)translateY(-10px)}.m3-dialog-enter-active[data-v-e7dfca29],.m3-dialog-leave-active[data-v-e7dfca29]{transition:opacity .15s}.m3-dialog-enter-from[data-v-e7dfca29],.m3-dialog-leave-to[data-v-e7dfca29]{opacity:0}.m3-dialog-enter-active .dialog-box[data-v-e7dfca29],.m3-dialog-leave-active .dialog-box[data-v-e7dfca29]{transition:transform .15s}.m3-dialog-enter-from .dialog-box[data-v-e7dfca29],.m3-dialog-leave-to .dialog-box[data-v-e7dfca29]{transform:scale(.95)}.expand-grid[data-v-89e4475b]{grid-template-rows:1fr;display:grid}.expand-body[data-v-89e4475b]{min-height:0;overflow:hidden}.expand-enter-active[data-v-89e4475b]{transition:grid-template-rows .28s cubic-bezier(.2,0,0,1)}.expand-enter-active>.expand-body[data-v-89e4475b]{transition:opacity .22s}.expand-enter-from[data-v-89e4475b]{grid-template-rows:0fr}.expand-enter-from>.expand-body[data-v-89e4475b]{opacity:0}.expand-leave-active[data-v-89e4475b]{transition:grid-template-rows .22s cubic-bezier(.4,0,1,1)}.expand-leave-active>.expand-body[data-v-89e4475b]{transition:opacity .15s}.expand-leave-to[data-v-89e4475b]{grid-template-rows:0fr}.expand-leave-to>.expand-body[data-v-89e4475b]{opacity:0}.m3-file-enter-active[data-v-34a862f0],.m3-file-leave-active[data-v-34a862f0]{transition:all .2s}.m3-file-enter-from[data-v-34a862f0],.m3-file-leave-to[data-v-34a862f0]{opacity:0;transform:translateY(-8px)}.m3-markdown[data-v-34ce7e42] h1{font-size:var(--text-headline-large);line-height:var(--text-headline-large--line-height);color:var(--color-on-surface);margin:1em 0 .5em;font-weight:600}.m3-markdown[data-v-34ce7e42] h2{font-size:var(--text-headline-medium);line-height:var(--text-headline-medium--line-height);color:var(--color-on-surface);margin:1em 0 .5em;font-weight:600}.m3-markdown[data-v-34ce7e42] h3{font-size:var(--text-headline-small);line-height:var(--text-headline-small--line-height);color:var(--color-on-surface);margin:.75em 0 .25em;font-weight:600}.m3-markdown[data-v-34ce7e42] h4{font-size:var(--text-title-large);line-height:var(--text-title-large--line-height);color:var(--color-on-surface);margin:.75em 0 .25em;font-weight:600}.m3-markdown[data-v-34ce7e42] p{margin:.5em 0}.m3-markdown[data-v-34ce7e42] a{color:var(--color-primary);text-underline-offset:2px;text-decoration:underline}.m3-markdown[data-v-34ce7e42] a:hover{opacity:.8}.m3-markdown[data-v-34ce7e42] strong{color:var(--color-on-surface);font-weight:600}.m3-markdown[data-v-34ce7e42] em{font-style:italic}.m3-markdown[data-v-34ce7e42] ul,.m3-markdown[data-v-34ce7e42] ol{margin:.5em 0;padding-left:1.5em}.m3-markdown[data-v-34ce7e42] li{margin:.25em 0}.m3-markdown[data-v-34ce7e42] li::marker{color:var(--color-on-surface-variant)}.m3-markdown[data-v-34ce7e42] blockquote{border-left:3px solid var(--color-primary);background:var(--color-surface-container);color:var(--color-on-surface-variant);border-radius:0 8px 8px 0;margin:.75em 0;padding:.5em 1em}.m3-markdown[data-v-34ce7e42] code{background:var(--color-surface-container-highest);color:var(--color-primary);border-radius:4px;padding:.15em .4em;font-family:JetBrains Mono,Fira Code,monospace;font-size:.875em}.m3-markdown[data-v-34ce7e42] pre{background:var(--color-surface-container-highest);border:1px solid var(--color-outline-variant);border-radius:12px;margin:.75em 0;padding:1em;overflow-x:auto}.m3-markdown[data-v-34ce7e42] pre code{color:var(--color-on-surface);background:0 0;padding:0}.m3-markdown[data-v-34ce7e42] hr{border:none;border-top:1px solid var(--color-outline-variant);margin:1.5em 0}.m3-markdown[data-v-34ce7e42] table{border-collapse:collapse;width:100%;margin:.75em 0}.m3-markdown[data-v-34ce7e42] th{background:var(--color-surface-container);text-align:left;border-bottom:2px solid var(--color-outline-variant);font-weight:600;font-size:var(--text-label-large);color:var(--color-on-surface);padding:.5em .75em}.m3-markdown[data-v-34ce7e42] td{border-bottom:1px solid var(--color-outline-variant);padding:.5em .75em}.m3-markdown[data-v-34ce7e42] img{border-radius:12px;max-width:100%;height:auto;margin:.5em 0}.nd-scrim[data-v-98c11a62]{transition:opacity .28s}.nd-enter-from .nd-scrim[data-v-98c11a62],.nd-leave-to .nd-scrim[data-v-98c11a62]{opacity:0}.nd-panel[data-v-98c11a62]{transition:transform .3s cubic-bezier(.2,0,0,1)}.nd-enter-from .nd-panel[data-v-98c11a62],.nd-leave-to .nd-panel[data-v-98c11a62]{transform:translate(-100%)}@keyframes m3-wave-flow{0%{transform:translate(0)}to{transform:translate(-20px)}}@keyframes m3-progress-indeterminate{0%{left:-40%}to{left:100%}}@media (prefers-reduced-motion:reduce){.animate-\[m3-wave-flow_1\.2s_linear_infinite\],.animate-\[m3-wave-flow_0\.9s_linear_infinite\],.animate-\[m3-progress-indeterminate_1\.6s_ease-in-out_infinite\]{animation:none!important}}.m3-radio-dot[data-v-cdb650b5]{transform-box:fill-box;transform-origin:50%;transition:transform .15s;transform:scale(0)}.m3-radio-dot.is-checked[data-v-cdb650b5]{transform:scale(1)}.rte-content[data-v-bff72fc5] .tiptap{min-height:inherit;outline:none}.rte-content[data-v-bff72fc5] .tiptap p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;color:var(--color-on-surface-variant);opacity:.5;pointer-events:none;height:0}.rte-content[data-v-bff72fc5] h1{font-size:var(--text-headline-large);line-height:var(--text-headline-large--line-height);margin:.75em 0 .25em;font-weight:600}.rte-content[data-v-bff72fc5] h2{font-size:var(--text-headline-medium);line-height:var(--text-headline-medium--line-height);margin:.75em 0 .25em;font-weight:600}.rte-content[data-v-bff72fc5] h3{font-size:var(--text-headline-small);line-height:var(--text-headline-small--line-height);margin:.75em 0 .25em;font-weight:600}.rte-content[data-v-bff72fc5] p{margin:.5em 0}.rte-content[data-v-bff72fc5] ul,.rte-content[data-v-bff72fc5] ol{margin:.5em 0;padding-left:1.5em}.rte-content[data-v-bff72fc5] blockquote{border-left:3px solid var(--color-primary);color:var(--color-on-surface-variant);margin:.5em 0;padding-left:1em}.rte-content[data-v-bff72fc5] code{background:var(--color-surface-container-highest);border-radius:4px;padding:.15em .4em;font-size:.875em}.rte-content[data-v-bff72fc5] pre{background:var(--color-surface-container-highest);border-radius:8px;margin:.5em 0;padding:1em;overflow-x:auto}.rte-content[data-v-bff72fc5] pre code{background:0 0;padding:0}.rte-content[data-v-bff72fc5] a{color:var(--color-primary);text-decoration:underline}.rte-content[data-v-bff72fc5] mark{background:var(--color-tertiary-container);color:var(--color-on-tertiary-container);border-radius:2px;padding:.1em .2em}.rte-content[data-v-bff72fc5] img{border-radius:8px;max-width:100%;height:auto;margin:.5em 0}.ss-scrim[data-v-f8751672]{transition:opacity .28s}.ss-enter-from .ss-scrim[data-v-f8751672],.ss-leave-to .ss-scrim[data-v-f8751672]{opacity:0}.ss-panel[data-v-f8751672]{transition:transform .32s cubic-bezier(.2,0,0,1),opacity .24s}.ss-enter-from .ss-panel[data-v-f8751672]{opacity:0;transform:translate(40%)}.ss-leave-to .ss-panel[data-v-f8751672]{opacity:0;transform:translate(100%)!important}@keyframes skeleton-wave-move-32ecf05b{0%{transform:translate(-100%)}60%{transform:translate(100%)}to{transform:translate(100%)}}.skeleton-wave[data-v-32ecf05b]{position:relative;overflow:hidden}.skeleton-wave[data-v-32ecf05b]:after{content:"";background:linear-gradient(90deg, transparent 0%, var(--color-on-surface) 50%, transparent 100%);opacity:.06;animation:1.8s ease-in-out infinite skeleton-wave-move-32ecf05b;position:absolute;inset:0}.toast-row[data-v-e83a5c10]{grid-template-rows:1fr;padding-bottom:8px;display:grid}.toast-row>.toast-inner[data-v-e83a5c10]{min-height:0}.m3-toast-bot-enter-active[data-v-e83a5c10]{transition:grid-template-rows .22s cubic-bezier(.2,0,0,1),padding-bottom .22s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-bot-enter-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .22s cubic-bezier(.2,0,0,1)}.m3-toast-bot-enter-from[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-bot-enter-from>.toast-inner[data-v-e83a5c10]{opacity:0;transform:translateY(20px)scale(.94)}.m3-toast-bot-leave-active[data-v-e83a5c10]{transition:grid-template-rows .3s cubic-bezier(.2,0,0,1),padding-bottom .3s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-bot-leave-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .18s}.m3-toast-bot-leave-to[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-bot-leave-to>.toast-inner[data-v-e83a5c10]{opacity:0;transform:scale(.92)}.m3-toast-top-enter-active[data-v-e83a5c10]{transition:grid-template-rows .22s cubic-bezier(.2,0,0,1),padding-bottom .22s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-top-enter-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .22s cubic-bezier(.2,0,0,1)}.m3-toast-top-enter-from[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-top-enter-from>.toast-inner[data-v-e83a5c10]{opacity:0;transform:translateY(-20px)scale(.94)}.m3-toast-top-leave-active[data-v-e83a5c10]{transition:grid-template-rows .3s cubic-bezier(.2,0,0,1),padding-bottom .3s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-top-leave-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .18s}.m3-toast-top-leave-to[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-top-leave-to>.toast-inner[data-v-e83a5c10]{opacity:0;transform:scale(.92)}@keyframes m3-toast-progress-e83a5c10{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.m3-spot-enter-active[data-v-51b103ff],.m3-spot-leave-active[data-v-51b103ff]{transition:opacity .15s}.m3-spot-enter-from[data-v-51b103ff],.m3-spot-leave-to[data-v-51b103ff]{opacity:0}.m3-spot-enter-active .spot-box[data-v-51b103ff],.m3-spot-leave-active .spot-box[data-v-51b103ff]{transition:transform .15s,opacity .15s}.m3-spot-enter-from .spot-box[data-v-51b103ff]{opacity:0;transform:scale(.96)translateY(-8px)}.m3-spot-leave-to .spot-box[data-v-51b103ff]{opacity:0;transform:scale(.98)}.m3-tour-highlight{box-shadow:0 0 0 4px var(--color-primary), 0 0 0 9999px #0006;border-radius:8px;position:relative;z-index:101!important}.m3-tour-enter-active,.m3-tour-leave-active{transition:opacity .2s}.m3-tour-enter-from,.m3-tour-leave-to{opacity:0}
|
|
1
|
+
.bs-scrim[data-v-941a89e7]{transition:opacity .3s}.bs-enter-from .bs-scrim[data-v-941a89e7],.bs-leave-to .bs-scrim[data-v-941a89e7]{opacity:0}.bs-panel[data-v-941a89e7]{transition:transform .32s cubic-bezier(.2,0,0,1),opacity .24s}.bs-enter-from .bs-panel[data-v-941a89e7]{opacity:0;transform:translateY(40%)}.bs-leave-to .bs-panel[data-v-941a89e7]{opacity:0;transform:translateY(100%)!important}@keyframes m3-wavy-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes m3-wavy-travel{0%{stroke-dashoffset:0}to{stroke-dashoffset:calc(var(--m3-wave-len) * -1px)}}@media (prefers-reduced-motion:reduce){.animate-\[m3-wavy-spin_2\.8s_linear_infinite\]{animation:2.8s linear infinite m3-wavy-spin}.animate-\[m3-wavy-travel_2s_linear_infinite\]{animation:none!important}}.code-editor-container[data-v-5274a428] .cm-editor{height:100%;min-height:inherit;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.875rem}.code-editor-container[data-v-5274a428] .cm-editor.cm-focused{outline:none}.code-editor-container[data-v-5274a428] .cm-scroller{min-height:inherit}.code-editor-container[data-v-5274a428] .cm-gutters{background:var(--color-surface-container);border-right:1px solid var(--color-outline-variant);color:var(--color-on-surface-variant)}.code-editor-container[data-v-5274a428] .cm-activeLineGutter{background:var(--color-surface-container-high)}.code-editor-container[data-v-5274a428] .cm-activeLine{background:var(--color-surface-container-lowest)}.code-editor-container[data-v-5274a428] .cm-selectionBackground{background:var(--color-primary-container)!important}.code-editor-container[data-v-5274a428] .cm-cursor{border-left-color:var(--color-primary)}.code-editor-container[data-v-5274a428] .cm-matchingBracket{background:var(--color-tertiary-container);color:var(--color-on-tertiary-container)}.code-editor-container[data-v-5274a428] .cm-foldGutter span{color:var(--color-on-surface-variant)}.hue-slider[data-v-9ee0043f]{background:linear-gradient(90deg,red 0%,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}.hue-slider[data-v-9ee0043f]::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0006}.hue-slider[data-v-9ee0043f]::-moz-range-thumb{cursor:pointer;background:#fff;border:none;border-radius:50%;width:16px;height:16px;box-shadow:0 1px 3px #0006}.m3-cmd-enter-active[data-v-da578f14],.m3-cmd-leave-active[data-v-da578f14]{transition:opacity .15s}.m3-cmd-enter-from[data-v-da578f14],.m3-cmd-leave-to[data-v-da578f14]{opacity:0}.m3-cmd-enter-active .cmd-box[data-v-da578f14],.m3-cmd-leave-active .cmd-box[data-v-da578f14]{transition:transform .15s}.m3-cmd-enter-from .cmd-box[data-v-da578f14],.m3-cmd-leave-to .cmd-box[data-v-da578f14]{transform:scale(.95)translateY(-10px)}.m3-dialog-enter-active[data-v-e7dfca29],.m3-dialog-leave-active[data-v-e7dfca29]{transition:opacity .15s}.m3-dialog-enter-from[data-v-e7dfca29],.m3-dialog-leave-to[data-v-e7dfca29]{opacity:0}.m3-dialog-enter-active .dialog-box[data-v-e7dfca29],.m3-dialog-leave-active .dialog-box[data-v-e7dfca29]{transition:transform .15s}.m3-dialog-enter-from .dialog-box[data-v-e7dfca29],.m3-dialog-leave-to .dialog-box[data-v-e7dfca29]{transform:scale(.95)}.expand-grid[data-v-89e4475b]{grid-template-rows:1fr;display:grid}.expand-body[data-v-89e4475b]{min-height:0;overflow:hidden}.expand-enter-active[data-v-89e4475b]{transition:grid-template-rows .28s cubic-bezier(.2,0,0,1)}.expand-enter-active>.expand-body[data-v-89e4475b]{transition:opacity .22s}.expand-enter-from[data-v-89e4475b]{grid-template-rows:0fr}.expand-enter-from>.expand-body[data-v-89e4475b]{opacity:0}.expand-leave-active[data-v-89e4475b]{transition:grid-template-rows .22s cubic-bezier(.4,0,1,1)}.expand-leave-active>.expand-body[data-v-89e4475b]{transition:opacity .15s}.expand-leave-to[data-v-89e4475b]{grid-template-rows:0fr}.expand-leave-to>.expand-body[data-v-89e4475b]{opacity:0}.m3-file-enter-active[data-v-34a862f0],.m3-file-leave-active[data-v-34a862f0]{transition:all .2s}.m3-file-enter-from[data-v-34a862f0],.m3-file-leave-to[data-v-34a862f0]{opacity:0;transform:translateY(-8px)}.m3-markdown[data-v-6e4dc2b6] h1{font-size:var(--text-headline-large);line-height:var(--text-headline-large--line-height);color:var(--color-on-surface);margin:1em 0 .5em;font-weight:600}.m3-markdown[data-v-6e4dc2b6] h2{font-size:var(--text-headline-medium);line-height:var(--text-headline-medium--line-height);color:var(--color-on-surface);margin:1em 0 .5em;font-weight:600}.m3-markdown[data-v-6e4dc2b6] h3{font-size:var(--text-headline-small);line-height:var(--text-headline-small--line-height);color:var(--color-on-surface);margin:.75em 0 .25em;font-weight:600}.m3-markdown[data-v-6e4dc2b6] h4{font-size:var(--text-title-large);line-height:var(--text-title-large--line-height);color:var(--color-on-surface);margin:.75em 0 .25em;font-weight:600}.m3-markdown[data-v-6e4dc2b6] p{margin:.5em 0}.m3-markdown[data-v-6e4dc2b6] a{color:var(--color-primary);text-underline-offset:2px;text-decoration:underline}.m3-markdown[data-v-6e4dc2b6] a:hover{opacity:.8}.m3-markdown[data-v-6e4dc2b6] strong{color:var(--color-on-surface);font-weight:600}.m3-markdown[data-v-6e4dc2b6] em{font-style:italic}.m3-markdown[data-v-6e4dc2b6] ul,.m3-markdown[data-v-6e4dc2b6] ol{margin:.5em 0;padding-left:1.5em}.m3-markdown[data-v-6e4dc2b6] li{margin:.25em 0}.m3-markdown[data-v-6e4dc2b6] li::marker{color:var(--color-on-surface-variant)}.m3-markdown[data-v-6e4dc2b6] blockquote{border-left:3px solid var(--color-primary);background:var(--color-surface-container);color:var(--color-on-surface-variant);border-radius:0 8px 8px 0;margin:.75em 0;padding:.5em 1em}.m3-markdown[data-v-6e4dc2b6] code{background:var(--color-surface-container-highest);color:var(--color-primary);border-radius:4px;padding:.15em .4em;font-family:JetBrains Mono,Fira Code,monospace;font-size:.875em}.m3-markdown[data-v-6e4dc2b6] pre{background:var(--color-surface-container-highest);border:1px solid var(--color-outline-variant);border-radius:12px;margin:.75em 0;padding:1em;overflow-x:auto}.m3-markdown[data-v-6e4dc2b6] pre code{color:var(--color-on-surface);background:0 0;padding:0}.m3-markdown[data-v-6e4dc2b6] hr{border:none;border-top:1px solid var(--color-outline-variant);margin:1.5em 0}.m3-markdown[data-v-6e4dc2b6] table{border-collapse:collapse;width:100%;margin:.75em 0}.m3-markdown[data-v-6e4dc2b6] th{background:var(--color-surface-container);text-align:left;border-bottom:2px solid var(--color-outline-variant);font-weight:600;font-size:var(--text-label-large);color:var(--color-on-surface);padding:.5em .75em}.m3-markdown[data-v-6e4dc2b6] td{border-bottom:1px solid var(--color-outline-variant);padding:.5em .75em}.m3-markdown[data-v-6e4dc2b6] img{border-radius:12px;max-width:100%;height:auto;margin:.5em 0}.nd-scrim[data-v-98c11a62]{transition:opacity .28s}.nd-enter-from .nd-scrim[data-v-98c11a62],.nd-leave-to .nd-scrim[data-v-98c11a62]{opacity:0}.nd-panel[data-v-98c11a62]{transition:transform .3s cubic-bezier(.2,0,0,1)}.nd-enter-from .nd-panel[data-v-98c11a62],.nd-leave-to .nd-panel[data-v-98c11a62]{transform:translate(-100%)}@keyframes m3-wave-flow{0%{transform:translate(0)}to{transform:translate(-20px)}}@keyframes m3-progress-indeterminate{0%{left:-40%}to{left:100%}}@media (prefers-reduced-motion:reduce){.animate-\[m3-wave-flow_1\.2s_linear_infinite\],.animate-\[m3-wave-flow_0\.9s_linear_infinite\],.animate-\[m3-progress-indeterminate_1\.6s_ease-in-out_infinite\]{animation:none!important}}.m3-radio-dot[data-v-cdb650b5]{transform-box:fill-box;transform-origin:50%;transition:transform .15s;transform:scale(0)}.m3-radio-dot.is-checked[data-v-cdb650b5]{transform:scale(1)}.rte-content[data-v-89c08c83] .tiptap{min-height:inherit;outline:none}.rte-content[data-v-89c08c83] .tiptap p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;color:var(--color-on-surface-variant);opacity:.5;pointer-events:none;height:0}.rte-content[data-v-89c08c83] h1{font-size:var(--text-headline-large);line-height:var(--text-headline-large--line-height);margin:.75em 0 .25em;font-weight:600}.rte-content[data-v-89c08c83] h2{font-size:var(--text-headline-medium);line-height:var(--text-headline-medium--line-height);margin:.75em 0 .25em;font-weight:600}.rte-content[data-v-89c08c83] h3{font-size:var(--text-headline-small);line-height:var(--text-headline-small--line-height);margin:.75em 0 .25em;font-weight:600}.rte-content[data-v-89c08c83] p{margin:.5em 0}.rte-content[data-v-89c08c83] ul,.rte-content[data-v-89c08c83] ol{margin:.5em 0;padding-left:1.5em}.rte-content[data-v-89c08c83] blockquote{border-left:3px solid var(--color-primary);color:var(--color-on-surface-variant);margin:.5em 0;padding-left:1em}.rte-content[data-v-89c08c83] code{background:var(--color-surface-container-highest);border-radius:4px;padding:.15em .4em;font-size:.875em}.rte-content[data-v-89c08c83] pre{background:var(--color-surface-container-highest);border-radius:8px;margin:.5em 0;padding:1em;overflow-x:auto}.rte-content[data-v-89c08c83] pre code{background:0 0;padding:0}.rte-content[data-v-89c08c83] a{color:var(--color-primary);text-decoration:underline}.rte-content[data-v-89c08c83] mark{background:var(--color-tertiary-container);color:var(--color-on-tertiary-container);border-radius:2px;padding:.1em .2em}.rte-content[data-v-89c08c83] img{border-radius:8px;max-width:100%;height:auto;margin:.5em 0}.ss-scrim[data-v-f8751672]{transition:opacity .28s}.ss-enter-from .ss-scrim[data-v-f8751672],.ss-leave-to .ss-scrim[data-v-f8751672]{opacity:0}.ss-panel[data-v-f8751672]{transition:transform .32s cubic-bezier(.2,0,0,1),opacity .24s}.ss-enter-from .ss-panel[data-v-f8751672]{opacity:0;transform:translate(40%)}.ss-leave-to .ss-panel[data-v-f8751672]{opacity:0;transform:translate(100%)!important}@keyframes skeleton-wave-move-32ecf05b{0%{transform:translate(-100%)}60%{transform:translate(100%)}to{transform:translate(100%)}}.skeleton-wave[data-v-32ecf05b]{position:relative;overflow:hidden}.skeleton-wave[data-v-32ecf05b]:after{content:"";background:linear-gradient(90deg, transparent 0%, var(--color-on-surface) 50%, transparent 100%);opacity:.06;animation:1.8s ease-in-out infinite skeleton-wave-move-32ecf05b;position:absolute;inset:0}.toast-row[data-v-e83a5c10]{grid-template-rows:1fr;padding-bottom:8px;display:grid}.toast-row>.toast-inner[data-v-e83a5c10]{min-height:0}.m3-toast-bot-enter-active[data-v-e83a5c10]{transition:grid-template-rows .22s cubic-bezier(.2,0,0,1),padding-bottom .22s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-bot-enter-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .22s cubic-bezier(.2,0,0,1)}.m3-toast-bot-enter-from[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-bot-enter-from>.toast-inner[data-v-e83a5c10]{opacity:0;transform:translateY(20px)scale(.94)}.m3-toast-bot-leave-active[data-v-e83a5c10]{transition:grid-template-rows .3s cubic-bezier(.2,0,0,1),padding-bottom .3s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-bot-leave-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .18s}.m3-toast-bot-leave-to[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-bot-leave-to>.toast-inner[data-v-e83a5c10]{opacity:0;transform:scale(.92)}.m3-toast-top-enter-active[data-v-e83a5c10]{transition:grid-template-rows .22s cubic-bezier(.2,0,0,1),padding-bottom .22s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-top-enter-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .22s cubic-bezier(.2,0,0,1)}.m3-toast-top-enter-from[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-top-enter-from>.toast-inner[data-v-e83a5c10]{opacity:0;transform:translateY(-20px)scale(.94)}.m3-toast-top-leave-active[data-v-e83a5c10]{transition:grid-template-rows .3s cubic-bezier(.2,0,0,1),padding-bottom .3s cubic-bezier(.2,0,0,1);overflow:hidden}.m3-toast-top-leave-active>.toast-inner[data-v-e83a5c10]{transition:opacity .18s,transform .18s}.m3-toast-top-leave-to[data-v-e83a5c10]{grid-template-rows:0fr;padding-bottom:0}.m3-toast-top-leave-to>.toast-inner[data-v-e83a5c10]{opacity:0;transform:scale(.92)}@keyframes m3-toast-progress-e83a5c10{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.m3-spot-enter-active[data-v-51b103ff],.m3-spot-leave-active[data-v-51b103ff]{transition:opacity .15s}.m3-spot-enter-from[data-v-51b103ff],.m3-spot-leave-to[data-v-51b103ff]{opacity:0}.m3-spot-enter-active .spot-box[data-v-51b103ff],.m3-spot-leave-active .spot-box[data-v-51b103ff]{transition:transform .15s,opacity .15s}.m3-spot-enter-from .spot-box[data-v-51b103ff]{opacity:0;transform:scale(.96)translateY(-8px)}.m3-spot-leave-to .spot-box[data-v-51b103ff]{opacity:0;transform:scale(.98)}.m3-tour-highlight{box-shadow:0 0 0 4px var(--color-primary), 0 0 0 9999px #0006;border-radius:8px;position:relative;z-index:101!important}.m3-tour-enter-active,.m3-tour-leave-active{transition:opacity .2s}.m3-tour-enter-from,.m3-tour-leave-to{opacity:0}
|
|
2
2
|
/*$vite$:1*/
|