Skip to content

Commit dc158cb

Browse files
wazeercwazeerc
authored
Merge branch 'themesberg:main' into feature/spinner-progress/custom-colors
2 parents df7c59a + c9c3f19 commit dc158cb

File tree

16 files changed

+137
-74
lines changed

16 files changed

+137
-74
lines changed

‎docs/components/button-group.md‎

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -80,21 +80,11 @@ You can also mix buttons with dropdowns inside the button group.
8080
</fwb-dropdown>
8181
<fwb-dropdown text="Dropdown with list">
8282
<fwb-list-group>
83-
<fwb-list-group-item hover>
84-
<a href="#">These</a>
85-
</fwb-list-group-item>
86-
<fwb-list-group-item hover>
87-
<a href="#">are</a>
88-
</fwb-list-group-item>
89-
<fwb-list-group-item hover>
90-
<a href="#">some</a>
91-
</fwb-list-group-item>
92-
<fwb-list-group-item hover>
93-
<a href="#">list</a>
94-
</fwb-list-group-item>
95-
<fwb-list-group-item hover>
96-
<a href="#">items</a>
97-
</fwb-list-group-item>
83+
<fwb-list-group-item href="#"> These </fwb-list-group-item>
84+
<fwb-list-group-item href="#"> are </fwb-list-group-item>
85+
<fwb-list-group-item href="#"> some </fwb-list-group-item>
86+
<fwb-list-group-item href="#"> list </fwb-list-group-item>
87+
<fwb-list-group-item href="#"> items </fwb-list-group-item>
9888
</fwb-list-group>
9989
</fwb-dropdown>
10090
</fwb-button-group>

‎docs/components/buttonGroup/examples/FwbButtonGroupExampleDropdown.vue‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,20 +10,20 @@
1010
</fwb-dropdown>
1111
<fwb-dropdown text="Dropdown with list">
1212
<fwb-list-group>
13-
<fwb-list-group-item hover>
14-
<a href="#">These</a>
13+
<fwb-list-group-item href="#">
14+
These
1515
</fwb-list-group-item>
16-
<fwb-list-group-item hover>
17-
<a href="#">are</a>
16+
<fwb-list-group-item href="#">
17+
are
1818
</fwb-list-group-item>
19-
<fwb-list-group-item hover>
20-
<a href="#">some</a>
19+
<fwb-list-group-item href="#">
20+
some
2121
</fwb-list-group-item>
22-
<fwb-list-group-item hover>
23-
<a href="#">list</a>
22+
<fwb-list-group-item href="#">
23+
list
2424
</fwb-list-group-item>
25-
<fwb-list-group-item hover>
26-
<a href="#">items</a>
25+
<fwb-list-group-item href="#">
26+
items
2727
</fwb-list-group-item>
2828
</fwb-list-group>
2929
</fwb-dropdown>

