refactor: restore valid docs links, and add new
This commit is contained in:
+16
-1
@@ -1,8 +1,23 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<CCardGroup columns class="c-card-columns c-cols-2">
|
<CCardGroup columns class="c-card-columns c-cols-2">
|
||||||
<CCard header-html="Line Chart" body-wrapper>
|
<CCard>
|
||||||
|
<CCardHeader>
|
||||||
|
Line Chart
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Charts"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</CCardHeader>
|
||||||
|
<CCardBody>
|
||||||
<CChartLineExample/>
|
<CChartLineExample/>
|
||||||
|
</CCardBody>
|
||||||
</CCard>
|
</CCard>
|
||||||
<CCard header-html="Bar Chart" body-wrapper>
|
<CCard header-html="Bar Chart" body-wrapper>
|
||||||
<CChartBarExample/>
|
<CChartBarExample/>
|
||||||
|
|||||||
@@ -6,11 +6,16 @@
|
|||||||
<CCard>
|
<CCard>
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i><strong> Bootstrap Breadcrumb</strong>
|
<i class="fa fa-align-justify"></i><strong> Bootstrap Breadcrumb</strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/breadcrumb" class="card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Breadcrumb"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CBreadcrumb :items="items" add-link-classes="sss" last-item-classes="aaa"/>
|
<CBreadcrumb :items="items" add-link-classes="sss" last-item-classes="aaa"/>
|
||||||
|
|||||||
+36
-35
@@ -2,7 +2,24 @@
|
|||||||
<div>
|
<div>
|
||||||
<CRow>
|
<CRow>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card title" :body-html="loremIpsum"/>
|
<CCard>
|
||||||
|
<CCardHeader>
|
||||||
|
Card title
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/CardComponents"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</CCardHeader>
|
||||||
|
<CCardBody>
|
||||||
|
{{loremIpsum}}
|
||||||
|
</CCardBody>
|
||||||
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard footer-html="Card Footer" :body-html="loremIpsum" />
|
<CCard footer-html="Card Footer" :body-html="loremIpsum" />
|
||||||
@@ -28,7 +45,7 @@
|
|||||||
/>
|
/>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCardBody>
|
</CCardBody>
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
@@ -39,7 +56,7 @@
|
|||||||
<CBadge variant="success" class="c-float-right">Success</CBadge>
|
<CBadge variant="success" class="c-float-right">Success</CBadge>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCardBody>
|
</CCardBody>
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
@@ -74,22 +91,22 @@
|
|||||||
border-variant="success"
|
border-variant="success"
|
||||||
body-wrapper
|
body-wrapper
|
||||||
>
|
>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card outline info" border-variant="info" body-wrapper>
|
<CCard header-html="Card outline info" border-variant="info" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card outline warning" border-variant="warning" body-wrapper>
|
<CCard header-html="Card outline warning" border-variant="warning" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card outline danger" border-variant="danger" body-wrapper>
|
<CCard header-html="Card outline danger" border-variant="danger" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
</CRow>
|
</CRow>
|
||||||
@@ -97,32 +114,32 @@
|
|||||||
<CRow>
|
<CRow>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard class="c-card-accent-primary" header="Card with primary accent" body-wrapper>
|
<CCard class="c-card-accent-primary" header="Card with primary accent" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard class="c-card-accent-secondary" header="Card with secondary accent" body-wrapper>
|
<CCard class="c-card-accent-secondary" header="Card with secondary accent" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard class="c-card-accent-success" header="Card with success accent" body-wrapper>
|
<CCard class="c-card-accent-success" header="Card with success accent" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard class="c-card-accent-info" header="Card with info accent" body-wrapper>
|
<CCard class="c-card-accent-info" header="Card with info accent" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard class="c-card-accent-warning" header="Card with warning accent" body-wrapper>
|
<CCard class="c-card-accent-warning" header="Card with warning accent" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard class="c-card-accent-danger" header="Card with danger accent" body-wrapper>
|
<CCard class="c-card-accent-danger" header="Card with danger accent" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
</CRow>
|
</CRow>
|
||||||
@@ -191,27 +208,27 @@
|
|||||||
<CRow>
|
<CRow>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card title" class="c-bg-primary" body-wrapper>
|
<CCard header-html="Card title" class="c-bg-primary" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card title" class="c-bg-success" body-wrapper>
|
<CCard header-html="Card title" class="c-bg-success" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card title" class="c-bg-info" body-wrapper>
|
<CCard header-html="Card title" class="c-bg-info" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card title" class="c-bg-warning" body-wrapper>
|
<CCard header-html="Card title" class="c-bg-warning" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
<CCard header-html="Card title" class="c-bg-danger" body-wrapper>
|
<CCard header-html="Card title" class="c-bg-danger" body-wrapper>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" md="4">
|
<CCol sm="6" md="4">
|
||||||
@@ -233,29 +250,13 @@
|
|||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCollapse :show="isCollapsed" :duration="400">
|
<CCollapse :show="isCollapsed" :duration="400">
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
{{loremIpsum}}
|
||||||
</CCardBody>
|
</CCardBody>
|
||||||
</CCollapse>
|
</CCollapse>
|
||||||
</CCard>
|
</CCard>
|
||||||
</transition>
|
</transition>
|
||||||
</CCol>
|
</CCol>
|
||||||
</CRow>
|
</CRow>
|
||||||
<!-- <CRow>
|
|
||||||
<CCol sm="6" md="4">
|
|
||||||
<CCard >
|
|
||||||
<CCardImg img-src="https://picsum.photos/600/300/?image=25"/>
|
|
||||||
<CCardHeader header-html="Card title"/>
|
|
||||||
<CCardBody style="max-height:200px;overflow-y:auto">
|
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
||||||
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
|
|
||||||
</CCardBody>
|
|
||||||
</CCard>
|
|
||||||
</CCol>
|
|
||||||
</CRow> -->
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -7,16 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Carousel</strong>
|
<strong> Bootstrap Carousel</strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a
|
<a
|
||||||
href="https://bootstrap-vue.js.org/docs/components/carousel"
|
href="https://coreui.io/vue/docs/3.0/components/Carousel"
|
||||||
class="card-header-action"
|
class="card-header-action"
|
||||||
rel="noreferrer noopener"
|
rel="noreferrer noopener"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
>
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CCarousel
|
<CCarousel
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Collapse </strong>
|
<strong> Bootstrap Collapse </strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<CLink class="card-header-action">
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Collapse"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</CLink>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CButton id="collapse1" variant="primary">
|
<CButton id="collapse1" variant="primary">
|
||||||
|
|||||||
@@ -5,6 +5,16 @@
|
|||||||
<CCard>
|
<CCard>
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<strong>Credit Card </strong> <small>Form</small>
|
<strong>Credit Card </strong> <small>Form</small>
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/FormComponents"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CRow>
|
<CRow>
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Jumbotron </strong>
|
<strong> Bootstrap Jumbotron </strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/jumbotron" class="card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/Jumbotron"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CJumbotron header="Bootstrap 4" lead="Bootstrap 4 Components for Vue.js 2">
|
<CJumbotron header="Bootstrap 4" lead="Bootstrap 4 Components for Vue.js 2">
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap list group </strong>
|
<strong> Bootstrap list group </strong>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/list-group" class="c-card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/ListGroup"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CListGroup>
|
<CListGroup>
|
||||||
|
|||||||
@@ -34,11 +34,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Navbar </strong>
|
<strong> Bootstrap Navbar </strong>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/navbar" class="c-card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/Navbar"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CNavbar
|
<CNavbar
|
||||||
|
|||||||
@@ -4,14 +4,16 @@
|
|||||||
<CCard>
|
<CCard>
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i><strong> Bootstrap Navs</strong>
|
<i class="fa fa-align-justify"></i><strong> Bootstrap Navs</strong>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<CLink
|
<a
|
||||||
href="#"
|
href="https://coreui.io/vue/docs/3.0/components/Nav"
|
||||||
class="c-card-header-action"
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
>
|
>
|
||||||
<small class="c-text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</CLink>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CNav>
|
<CNav>
|
||||||
|
|||||||
@@ -5,11 +5,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Responsive bootstrap Pagination</strong>
|
<strong> Responsive bootstrap Pagination</strong>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/pagination" class="c-card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/Pagination"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<h6>Default</h6>
|
<h6>Default</h6>
|
||||||
|
|||||||
@@ -5,11 +5,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Popovers</strong>
|
<strong> Bootstrap Popovers</strong>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/popovers" class="c-card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/Popover"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CRow>
|
<CRow>
|
||||||
|
|||||||
@@ -5,11 +5,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Progress</strong>
|
<strong> Bootstrap Progress</strong>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/progress" class="c-card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/Progress"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CProgress :value="counter" :max="max" show-progress animated></CProgress>
|
<CProgress :value="counter" :max="max" show-progress animated></CProgress>
|
||||||
@@ -206,7 +211,7 @@ export default {
|
|||||||
name: 'progress-bars',
|
name: 'progress-bars',
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
counter: 45,
|
counter: 73,
|
||||||
max: 100,
|
max: 100,
|
||||||
max2: 50,
|
max2: 50,
|
||||||
value: 33.333333333,
|
value: 33.333333333,
|
||||||
|
|||||||
@@ -4,11 +4,18 @@
|
|||||||
<CCol xs="12" md="6">
|
<CCol xs="12" md="6">
|
||||||
<CCard v-if="true">
|
<CCard v-if="true">
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<h5>
|
|
||||||
Radio switches
|
Radio switches
|
||||||
<CBadge :variant="radio" class="c-mr-auto">{{radio}}</CBadge>
|
<CBadge :variant="radio" class="c-mr-auto">{{radio}}</CBadge>
|
||||||
<CBadge variant="danger" class="c-float-right">NEW</CBadge>
|
<div class="c-card-header-actions">
|
||||||
</h5>
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Switch"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<!-- <CSwitch
|
<!-- <CSwitch
|
||||||
|
|||||||
@@ -2,7 +2,21 @@
|
|||||||
<div>
|
<div>
|
||||||
<CRow>
|
<CRow>
|
||||||
<CCol sm="12">
|
<CCol sm="12">
|
||||||
<CCard header-html="CTable component functionality presentation" body-wrapper>
|
<CCard>
|
||||||
|
<CCardHeader>
|
||||||
|
CTable component functionality presentation
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Table"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</CCardHeader>
|
||||||
|
<CCardBody>
|
||||||
<CTable
|
<CTable
|
||||||
:items="getItems()"
|
:items="getItems()"
|
||||||
:fields="fields"
|
:fields="fields"
|
||||||
@@ -57,11 +71,7 @@
|
|||||||
</CCollapse>
|
</CCollapse>
|
||||||
</template>
|
</template>
|
||||||
</CTable>
|
</CTable>
|
||||||
<!-- <CPagination
|
</CCardBody>
|
||||||
v-show="pages > 1"
|
|
||||||
:activePage.sync="page"
|
|
||||||
:pages="pages"
|
|
||||||
/> -->
|
|
||||||
</CCard>
|
</CCard>
|
||||||
</CCol>
|
</CCol>
|
||||||
</CRow>
|
</CRow>
|
||||||
|
|||||||
@@ -5,6 +5,16 @@
|
|||||||
<CCard>
|
<CCard>
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
Tabs
|
Tabs
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Tabs"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CTabs>
|
<CTabs>
|
||||||
|
|||||||
@@ -6,11 +6,16 @@
|
|||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Tooltips </strong>
|
<strong> Bootstrap Tooltips </strong>
|
||||||
<small><code>v-c-tooltip</code> directive</small>
|
<small><code>v-c-tooltip</code> directive</small>
|
||||||
<!-- <div class="c-card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/tooltip" class="c-card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
<small class="c-text-muted">docs</small>
|
href="https://coreui.io/vue/docs/3.0/components/Tooltip"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CRow>
|
<CRow>
|
||||||
|
|||||||
@@ -5,6 +5,16 @@
|
|||||||
<CCard>
|
<CCard>
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<strong>Brand Button</strong>
|
<strong>Brand Button</strong>
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/ButtonComponents"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<small>Usage </small>
|
<small>Usage </small>
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap button group</strong>
|
<strong> Bootstrap button group</strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/button-group" class="card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/ButtonComponents"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<div>
|
<div>
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Dropdown</strong>
|
<strong> Bootstrap Dropdown</strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/dropdown" class="card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Dropdown"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<div>
|
<div>
|
||||||
|
|||||||
@@ -3,6 +3,16 @@
|
|||||||
<CCard >
|
<CCard >
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<strong>Standard buttons</strong>
|
<strong>Standard buttons</strong>
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/ButtonComponents"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CRow class="c-align-items-center">
|
<CRow class="c-align-items-center">
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Alert</strong>
|
<strong> Bootstrap Alert</strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/alert" class="card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Alert"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<div>
|
<div>
|
||||||
|
|||||||
@@ -7,11 +7,16 @@
|
|||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i>
|
<i class="fa fa-align-justify"></i>
|
||||||
<strong> Bootstrap Badge</strong>
|
<strong> Bootstrap Badge</strong>
|
||||||
<!-- <div class="card-header-actions">
|
<div class="c-card-header-actions">
|
||||||
<a href="https://bootstrap-vue.js.org/docs/components/badge" class="card-header-action" rel="noreferrer noopener" target="_blank">
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Badge"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<small class="text-muted">docs</small>
|
<small class="text-muted">docs</small>
|
||||||
</a>
|
</a>
|
||||||
</div> -->
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<h2>Example heading <CBadge variant="primary">New</CBadge></h2>
|
<h2>Example heading <CBadge variant="primary">New</CBadge></h2>
|
||||||
|
|||||||
@@ -6,6 +6,16 @@
|
|||||||
<CCard>
|
<CCard>
|
||||||
<CCardHeader>
|
<CCardHeader>
|
||||||
<i class="fa fa-align-justify"></i> Bootstrap Modals
|
<i class="fa fa-align-justify"></i> Bootstrap Modals
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/Modal"
|
||||||
|
class="card-header-action"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
</CCardHeader>
|
</CCardHeader>
|
||||||
<CCardBody>
|
<CCardBody>
|
||||||
<CButton variant="secondary" @click="myModal = true" class="c-mr-1">
|
<CButton variant="secondary" @click="myModal = true" class="c-mr-1">
|
||||||
|
|||||||
@@ -12,6 +12,19 @@
|
|||||||
:value="25"
|
:value="25"
|
||||||
class="c-progress-xs c-my-3 c-mb-0"
|
class="c-progress-xs c-my-3 c-mb-0"
|
||||||
/>
|
/>
|
||||||
|
<template #header>
|
||||||
|
<div class="c-card-header-actions">
|
||||||
|
<a
|
||||||
|
href="https://coreui.io/vue/docs/3.0/components/ButtonComponents"
|
||||||
|
class="card-header-action c-position-absolute"
|
||||||
|
style="right:10px; top:10px"
|
||||||
|
rel="noreferrer noopener"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
<small class="text-muted">docs</small>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</CWidgetProgress>
|
</CWidgetProgress>
|
||||||
</CCol>
|
</CCol>
|
||||||
<CCol sm="6" lg="3">
|
<CCol sm="6" lg="3">
|
||||||
|
|||||||
Reference in New Issue
Block a user