ketekny-ui-kit 1.0.39 → 1.0.40
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/package.json +1 -1
- package/src/ui/kConfirmDialog.vue +2 -2
- package/src/ui/kDialog.vue +7 -7
package/package.json
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
<Teleport to="body">
|
|
3
3
|
<Transition name="fade">
|
|
4
4
|
<div v-if="visible" class="fixed inset-0 flex items-center justify-center bg-black bg-opacity-40" style="z-index: 1500">
|
|
5
|
-
<div class="w-full max-w-md p-6 bg-white border rounded-lg shadow-xl border-primary/20 dark:bg-
|
|
5
|
+
<div class="w-full max-w-md p-6 bg-white border rounded-lg shadow-xl border-primary/20 dark:bg-zinc-900 dark:border-zinc-800">
|
|
6
6
|
<h2 class="mb-2 text-lg font-semibold text-primary">{{ title }}</h2>
|
|
7
|
-
<div class="mb-6 text-gray-700 dark:text-
|
|
7
|
+
<div class="mb-6 text-gray-700 dark:text-zinc-300"><span v-html="message" /></div>
|
|
8
8
|
<div class="flex justify-end gap-3">
|
|
9
9
|
<kButton :disabled="loading" secondary label="Άκυρο" @click="cancel" />
|
|
10
10
|
<kButton :loading="loading" danger label="Συνέχεια" @click="confirm" />
|
package/src/ui/kDialog.vue
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
<transition name="dialog">
|
|
9
9
|
<div
|
|
10
10
|
ref="dialogPanel"
|
|
11
|
-
class="relative bg-white dark:bg-
|
|
11
|
+
class="relative bg-white dark:bg-zinc-900 shadow-lg overflow-hidden rounded-2xl flex flex-col max-h-[calc(100dvh-1rem)] sm:max-h-[90vh] m-2 sm:m-4"
|
|
12
12
|
:class="dialogClasses"
|
|
13
13
|
:role="'dialog'"
|
|
14
14
|
:aria-modal="'true'"
|
|
@@ -17,16 +17,16 @@
|
|
|
17
17
|
v-show="visible"
|
|
18
18
|
>
|
|
19
19
|
<!-- Header -->
|
|
20
|
-
<div class="flex flex-row items-center
|
|
21
|
-
<div :id="titleId" class="text-
|
|
20
|
+
<div class="flex flex-row items-center px-4 py-3 border-b border-primary/20 bg-primary/5 dark:bg-primary/10 shrink-0">
|
|
21
|
+
<div :id="titleId" class="text-sm font-semibold text-primary sm:text-base">{{ title }}</div>
|
|
22
22
|
<div class="flex-1" />
|
|
23
23
|
<button
|
|
24
24
|
type="button"
|
|
25
|
-
class="p-1
|
|
25
|
+
class="p-1.5 rounded-md text-zinc-400 hover:text-primary dark:text-zinc-500 dark:hover:text-primary hover:bg-primary/10 transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50"
|
|
26
26
|
aria-label="Close dialog"
|
|
27
27
|
@click="close"
|
|
28
28
|
>
|
|
29
|
-
<X />
|
|
29
|
+
<X class="w-5 h-5" />
|
|
30
30
|
</button>
|
|
31
31
|
</div>
|
|
32
32
|
|
|
@@ -36,14 +36,14 @@
|
|
|
36
36
|
</div>
|
|
37
37
|
|
|
38
38
|
<!-- Scrollable slot content -->
|
|
39
|
-
<div class="flex-1 p-3 overflow-auto
|
|
39
|
+
<div class="flex-1 p-3 overflow-auto sm:p-4">
|
|
40
40
|
<slot></slot>
|
|
41
41
|
</div>
|
|
42
42
|
|
|
43
43
|
<!-- Footer -->
|
|
44
44
|
<div
|
|
45
45
|
v-if="$slots.footer"
|
|
46
|
-
class="flex flex-col-reverse gap-2 p-3 border-t shrink-0 border-
|
|
46
|
+
class="flex flex-col-reverse gap-2 p-3 border-t shrink-0 border-zinc-200 dark:border-zinc-800 sm:flex-row sm:justify-end sm:p-4"
|
|
47
47
|
>
|
|
48
48
|
<slot name="footer"></slot>
|
|
49
49
|
</div>
|