sean/manja_dev_ui
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

feat: card-header-actions

Browse Source 
- `card-actions` replaced by `card-header-actions`
This commit is contained in:
xidedix
2018-04-05 15:20:42 +02:00
parent 03a2863522
commit 483f8d5455
17 changed files with 76 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/base/Breadcrumbs.vue
+4 -2
View File
@@ -8,8 +8,10 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<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-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/breadcrumb" target="_blank"><small class="text-muted">docs</small></a> <a href="https://bootstrap-vue.js.org/docs/components/breadcrumb" class="card-header-action" rel="noreferrer noopener" target="_blank">
<small class="text-muted">docs</small>
</a>
</div> </div>
</div> </div>
<b-breadcrumb :items="items"/> <b-breadcrumb :items="items"/>
src/views/base/Cards.vue
+15 -1
View File
@@ -203,7 +203,21 @@
</b-card> </b-card>
</b-col> </b-col>
<b-col sm="6" md="4"> <b-col sm="6" md="4">
<b-card header="Card title" class="bg-secondary"> <b-card class="bg-secondary">
<div slot="header">
Card with header actions
<div class="card-header-actions">
<b-link href="#" class="card-header-action btn-setting">
<i class="icon-settings"></i>
</b-link>
<b-link class="card-header-action btn-minimize" v-b-toggle.collapse1>
<i class="icon-arrow-up"></i>
</b-link>
<b-link href="#" class="card-header-action btn-close">
<i class="icon-close"></i>
</b-link>
</div>
</div>
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.
</b-card> </b-card>
</b-col> </b-col>
src/views/base/Carousels.vue
+5 -3
View File
@@ -2,14 +2,16 @@
<div class="wrapper"> <div class="wrapper">
<div class="animated fadeIn"> <div class="animated fadeIn">
<b-row> <b-row>
<b-col cols="12"> <b-col md="12" lg="9" >
<b-card <b-card
header-tag="header" header-tag="header"
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Carousel</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Carousel</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/carousel" target="_blank"><small class="text-muted">docs</small></a> <a href="https://bootstrap-vue.js.org/docs/components/carousel" class="card-header-action" rel="noreferrer noopener" target="_blank">
<small class="text-muted">docs</small>
</a>
</div> </div>
</div> </div>
<div> <div>
src/views/base/Collapses.vue
+8 -6
View File
@@ -8,8 +8,10 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Collapse</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Collapse</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/collapse" target="_blank"><small class="text-muted">docs</small></a> <a href="https://bootstrap-vue.js.org/docs/components/collapse" class="card-header-action" rel="noreferrer noopener" target="_blank">
<small class="text-muted">docs</small>
</a>
</div> </div>
</div> </div>
<div> <div>
@@ -31,7 +33,7 @@
header-tag="header" header-tag="header"
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>with<code>v-b-toggle</code>directive</small> <i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>with <code>v-b-toggle</code> directive</small>
</div> </div>
<div> <div>
<!-- Using modifiers --> <!-- Using modifiers -->
@@ -56,7 +58,7 @@
header-tag="header" header-tag="header"
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>with<code>visibility</code></small> <i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>with <code>visibility</code></small>
</div> </div>
<div> <div>
<b-btn v-b-toggle.collapse3 class="m-1">Toggle Collapse</b-btn> <b-btn v-b-toggle.collapse3 class="m-1">Toggle Collapse</b-btn>
@@ -73,7 +75,7 @@
header-tag="header" header-tag="header"
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>with<code>v-model</code></small> <i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>with <code>v-model</code></small>
</div> </div>
<div> <div>
<b-btn @click="showCollapse = !showCollapse" <b-btn @click="showCollapse = !showCollapse"
@@ -122,7 +124,7 @@
header-tag="header" header-tag="header"
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Collapse</strong><small><code>accordion</code>support</small> <i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small><code>accordion</code> support</small>
</div> </div>
<div role="tablist"> <div role="tablist">
<b-card no-body class="mb-1"> <b-card no-body class="mb-1">
src/views/base/Forms.vue
+10 -4
View File
@@ -951,10 +951,16 @@
<b-card no-body> <b-card no-body>
<div slot="header"> <div slot="header">
<i class="fa fa-edit"></i> Form Elements <i class="fa fa-edit"></i> Form Elements
<div class="card-actions"> <div class="card-header-actions">
<a href="#" class="btn btn-setting"><i class="icon-settings"></i></a> <b-link href="#" class="card-header-action btn-setting">
<b-btn class="btn btn-minimize" v-b-toggle.collapse1><i class="icon-arrow-up"></i></b-btn> <i class="icon-settings"></i>
<a href="#" class="btn btn-close"><i class="icon-close"></i></a> </b-link>
<b-link class="card-header-action btn-minimize" v-b-toggle.collapse1>
<i class="icon-arrow-up"></i>
</b-link>
<b-link href="#" class="card-header-action btn-close">
<i class="icon-close"></i>
</b-link>
</div> </div>
</div> </div>
<b-collapse id="collapse1" visible> <b-collapse id="collapse1" visible>
src/views/base/Jumbotrons.vue
+2 -2
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Jumbotron</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Jumbotron</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/jumbotron" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/jumbotron" 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>
src/views/base/ListGroups.vue
+2 -2
View File
@@ -8,8 +8,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap list group</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap list group</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/list-group" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/list-group" 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>
src/views/base/Navbars.vue
+2 -2
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navbar</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Navbar</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/navbar" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/navbar" 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>
src/views/base/Navs.vue
+2 -2
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/nav" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/nav" 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>
src/views/base/Paginations.vue
+2 -7
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Pagination</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Pagination</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/pagination" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/pagination" 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>
@@ -65,11 +65,6 @@
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Pagination</strong> <i class="fa fa-align-justify"></i> <strong>Pagination</strong>
<small>navigation</small> <small>navigation</small>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/pagination" target="_blank">
<small class="text-muted">docs</small>
</a>
</div>
</div> </div>
<div> <div>
<h6>Default</h6> <h6>Default</h6>
src/views/base/Popovers.vue
+2 -2
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Popovers</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Popovers</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/popovers" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/popovers" 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>
src/views/base/ProgressBars.vue
+2 -2
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Progress</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Progress</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/progress" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/progress" 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>
src/views/base/Tooltips.vue
+2 -2
View File
@@ -6,8 +6,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Tooltips</strong><small><code>v-b-tooltip</code>directive</small> <i class="fa fa-align-justify"></i> <strong>Bootstrap Tooltips</strong><small><code>v-b-tooltip</code>directive</small>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/tooltip" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/tooltip" 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>
src/views/buttons/ButtonGroups.vue
+7 -7
View File
@@ -8,8 +8,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap button group</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap button group</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/button-group" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/button-group" 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>
@@ -112,11 +112,11 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Button toolbar</strong> <small>with button groups</small> <i class="fa fa-align-justify"></i> <strong>Button toolbar</strong> <small>with button groups</small>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/button-toolbar" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/components/button-toolbar" 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>
</div> </div>
<div> <div>
<b-button-toolbar key-nav aria-label="Toolbar with button groups"> <b-button-toolbar key-nav aria-label="Toolbar with button groups">
src/views/buttons/Dropdowns.vue
+5 -3
View File
@@ -8,8 +8,10 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Dropdown</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Dropdown</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/dropdown" target="_blank"><small class="text-muted">docs</small></a> <a href="https://bootstrap-vue.js.org/docs/components/dropdown" class="card-header-action" rel="noreferrer noopener" target="_blank">
<small class="text-muted">docs</small>
</a>
</div> </div>
</div> </div>
<div> <div>
@@ -175,7 +177,7 @@
header-tag="header" header-tag="header"
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Dropdown</strong><small><code>variant</code></small> <i class="fa fa-align-justify"></i> <strong>Dropdown</strong> <small><code>variant</code></small>
</div> </div>
<b-dropdown size="sm" id="ddown_primary" text="Primary" variant="primary" class="m-0"> <b-dropdown size="sm" id="ddown_primary" text="Primary" variant="primary" class="m-0">
<b-dropdown-item>First Action</b-dropdown-item> <b-dropdown-item>First Action</b-dropdown-item>
src/views/notifications/Alerts.vue
+2 -2
View File
@@ -8,8 +8,8 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Alert</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Alert</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/alert" target="_blank"> <a href="https://bootstrap-vue.js.org/docs/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>
src/views/notifications/Badges.vue
+4 -2
View File
@@ -8,8 +8,10 @@
footer-tag="footer"> footer-tag="footer">
<div slot="header"> <div slot="header">
<i class="fa fa-align-justify"></i> <strong>Bootstrap Badge</strong> <i class="fa fa-align-justify"></i> <strong>Bootstrap Badge</strong>
<div class="card-actions"> <div class="card-header-actions">
<a href="https://bootstrap-vue.js.org/docs/components/badge" target="_blank"><small class="text-muted">docs</small></a> <a href="https://bootstrap-vue.js.org/docs/components/badge" class="card-header-action" rel="noreferrer noopener" target="_blank">
<small class="text-muted">docs</small>
</a>
</div> </div>
</div> </div>
<div> <div>