Skip to content

Commit 2007cce

Browse files
committed
docs: update links to the documentation
1 parent c16251a commit 2007cce

38 files changed

+154
-56
lines changed

src/assets/images/components.webp

60.1 KB
Binary file not shown.

src/assets/images/icons.webp

57.1 KB
Binary file not shown.

src/components/DocsComponents.vue

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<script setup>
2+
const props = defineProps({
3+
href: String,
4+
})
5+
6+
import ComponentsImg from '@/assets/images/components.webp'
7+
</script>
8+
9+
<template>
10+
<div class="bg-primary bg-opacity-10 border border-2 border-primary rounded mb-4">
11+
<div class="row d-flex align-items-center p-3 px-xl-4 flex-xl-nowrap">
12+
<div class="col-xl-auto col-12 d-none d-xl-block p-0">
13+
<img
14+
class="img-fluid"
15+
:src="ComponentsImg"
16+
width="160px"
17+
height="160px"
18+
alt="CoreUI PRO hexagon"
19+
/>
20+
</div>
21+
<div class="col-md col-12 px-lg-4">
22+
Our Admin Panel isn’t just a mix of third-party components. It’s
23+
<strong>
24+
the only open-source Vue dashboard built on a professional, enterprise-grade UI Components
25+
Library
26+
</strong>
27+
. This component is part of this library, and we present only the basic usage of it here. To
28+
explore extended examples, detailed API documentation, and customization options, refer to
29+
our docs.
30+
</div>
31+
<div class="col-md-auto col-12 mt-3 mt-lg-0">
32+
<a
33+
class="btn btn-primary text-nowrap text-white"
34+
:href="`https://coreui.io/vue/docs/${props.href}`"
35+
target="_blank"
36+
rel="noopener noreferrer"
37+
>
38+
Explore Documentation
39+
</a>
40+
</div>
41+
</div>
42+
</div>
43+
</template>

src/components/DocsIcons.vue

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<script setup>
2+
import IconsImg from '@/assets/images/icons.webp'
3+
</script>
4+
5+
<template>
6+
<div class="bg-warning bg-opacity-10 border border-2 border-warning rounded mb-4">
7+
<div class="row d-flex align-items-center p-3 px-xl-4 flex-xl-nowrap">
8+
<div class="col-xl-auto col-12 d-none d-xl-block p-0">
9+
<img class="img-fluid" :src="IconsImg" width="160px" height="160px" alt="CoreUI Icons" />
10+
</div>
11+
<div class="col-md col-12 px-lg-4">
12+
CoreUI Icons package is delivered with more than 1500 icons in multiple formats SVG, PNG,
13+
and Webfonts. CoreUI Icons are beautifully crafted symbols for common actions and items. You
14+
can use them in your digital products for web or mobile app. For more information please
15+
visit our documentation.
16+
</div>
17+
<div class="col-md-auto col-12 mt-3 mt-lg-0">
18+
<a
19+
class="btn btn-warning text-nowrap text-white"
20+
href="https://coreui.io/vue/docs/components/icon.html"
21+
target="_blank"
22+
rel="noopener noreferrer"
23+
>
24+
Explore Documentation
25+
</a>
26+
</div>
27+
</div>
28+
</div>
29+
</template>

src/main.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,18 @@ import router from './router'
77
import CoreuiVue from '@coreui/vue'
88
import CIcon from '@coreui/icons-vue'
99
import { iconsSet as icons } from '@/assets/icons'
10+
import DocsComponents from '@/components/DocsComponents'
1011
import DocsExample from '@/components/DocsExample'
12+
import DocsIcons from '@/components/DocsIcons'
1113

1214
const app = createApp(App)
1315
app.use(createPinia())
1416
app.use(router)
1517
app.use(CoreuiVue)
1618
app.provide('icons', icons)
1719
app.component('CIcon', CIcon)
20+
app.component('DocsComponents', DocsComponents)
1821
app.component('DocsExample', DocsExample)
22+
app.component('DocsIcons', DocsIcons)
1923

