@wpic/ui 0.3.8 → 0.3.9
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/dist/components/WCard.vue.d.ts +2 -0
- package/dist/wpic-ui.cjs +1 -1
- package/dist/wpic-ui.css +15 -0
- package/dist/wpic-ui.js +7 -6
- package/package.json +1 -1
- package/src/style.css +15 -0
package/dist/wpic-ui.css
CHANGED
|
@@ -64,6 +64,21 @@
|
|
|
64
64
|
.wpic-card--borderless {
|
|
65
65
|
border: 0;
|
|
66
66
|
}
|
|
67
|
+
.wpic-card--padding-sm { --wpic-card-padding-x: 0.75rem; --wpic-card-padding-y: 0.75rem; }
|
|
68
|
+
.wpic-card--padding-md { --wpic-card-padding-x: 1rem; --wpic-card-padding-y: 1rem; }
|
|
69
|
+
.wpic-card--padding-lg { --wpic-card-padding-x: 1.5rem; --wpic-card-padding-y: 1.5rem; }
|
|
70
|
+
.wpic-card__header {
|
|
71
|
+
padding: 0.75rem var(--wpic-card-padding-x);
|
|
72
|
+
}
|
|
73
|
+
.wpic-card__body--padded {
|
|
74
|
+
padding: var(--wpic-card-padding-y) var(--wpic-card-padding-x);
|
|
75
|
+
}
|
|
76
|
+
.wpic-card__empty {
|
|
77
|
+
padding: 1.5rem var(--wpic-card-padding-x);
|
|
78
|
+
}
|
|
79
|
+
.wpic-card__footer {
|
|
80
|
+
padding: 0.75rem var(--wpic-card-padding-x);
|
|
81
|
+
}
|
|
67
82
|
.wpic-card__header--divided {
|
|
68
83
|
border-bottom: 1px solid var(--border-subtle);
|
|
69
84
|
}
|
package/dist/wpic-ui.js
CHANGED
|
@@ -3225,10 +3225,10 @@ const h0 = /* @__PURE__ */ U1(b4, [["render", x4]]), y4 = ["disabled"], C2 = /*
|
|
|
3225
3225
|
}
|
|
3226
3226
|
}), y6 = { class: "font-medium text-zinc-800 dark:text-zinc-200 flex-1 min-w-0 truncate" }, w6 = {
|
|
3227
3227
|
key: 2,
|
|
3228
|
-
class: "wpic-card__empty
|
|
3228
|
+
class: "wpic-card__empty flex items-center gap-2 text-zinc-400 dark:text-zinc-500"
|
|
3229
3229
|
}, M6 = {
|
|
3230
3230
|
key: 3,
|
|
3231
|
-
class: "wpic-card__footer
|
|
3231
|
+
class: "wpic-card__footer"
|
|
3232
3232
|
}, Jt = /* @__PURE__ */ J({
|
|
3233
3233
|
__name: "WCard",
|
|
3234
3234
|
props: {
|
|
@@ -3237,15 +3237,16 @@ const h0 = /* @__PURE__ */ U1(b4, [["render", x4]]), y4 = ["disabled"], C2 = /*
|
|
|
3237
3237
|
noPadding: { type: Boolean },
|
|
3238
3238
|
bodyClass: {},
|
|
3239
3239
|
borderless: { type: Boolean },
|
|
3240
|
-
headerDivider: { type: Boolean }
|
|
3240
|
+
headerDivider: { type: Boolean },
|
|
3241
|
+
padding: {}
|
|
3241
3242
|
},
|
|
3242
3243
|
setup(n) {
|
|
3243
3244
|
return (v, c) => (e(), t("div", {
|
|
3244
|
-
class: g(["wpic-card rounded-xl bg-zinc-50 dark:bg-zinc-800/60 overflow-hidden", n.borderless ? "wpic-card--borderless" : "wpic-card--bordered"])
|
|
3245
|
+
class: g(["wpic-card rounded-xl bg-zinc-50 dark:bg-zinc-800/60 overflow-hidden", `wpic-card--padding-${n.padding ?? "md"}`, n.borderless ? "wpic-card--borderless" : "wpic-card--bordered"])
|
|
3245
3246
|
}, [
|
|
3246
3247
|
v.$slots.icon || v.$slots.title || n.title || v.$slots.actions ? (e(), t("div", {
|
|
3247
3248
|
key: 0,
|
|
3248
|
-
class: g(["wpic-card__header
|
|
3249
|
+
class: g(["wpic-card__header flex items-center gap-2", n.headerDivider === !1 ? "wpic-card__header--undivided" : "wpic-card__header--divided"])
|
|
3249
3250
|
}, [
|
|
3250
3251
|
Q(v.$slots, "icon"),
|
|
3251
3252
|
l("span", y6, [
|
|
@@ -3259,7 +3260,7 @@ const h0 = /* @__PURE__ */ U1(b4, [["render", x4]]), y4 = ["disabled"], C2 = /*
|
|
|
3259
3260
|
Q(v.$slots, "empty")
|
|
3260
3261
|
])) : (e(), t("div", {
|
|
3261
3262
|
key: 1,
|
|
3262
|
-
class: g(["wpic-card__body", n.noPadding ? "" : n.bodyClass ?? "
|
|
3263
|
+
class: g(["wpic-card__body", n.noPadding ? "" : n.bodyClass ?? "wpic-card__body--padded"])
|
|
3263
3264
|
}, [
|
|
3264
3265
|
Q(v.$slots, "default")
|
|
3265
3266
|
], 2)),
|
package/package.json
CHANGED
package/src/style.css
CHANGED
|
@@ -64,6 +64,21 @@
|
|
|
64
64
|
.wpic-card--borderless {
|
|
65
65
|
border: 0;
|
|
66
66
|
}
|
|
67
|
+
.wpic-card--padding-sm { --wpic-card-padding-x: 0.75rem; --wpic-card-padding-y: 0.75rem; }
|
|
68
|
+
.wpic-card--padding-md { --wpic-card-padding-x: 1rem; --wpic-card-padding-y: 1rem; }
|
|
69
|
+
.wpic-card--padding-lg { --wpic-card-padding-x: 1.5rem; --wpic-card-padding-y: 1.5rem; }
|
|
70
|
+
.wpic-card__header {
|
|
71
|
+
padding: 0.75rem var(--wpic-card-padding-x);
|
|
72
|
+
}
|
|
73
|
+
.wpic-card__body--padded {
|
|
74
|
+
padding: var(--wpic-card-padding-y) var(--wpic-card-padding-x);
|
|
75
|
+
}
|
|
76
|
+
.wpic-card__empty {
|
|
77
|
+
padding: 1.5rem var(--wpic-card-padding-x);
|
|
78
|
+
}
|
|
79
|
+
.wpic-card__footer {
|
|
80
|
+
padding: 0.75rem var(--wpic-card-padding-x);
|
|
81
|
+
}
|
|
67
82
|
.wpic-card__header--divided {
|
|
68
83
|
border-bottom: 1px solid var(--border-subtle);
|
|
69
84
|
}
|