Skip to content

Commit c90758b

Browse files
committed
update Tailwind example
1 parent cfb0940 commit c90758b

File tree

2 files changed

+40
-5
lines changed

2 files changed

+40
-5
lines changed

docs/content/en/examples/tailwind.md

Lines changed: 33 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,39 @@ See [Tailwind Examples Source Code](https://github.com/hunterliu1003/vue-final-m
1212

1313
<tailwind-simple></tailwind-simple>
1414

15+
<show-code>
16+
17+
```vue
18+
<template>
19+
<div>
20+
<vue-final-modal
21+
v-model="showModal"
22+
classes="flex justify-center items-center"
23+
content-class="max-h-1/2 p-4 bg-white dark:bg-gray-900 border dark:border-gray-800 rounded overflow-auto"
24+
>
25+
<span class="text-2xl mb-2">Hello, world!</span>
26+
</vue-final-modal>
27+
<button @click="showModal = true">Simple</button>
28+
</div>
29+
</template>
30+
31+
<script>
32+
export default {
33+
data: () => ({
34+
showModal: false
35+
})
36+
}
37+
</script>
38+
39+
<style scoped>
40+
button {
41+
@apply mb-2 px-2 py-1 border rounded;
42+
}
43+
</style>
44+
```
45+
46+
</show-code>
47+
1548
## Set lockScroll to `false`
1649

1750
<tailwind-lock-scroll></tailwind-lock-scroll>
@@ -40,14 +73,10 @@ See [Tailwind Examples Source Code](https://github.com/hunterliu1003/vue-final-m
4073

4174
<tailwind-attach></tailwind-attach>
4275

43-
4476
## Custom vue-final-modal component
4577

46-
4778
TBD
4879

49-
5080
## Override style
5181

52-
5382
TBD

example/src/components/tailwind/TailwindSimple.vue

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
>
88
<span class="text-2xl mb-2">Hello, world!</span>
99
</vue-final-modal>
10-
<base-button @click="showModal = true">Simple</base-button>
10+
<button @click="showModal = true">Simple</button>
1111
</div>
1212
</template>
1313

@@ -18,3 +18,9 @@ export default {
1818
})
1919
}
2020
</script>
21+
22+
<style scoped>
23+
button {
24+
@apply mb-2 px-2 py-1 border rounded;
25+
}
26+
</style>

0 commit comments

Comments
 (0)