2024
app.mount('#app')

src/views/base/Accordion.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
21
<template>
32
<CRow>
43
<CCol :xs="12">
4+
<DocsComponents href="components/accordion.html" />
55
<CCard class="mb-4">
66
<CCardHeader>
77
<strong>Vue Accordion</strong>

src/views/base/Breadcrumbs.vue

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/breadcrumb.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Breadcrumb</strong>
78
</CCardHeader>
89
<CCardBody>
910
<p class="text-body-secondary small">
10-
The breadcrumb navigation provides links back to each previous page
11-
the user navigated through and shows the current location in a
12-
website or an application. You don’t have to add separators, because
13-
they automatically added in CSS through
11+
The breadcrumb navigation provides links back to each previous page the user navigated
12+
through and shows the current location in a website or an application. You don’t have to
13+
add separators, because they automatically added in CSS through
1414
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/::before">
1515
<code>::before</code>
1616
</a>

src/views/base/Cards.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import VueImg from '@/assets/images/vue.jpg'
66
<template>
77
<CRow>
88
<CCol :xs="12">
9+
<DocsComponents href="components/card.html" />
910
<CCard class="mb-4">
1011
<CCardHeader>
1112
<strong>Card</strong> <small>Example</small>

src/views/base/Carousels.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import VueImg from '@/assets/images/vue.jpg'
77
<template>
88
<CRow>
99
<CCol :xs="12">
10+
<DocsComponents href="components/carousel.html" />
1011
<CCard class="mb-4">
1112
<CCardHeader>
1213
<strong>Vue Carousels</strong> <small>Slide only</small>

src/views/base/Collapses.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ const visibleHorizontal = ref(false)
1010
<template>
1111
<CRow>
1212
<CCol :xs="12">
13+
<DocsComponents href="components/collapse.html" />
1314
<CCard class="mb-4">
1415
<CCardHeader>
1516
<strong>Vue Collapse</strong>

src/views/base/ListGroups.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/list-group.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue List Group</strong> <small>Basic example</small>

src/views/base/Navs.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/nav.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Navs</strong> <small>Base navs</small>

src/views/base/Paginations.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/pagination.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Pagination</strong>

src/views/base/Placeholders.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import VueImg from '@/assets/images/vue.jpg'
55
<template>
66
<CRow>
77
<CCol :xs="12">
8+
<DocsComponents href="components/placeholder.html" />
89
<CCard class="mb-4">
910
<CCardHeader>
1011
<strong>Vue Placeholder</strong>

src/views/base/Popovers.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/popover.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Popovers</strong> <small>Basic example</small>

src/views/base/Progress.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/progress.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Progress</strong> <small>Basic example</small>

src/views/base/Spinners.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/spinner.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Spinner</strong> <small>Border</small>

src/views/base/Tables.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/table.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Table</strong> <small>Basic example</small>

src/views/base/Tabs.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/tabs.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Tabs</strong>

src/views/base/Tooltips.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/tooltip.html" />
45
<CCard>
56
<CCardHeader>
67
<strong>Vue Tooltips</strong> <small>Basic example</small>

src/views/buttons/ButtonGroups.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/button-group.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Button Group</strong> <span>Basic example</span>

src/views/buttons/Buttons.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/button.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Button</strong>

src/views/buttons/Dropdowns.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="components/dropdown.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Dropdown</strong> <small>Single button</small>

src/views/forms/ChecksRadios.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/checks-radios.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Checkbox</strong>

src/views/forms/FloatingLabels.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/floating-labels.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Floating labels</strong>

src/views/forms/FormControl.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/form-control.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Form Control</strong>

src/views/forms/InputGroup.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/input-group.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Input group</strong> <small>Basic example</small>

src/views/forms/Layout.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/layout.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Layout</strong> <small>Form grid</small>

