8000 docs: add key for looped contents by Sreesanth46 · Pull Request #294 · coreui/coreui-vue · GitHub
[go: up one dir, main page]
Skip to content

docs: add key for looped contents #294

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mrholek merged 1 commit into from
Oct 29, 2024
Merged

docs: add key for looped contents #294

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
docs: add key for looped contents
  • Loading branch information
@Sreesanth46
Sreesanth46 authored Oct 14, 2024
commit c47645c0905330aac61588d3cc25946beb541cef
10 changes: 5 additions & 5 deletions packages/docs/components/dropdown.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ And with `<a>` elements:
The best part is you can do this with any button variant, too:

::: demo
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']">
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']" :key="item">
<CDropdown :color="item" :togglerText="item" variant="btn-group">
<CDropdownToggle :color="item">{{item}}</CDropdownToggle>
<CDropdownMenu>
Expand All @@ -77,7 +77,7 @@ The best part is you can do this with any button variant, too:
</template>
:::
```vue
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']">
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']" :key="item">
<CDropdown :color="item" :togglerText="item" variant="btn-group">
<CDropdownToggle :color="item">{{togglerText}}</CDropdownToggle>
<CDropdownMenu>
Expand All @@ -96,7 +96,7 @@ Similarly, create split button dropdowns with virtually the same markup as singl
We use this extra class to reduce the horizontal `padding` on either side of the caret by 25% and remove the `margin-left` that's attached for normal button dropdowns. Those additional changes hold the caret centered in the split button and implement a more properly sized hit area next to the main button.

::: demo
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']">
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']" :key="item">
<CDropdown :color="item" :togglerText="item" variant="btn-group">
<CButton :color="item">{{ item }}</CButton>
<CDropdownToggle :color="item" split>{{item}}</CDropdownToggle>
Expand All @@ -109,7 +109,7 @@ We use this extra class to reduce the horizontal `padding` on either side of the
< 69D6 span class='blob-code-inner blob-code-marker ' data-code-marker=" "></template>
:::
```vue
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']">
<template v-for="(item) in ['primary', 'secondary', 'success', 'info', 'warning', 'danger']" :key="item">
<CDropdown :color="item" :togglerText="item" variant="btn-group">
<CButton :color="item">{{ item }}</CButton>
<CDropdownToggle :color="item" split>{{item}}</CDropdownToggle>
Expand Down Expand Up @@ -724,4 +724,4 @@ Variables for the CSS-based carets that indicate a dropdown's interactivity:

!!!include(./api/dropdown/CDropdownMenu.api.md)!!!

!!!include(./api/dropdown/CDropdownToggle.api.md)!!!
!!!include(./api/dropdown/CDropdownToggle.api.md)!!!
0