@vueless/storybook 0.0.46 → 0.0.48
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/.storybook/index.css +82 -0
- package/.storybook/preview.js +3 -1
- package/package.json +1 -1
package/.storybook/index.css
CHANGED
|
@@ -73,6 +73,84 @@ body {
|
|
|
73
73
|
@apply rounded-lg outline outline-1 outline-gray-700 overflow-hidden;
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
+
/* -------------------- Storybook preview skeleton -------------------- */
|
|
77
|
+
|
|
78
|
+
.light .sb-preparing-docs,
|
|
79
|
+
.light .sb-preparing-story {
|
|
80
|
+
@apply bg-gray-50;
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
.light .sb-previewBlock {
|
|
84
|
+
@apply bg-white border-gray-200 rounded-lg;
|
|
85
|
+
box-shadow: none !important;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.light .sb-previewBlock_header {
|
|
89
|
+
@apply border-solid border-b !border-b-gray-200;
|
|
90
|
+
box-shadow: none !important;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.light .sb-previewBlock_icon {
|
|
94
|
+
@apply bg-gray-300;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.light .sb-argstableBlock-body {
|
|
98
|
+
@apply rounded;
|
|
99
|
+
box-shadow: rgb(0 0 0 / 5%) 0 1px 3px 1px, rgb(0 0 0 / 4%) 0 0 0 1px;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
.light .sb-argstableBlock-body td {
|
|
103
|
+
@apply bg-white border-solid border-b !border-b-gray-200;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.light .sb-argstableBlock-body tr:last-child td {
|
|
107
|
+
@apply border-b-0;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.light .sb-argstableBlock span,
|
|
111
|
+
.light .sb-argstableBlock button {
|
|
112
|
+
@apply bg-gray-200;
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
.dark .sb-preparing-docs,
|
|
118
|
+
.dark .sb-preparing-story {
|
|
119
|
+
@apply bg-gray-950;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.dark .sb-previewBlock {
|
|
123
|
+
@apply bg-gray-900 border-gray-800 rounded-lg;
|
|
124
|
+
box-shadow: none !important;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.dark .sb-previewBlock_header {
|
|
128
|
+
@apply border-solid border-b !border-b-gray-800;
|
|
129
|
+
box-shadow: none !important;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.dark .sb-previewBlock_icon {
|
|
133
|
+
@apply bg-gray-700;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.dark .sb-argstableBlock-body {
|
|
137
|
+
@apply rounded;
|
|
138
|
+
box-shadow: rgb(255 255 255 / 10%) 0 1px 3px 1px, rgb(255 255 255 / 7%) 0 0 0 1px;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
.dark .sb-argstableBlock-body td {
|
|
142
|
+
@apply bg-gray-900 border-solid border-b !border-b-gray-800;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.dark .sb-argstableBlock-body tr:last-child td {
|
|
146
|
+
@apply border-b-0;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
.dark .sb-argstableBlock span,
|
|
150
|
+
.dark .sb-argstableBlock button {
|
|
151
|
+
@apply bg-gray-700;
|
|
152
|
+
}
|
|
153
|
+
|
|
76
154
|
/* -------------------- All docs block -------------------- */
|
|
77
155
|
|
|
78
156
|
.dark .sbdocs {
|
|
@@ -81,6 +159,10 @@ body {
|
|
|
81
159
|
|
|
82
160
|
/* -------------------- Main story -------------------- */
|
|
83
161
|
|
|
162
|
+
.sb-anchor {
|
|
163
|
+
@apply mt-2;
|
|
164
|
+
}
|
|
165
|
+
|
|
84
166
|
.sb-bar,
|
|
85
167
|
.docs-story {
|
|
86
168
|
@apply bg-white;
|
package/.storybook/preview.js
CHANGED
|
@@ -15,10 +15,12 @@ import { createVueless } from "vueless";
|
|
|
15
15
|
import { createRouter, createWebHistory } from "vue-router";
|
|
16
16
|
|
|
17
17
|
/* Setup storybook */
|
|
18
|
-
setup((app) => {
|
|
18
|
+
setup((app, storyContext) => {
|
|
19
19
|
const vueless = createVueless();
|
|
20
20
|
const router = createRouter({ history: createWebHistory(), routes: [] });
|
|
21
21
|
|
|
22
|
+
app.config.idPrefix = storyContext.id;
|
|
23
|
+
|
|
22
24
|
if (!app._context.config.globalProperties.$route) {
|
|
23
25
|
app.use(router);
|
|
24
26
|
app.use(vueless);
|