src/views/forms/Range.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/range.html" />
45
<CCard class="mb-4">
56
<CCardHeader> <strong>Vue Range</strong> <small></small> </CCardHeader>
67
<CCardBody>

src/views/forms/Select.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<CRow>
33
<CCol :xs="12">
4+
<DocsComponents href="forms/select.html" />
45
<CCard class="mb-4">
56
<CCardHeader>
67
<strong>Vue Select</strong> <small>Default</small>

src/views/forms/Validation.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@ const handleSubmitTooltip01 = (event) => {
3838
<template>
3939
<CRow>
4040
<CCol :xs="12">
41+
<DocsComponents href="forms/validation.html" />
4142
<CCard class="mb-4">
4243
<CCardHeader> <strong>Validation</strong> <small>Custom styles</small> </CCardHeader>
4344
<CCardBody>

src/views/icons/Brands.vue

Lines changed: 15 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,24 @@
11
<script setup>
22
import { brandSet } from '@coreui/icons'
3+
import DocsIcons from '../../components/DocsIcons.vue';
34
45
const toKebabCase = (str) => str.replace(/([a-z])([A-Z0-9])/g, '$1-$2').toLowerCase()
56
const icons = brandSet
67
</script>
78

89
<template>
9-
<CRow>
10-
<CCol>
11-
<CCard>
12-
<CCardHeader>CoreUI Icons - Brand</CCardHeader>
13-
<CCardBody>
14-
<CRow class="text-center">
15-
<template v-for="(icon, iconName) in icons" :key="iconName">
16-
<CCol class="mb-5" :xs="3" :sm="2">
17-
<CIcon :content="icon" size="xxl" />
18-
<div>{{ toKebabCase(iconName) }}</div>
19-
</CCol>
20-
</template>
21-
</CRow>
22-
</CCardBody>
23-
</CCard>
24-
</CCol>
25-
</CRow>
10+
<DocsIcons />
11+
<CCard>
12+
<CCardHeader>CoreUI Icons - Brand</CCardHeader>
13+
<CCardBody>
14+
<CRow class="text-center">
15+
<template v-for="(icon, iconName) in icons" :key="iconName">
16+
<CCol class="mb-5" :xs="3" :sm="2">
17+
<CIcon :content="icon" size="xxl" />
18+
<div>{{ toKebabCase(iconName) }}</div>
19+
</CCol>
20+
</template>
21+
</CRow>
22+
</CCardBody>
23+
</CCard>
2624
</template>

src/views/icons/CoreUIIcons.vue

Lines changed: 14 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,18 @@ const icons = freeSet
66
</script>
77

88
<template>
9-
<CRow>
10-
<CCol>
11-
<CCard>
12-
<CCardHeader>CoreUI Icons Free</CCardHeader>
13-
<CCardBody>
14-
<CRow class="text-center">
15-
<template v-for="(icon, iconName) in icons" :key="iconName">
16-
<CCol class="mb-5" :xs="3" :sm="2">
17-
<CIcon :content="icon" size="xxl" />
18-
<div>{{ toKebabCase(iconName) }}</div>
19-
</CCol>
20-
</template>
21-
</CRow>
22-
</CCardBody>
23-
</CCard>
24-
</CCol>
25-
</CRow>
9+
<DocsIcons />
10+
<CCard>
11+
<CCardHeader>CoreUI Icons Free</CCardHeader>
12+
<CCardBody>
13+
<CRow class="text-center">
14+
<template v-for="(icon, iconName) in icons" :key="iconName">
15+
<CCol class="mb-5" :xs="3" :sm="2">
16+
<CIcon :content="icon" size="xxl" />
17+
<div>{{ toKebabCase(iconName) }}</div>
18+
</CCol>
19+
</template>
20+
</CRow>
21+
</CCardBody>
22+
</CCard>
2623
</template>

0 commit comments

Comments
 (0)