Skip to content

Commit 2650056

Browse files
committed
Fix views and sidebar
1 parent 428d61a commit 2650056

16 files changed

+372
-511
lines changed

coreui/src/containers/TheSidebar.vue

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,14 +39,15 @@ export default {
3939
name: data['name'],
4040
route: data['href'],
4141
icon: data['icon'],
42-
items: [],
42+
_children: [],
4343
}
4444
for(let i=0; i<data['elements'].length; i++){
4545
if(data['elements'][i]['slug'] == 'dropdown'){
46-
result.items.push( this.dropdown(data['elements'][i]) );
46+
result._children.push( this.dropdown(data['elements'][i]) );
4747
}else{
48-
result.items.push(
48+
result._children.push(
4949
{
50+
_name: 'CSidebarNavItem',
5051
name: data['elements'][i]['name'],
5152
to: data['elements'][i]['href'],
5253
icon: data['elements'][i]['icon']

coreui/src/views/base/Breadcrumbs.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<CCol col>
44
<CCard>
55
<CCardHeader>
6-
<i class="fa fa-align-justify"></i><strong> Bootstrap Breadcrumb</strong>
6+
<CIcon name="cil-justify-center"/><strong> Bootstrap Breadcrumb</strong>
77
<div class="card-header-actions">
88
<a
99
href="https://coreui.io/vue/docs/3.0/components/Breadcrumb"
@@ -32,7 +32,7 @@ export default {
3232
return {
3333
items: [
3434
{
35-
text: '<b>Admin</b>',
35+
text: 'Admin',
3636
href: '#'
3737
},
3838
{

coreui/src/views/base/Cards.vue

Lines changed: 67 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -22,13 +22,16 @@
2222
</CCard>
2323
</CCol>
2424
<CCol sm="6" md="4">
25-
<CCard footer-html="Card Footer" :body-html="loremIpsum" />
25+
<CCard>
26+
<CCardBody>{{loremIpsum}}</CCardBody>
27+
<CCardFooter>Card Footer</CCardFooter>
28+
</CCard>
2629
</CCol>
2730
<CCol sm="6" md="4">
28-
<CCard
29-
headerHtml="<i class='cui-check'></i> Card with icon"
30-
:bodyHtml="loremIpsum"
31-
/>
31+
<CCard>
32+
<CCardHeader><CIcon name="cil-check"/> Card with icon</CCardHeader>
33+
<CCardBody>{{loremIpsum}}</CCardBody>
34+
</CCard>
3235
</CCol>
3336
<CCol sm="6" md="4">
3437
<CCard>
@@ -64,7 +67,7 @@
6467
<CCard>
6568
<CCardHeader>
6669
Card with label
67-
<CBadge pill color="danger" class="float-right">42</CBadge>
70+
<CBadge shape="pill" color="danger" class="float-right">42</CBadge>
6871
</CCardHeader>
6972
<CCardBody>
7073
{{loremIpsum}}
@@ -74,80 +77,84 @@
7477
</CRow>
7578
<CRow>
7679
<CCol sm="6" md="4">
77-
<CCard
78-
header="Card outline primary"
79-
border-color="primary"
80-
:body-html="loremIpsum"
81-
/>
80+
<CCard border-color="primary">
81+
<CCardHeader>Card outline primary</CCardHeader>
82+
<CCardBody>{{loremIpsum}}</CCardBody>
83+
</CCard>
8284
</CCol>
8385
<CCol sm="6" md="4">
84-
<CCard
85-
header="Card outline secondary"
86-
border-color="secondary"
87-
:body-html="loremIpsum"
88-
/>
86+
<CCard border-color="secondary">
87+
<CCardHeader>Card outline secondary</CCardHeader>
88+
<CCardBody>{{loremIpsum}}</CCardBody>
89+
</CCard>
8990
</CCol>
9091
<CCol sm="6" md="4">
91-
<CCard
92-
header="Card outline success"
93-
border-color="success"
94-
body-wrapper
95-
>
96-
{{loremIpsum}}
92+
<CCard border-color="success">
93+
<CCardHeader>Card outline success</CCardHeader>
94+
<CCardBody>{{loremIpsum}}</CCardBody>
9795
</CCard>
9896
</CCol>
9997
<CCol sm="6" md="4">
100-
<CCard header-html="Card outline info" border-color="info" body-wrapper>
101-
{{loremIpsum}}
98+
<CCard border-color="info">
99+
<CCardHeader>Card outline info</CCardHeader>
100+
<CCardBody>{{loremIpsum}}</CCardBody>
102101
</CCard>
103102
</CCol>
104103
<CCol sm="6" md="4">
105-
<CCard header-html="Card outline warning" border-color="warning" body-wrapper>
106-
{{loremIpsum}}
104+
<CCard border-color="warning">
105+
<CCardHeader>Card outline warning</CCardHeader>
106+
<CCardBody>{{loremIpsum}}</CCardBody>
107107
</CCard>
108108
</CCol>
109109
<CCol sm="6" md="4">
110-
<CCard header-html="Card outline danger" border-color="danger" body-wrapper>
111-
{{loremIpsum}}
110+
<CCard border-color="danger">
111+
<CCardHeader>Card outline danger</CCardHeader>
112+
<CCardBody>{{loremIpsum}}</CCardBody>
112113
</CCard>
113114
</CCol>
114115
</CRow>
115116

116117
<CRow>
117118
<CCol sm="6" md="4">
118-
<CCard class="card-accent-primary" header="Card with primary accent" body-wrapper>
119-
{{loremIpsum}}
119+
<CCard accent-color="primary">
120+
<CCardHeader>Card with primary accent</CCardHeader>
121+
<CCardBody>{{loremIpsum}}</CCardBody>
120122
</CCard>
121123
</CCol>
122124
<CCol sm="6" md="4">
123-
<CCard class="card-accent-secondary" header="Card with secondary accent" body-wrapper>
124-
{{loremIpsum}}
125+
<CCard accent-color="secondary">
126+
<CCardHeader>Card with secondary accent</CCardHeader>
127+
<CCardBody>{{loremIpsum}}</CCardBody>
125128
</CCard>
126129
</CCol>
127130
<CCol sm="6" md="4">
128-
<CCard class="card-accent-success" header="Card with success accent" body-wrapper>
129-
{{loremIpsum}}
131+
<CCard accent-color="success">
132+
<CCardHeader>Card with success accent</CCardHeader>
133+
<CCardBody>{{loremIpsum}}</CCardBody>
130134
</CCard>
131135
</CCol>
132136
<CCol sm="6" md="4">
133-
<CCard class="card-accent-info" header="Card with info accent" body-wrapper>
134-
{{loremIpsum}}
137+
<CCard accent-color="info">
138+
<CCardHeader>Card with info accent</CCardHeader>
139+
<CCardBody>{{loremIpsum}}</CCardBody>
135140
</CCard>
136141
</CCol>
137142
<CCol sm="6" md="4">
138-
<CCard class="card-accent-warning" header="Card with warning accent" body-wrapper>
139-
{{loremIpsum}}
143+
<CCard accent-color="info">
144+
<CCardHeader>Card with info accent</CCardHeader>
145+
<CCardBody>{{loremIpsum}}</CCardBody>
140146
</CCard>
141147
</CCol>
142148
<CCol sm="6" md="4">
143-
<CCard class="card-accent-danger" header="Card with danger accent" body-wrapper>
144-
{{loremIpsum}}
149+
<CCard accent-color="danger">
150+
<CCardHeader>Card with danger accent</CCardHeader>
151+
<CCardBody>{{loremIpsum}}</CCardBody>
145152
</CCard>
146153
</CCol>
147154
</CRow>
148155
<CRow>
149156
<CCol sm="6" md="4">
150-
<CCard class="bg-primary text-center" body-wrapper>
157+
<CCard color="primary" class="text-center" body-wrapper>
151158
<blockquote class="card-blockquote">
152159
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
153160
<footer>Someone famous in
@@ -157,7 +164,7 @@
157164
</CCard>
158165
</CCol>
159166
<CCol sm="6" md="4">
160-
<CCard class="bg-success text-center" body-wrapper>
167+
<CCard color="success" class="text-center" body-wrapper>
161168
<blockquote class="card-blockquote">
162169
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
163170
<footer>Someone famous in
@@ -167,7 +174,7 @@
167174
</CCard>
168175
</CCol>
169176
<CCol sm="6" md="4">
170-
<CCard class="bg-info text-center" body-wrapper>
177+
<CCard color="info" class="text-center" body-wrapper>
171178
<blockquote class="card-blockquote">
172179
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
173180
<footer>Someone famous in
@@ -177,7 +184,7 @@
177184
</CCard>
178185
</CCol>
179186
<CCol sm="6" md="4">
180-
<CCard class="bg-warning text-center" body-wrapper>
187+
<CCard color="warning" class="text-center" body-wrapper>
181188
<blockquote class="card-blockquote">
182189
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
183190
<footer>Someone famous in
@@ -187,7 +194,7 @@
187194
</CCard>
188195
</CCol>
189196
<CCol sm="6" md="4">
190-
<CCard class="bg-danger text-center" body-wrapper>
197+
<CCard color="danger" class="text-center" body-wrapper>
191198
<blockquote class="card-blockquote">
192199
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
193200
<footer>Someone famous in
@@ -197,7 +204,7 @@
197204
</CCard>
198205
</CCol>
199206
<CCol sm="6" md="4">
200-
<CCard class="bg-secondary text-center" body-wrapper>
207+
<CCard color="secondary" class="text-center" body-wrapper>
201208
<blockquote class="card-blockquote">
202209
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
203210
<footer>Someone famous in
@@ -209,44 +216,44 @@
209216
</CRow>
210217
<CRow>
211218
<CCol sm="6" md="4">
212-
<CCard header-html="Card title" class="bg-primary" body-wrapper>
213-
{{loremIpsum}}
219+
<CCard color="primary" body-wrapper>
220+
{{loremIpsum}}
214221
</CCard>
215222
</CCol>
216223
<CCol sm="6" md="4">
217-
<CCard header-html="Card title" class="bg-success" body-wrapper>
218-
{{loremIpsum}}
224+
<CCard color="success" body-wrapper>
225+
{{loremIpsum}}
219226
</CCard>
220227
</CCol>
221228
<CCol sm="6" md="4">
222-
<CCard header-html="Card title" class="bg-info" body-wrapper>
223-
{{loremIpsum}}
229+
<CCard color="info" body-wrapper>
230+
{{loremIpsum}}
224231
</CCard>
225232
</CCol>
226233
<CCol sm="6" md="4">
227-
<CCard header-html="Card title" class="bg-warning" body-wrapper>
228-
{{loremIpsum}}
234+
<CCard color="warning" body-wrapper>
235+
{{loremIpsum}}
229236
</CCard>
230237
</CCol>
231238
<CCol sm="6" md="4">
232-
<CCard header-html="Card title" class="bg-danger" body-wrapper>
233-
{{loremIpsum}}
239+
<CCard color="danger" body-wrapper>
240+
{{loremIpsum}}
234241
</CCard>
235242
</CCol>
236243
<CCol sm="6" md="4">
237244
<transition name="fade">
238-
<CCard class="bg-secondary" v-if="show">
245+
<CCard v-if="show" color="secondary">
239246
<CCardHeader>
240247
Card with header actions
241248
<div class="card-header-actions">
242249
<CLink href="#" class="card-header-action btn-setting">
243-
<i class="cui-settings"></i>
250+
<CIcon name="cil-settings"/>
244251
</CLink>
245252
<CLink class="card-header-action btn-minimize" @click="isCollapsed = !isCollapsed">
246-
<i :class="`cui-chevron-${isCollapsed ? 'bottom' : 'top'}`"></i>
253+
<CIcon :name="`cil-chevron-${isCollapsed ? 'bottom' : 'top'}`"/>
247254
</CLink>
248255
<CLink href="#" class="card-header-action btn-close" v-on:click="show = false">
249-
<i class="cui-circle-x"></i>
256+
<CIcon name="cil-x-circle"/>
250257
</CLink>
251258
</div>
252259
</CCardHeader>

coreui/src/views/base/Carousels.vue

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<CCol md="12" lg="7">
44
<CCard>
55
<CCardHeader>
6-
<i class="fa fa-align-justify"></i>
6+
<CIcon name="cil-justify-center"/>
77
<strong> Bootstrap Carousel</strong>
88
<div class="card-header-actions">
99
<a
@@ -24,17 +24,17 @@
2424
height="400px"
2525
>
2626
<CCarouselItem
27-
captionHeader="First Slide"
28-
image="https://lorempixel.com/1024/480/technics/2/"
29-
captionText="Nulla vitae elit libero, a pharetra augue mollis interdum."
27+
captionHeader="First Slide"
28+
image="https://picsum.photos/1024/480/?image=52"
29+
captionText="Nulla vitae elit libero, a pharetra augue mollis interdum."
3030
/>
3131
<CCarouselItem
32-
captionHeader="Blank page"
33-
:image="{ blankColor: 'grey' }"
34-
captionText="Nulla vitae elit libero, a pharetra augue mollis interdum."
32+
captionHeader="Blank page"
33+
:image="{ placeholderColor: 'grey' }"
34+
captionText="Nulla vitae elit libero, a pharetra augue mollis interdum."
3535
/>
3636
<CCarouselItem
37-
image="https://lorempixel.com/1024/480/technics/8/"
37+
image="https://picsum.photos/1024/480/?image=54"
3838
/>
3939
</CCarousel>
4040
</CCardBody>

coreui/src/views/base/Collapses.vue

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<CCol col="12" md="6">
44
<CCard>
55
<CCardHeader>
6-
<i class="fa fa-align-justify"></i>
6+
<CIcon name="cil-justify-center"/>
77
<strong> Bootstrap Collapse </strong>
88
<div class="card-header-actions">
99
<a
@@ -17,16 +17,20 @@
1717
</div>
1818
</CCardHeader>
1919
<CCardBody>
20-
<CButton id="collapse1" color="primary">
20+
<CButton @click="collapse = !collapse" color="primary">
2121
Toggle Collapse
2222
</CButton>
23-
<CCollapse toggler="collapse1" class="mt-2">
23+
<CCollapse :show="collapse" class="mt-2">
2424
<CCard body-wrapper>
25-
<p class="card-text">Collapse contents Here</p>
26-
<CButton id="collapse2" size="sm" color="secondary">
25+
<CCardText>Collapse contents Here</CCardText>
26+
<CButton
27+
@click="innerCollapse = !innerCollapse"
28+
size="sm"
29+
color="secondary"
30+
>
2731
Toggle Inner Collapse
2832
</CButton>
29-
<CCollapse toggler="collapse2" class="mt-2">
33+
<CCollapse :show="innerCollapse" class="mt-2">
3034
<CCard body-wrapper>Hello!</CCard>
3135
</CCollapse>
3236
</CCard>
@@ -42,7 +46,8 @@ export default {
4246
name: 'Collapses',
4347
data () {
4448
return {
45-
showCollapse: true,
49+
collapse: false,
50+
innerCollapse: false,
4651
text: `
4752
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry
4853
richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor

0 commit comments

Comments
 (0)