‎docs/components/card.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ Use these responsive card components to show data entries and information to you
2020
<fwb-card-example />
2121
```vue
2222
<template>
23-
<fwb-card href="#">
23+
<fwb-card href="#" class="w-sm">
2424
<div class="p-5">
2525
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
2626
Noteworthy technology acquisitions 2021
@@ -46,6 +46,7 @@ import { FwbCard } from 'flowbite-vue'
4646
img-alt="Desk"
4747
img-src="https://flowbite.com/docs/images/blog/image-1.jpg"
4848
variant="image"
49+
class="w-md"
4950
>
5051
<div class="p-5">
5152
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
@@ -72,6 +73,7 @@ import { FwbCard } from 'flowbite-vue'
7273
img-alt="Desk"
7374
img-src="https://flowbite.com/docs/images/blog/image-4.jpg"
7475
variant="horizontal"
76+
class="w-lg"
7577
>
7678
<div class="p-5">
7779
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">

‎docs/components/card/examples/FwbCardExample.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class="vp-raw inline-flex flex-wrap gap-2">
3-
<fwb-card href="#">
3+
<fwb-card href="#" class="w-sm">
44
<div class="p-5">
55
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">
66
Noteworthy technology acquisitions 2021

‎docs/components/card/examples/FwbCardExampleHorizontal.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
img-alt="Desk"
55
img-src="https://flowbite.com/docs/images/blog/image-4.jpg"
66
variant="horizontal"
7+
class="w-lg"
78
>
89
<div class="p-5">
910
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">

‎docs/components/card/examples/FwbCardExampleImage.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
img-alt="Desk"
55
img-src="https://flowbite.com/docs/images/blog/image-1.jpg"
66
variant="image"
7+
class="w-md"
78
>
89
<div class="p-5">
910
<h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white">

‎docs/components/dropdown.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -144,16 +144,16 @@ import { FwbDropdown } from 'flowbite-vue'
144144
<template>
145145
<fwb-dropdown text="Menu" content-class="rounded-lg">
146146
<fwb-list-group class="text-sm text-gray-700 dark:text-gray-200">
147-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
147+
<fwb-list-group-item to="#">
148148
Dashboard
149149
</fwb-list-group-item>
150-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
150+
<fwb-list-group-item href="#">
151151
Settings
152152
</fwb-list-group-item>
153-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
153+
<fwb-list-group-item href="#">
154154
Earnings
155155
</fwb-list-group-item>
156-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
156+
<fwb-list-group-item @click="signOut">
157157
Sign out
158158
</fwb-list-group-item>
159159
</fwb-list-group>

‎docs/components/dropdown/examples/FwbDropdownExampleListGroup.vue‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,16 +5,16 @@
55
content-wrapper-class="rounded-lg"
66
>
77
<fwb-list-group class="text-sm text-gray-700 dark:text-gray-200">
8-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
8+
<fwb-list-group-item to="#">
99
Dashboard
1010
</fwb-list-group-item>
11-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
11+
<fwb-list-group-item href="#">
1212
Settings
1313
</fwb-list-group-item>
14-
<fwb-list-group-item class="cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
14+
<fwb-list-group-item href="#">
1515
Earnings
1616
</fwb-list-group-item>
17-
<fwb-list-group-item class="cursor-pointer border-b-0 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">
17+
<fwb-list-group-item @click="signOut">
1818
Sign out
1919
</fwb-list-group-item>
2020
</fwb-list-group>
@@ -24,4 +24,5 @@
2424

2525
<script lang="ts" setup>
2626
import { FwbDropdown, FwbListGroup, FwbListGroupItem } from '../../../../src/index'
27+
const signOut = () => {}
2728
</script>

‎docs/components/list-group.md‎

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script setup>
22
import FwbListGroupExample from './listGroup/examples/FwbListGroupExample.vue'
33
import FwbListGroupExampleDisabled from './listGroup/examples/FwbListGroupExampleDisabled.vue'
4-
import FwbListGroupExampleHover from './listGroup/examples/FwbListGroupExampleHover.vue'
4+
import FwbListGroupExampleLink from './listGroup/examples/FwbListGroupExampleLink.vue'
55
import FwbListGroupExampleIcon from './listGroup/examples/FwbListGroupExampleIcon.vue'
66
</script>
77

@@ -36,17 +36,27 @@ import { FwbListGroup, FwbListGroupItem } from 'flowbite-vue'
3636
</script>
3737
```
3838

39-
## Hover
39+
## Links
4040

41-
<fwb-list-group-example-hover />
41+
:::tip
42+
`href` prop is used for external links. `to` prop is used for internal links. `target` prop is used to set the target attribute for external links, the hover effect is automatically enabled.
43+
:::
44+
<fwb-list-group-example-link />
4245
```vue
4346
<template>
4447
<fwb-list-group>
45-
<fwb-list-group-item active hover>Item 1</fwb-list-group-item>
46-
<fwb-list-group-item hover>Item 2</fwb-list-group-item>
47-
<fwb-list-group-item hover>Item 3</fwb-list-group-item>
48-
<fwb-list-group-item hover>Item 4</fwb-list-group-item>
49-
<fwb-list-group-item hover>Item 5</fwb-list-group-item>
48+
<fwb-list-group-item active href="#">
49+
Link with href (active)
50+
</fwb-list-group-item>
51+
<fwb-list-group-item href="https://flowbite.com" target="__blank">
52+
External link (target blank)
53+
</fwb-list-group-item>
54+
<fwb-list-group-item to="#">
55+
Router link
56+
</fwb-list-group-item>
57+
<fwb-list-group-item>
58+
Regular item (no hover)
59+
</fwb-list-group-item>
5060
</fwb-list-group>
5161
</template>
5262

‎docs/components/listGroup/examples/FwbListGroupExampleHover.vue‎ renamed to ‎docs/components/listGroup/examples/FwbListGroupExampleLink.vue‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,22 +3,20 @@
33
<fwb-list-group>
44
<fwb-list-group-item
55
active
6-
hover
6+
href="#"
77
>
8-
Item 1
8+
Link with href (active)
99
</fwb-list-group-item>
10-
<fwb-list-group-item hover>
11-
Item 2
12-
</fwb-list-group-item>
13-
<fwb-list-group-item hover>
14-
Item 3
15-
</fwb-list-group-item>
16-
<fwb-list-group-item hover>
17-
Item 4
10+
<fwb-list-group-item
11+
href="https://flowbite.com"
12+
target="__blank"
13+
>
14+
External link
1815
</fwb-list-group-item>
19-
<fwb-list-group-item hover>
20-
Item 5
16+
<fwb-list-group-item to="#">
17+
Router link
2118
</fwb-list-group-item>
19+
<fwb-list-group-item> Regular item (no hover) </fwb-list-group-item>
2220
</fwb-list-group>
2321
</div>
2422
</template>

0 commit comments

Comments
 (0)