This commit is contained in:
xidedix
2018-02-02 17:09:58 +01:00
parent e122f00746
commit 17267e43f3
35 changed files with 553 additions and 491 deletions
+1 -1
View File
@@ -78,7 +78,7 @@
<b-card>
<b-row>
<b-col sm="5">
<h4 class="card-title mb-0">Traffic</h4>
<h4 id="traffic" class="card-title mb-0">Traffic</h4>
<div class="small text-muted">November 2017</div>
</b-col>
<b-col sm="7" class="d-none d-md-block">
@@ -7,9 +7,9 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Breadcrumb</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Breadcrumb</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/breadcrumb" target="_blank"><small className="text-muted">docs</small></a>
<a href="https://bootstrap-vue.js.org/docs/components/breadcrumb" target="_blank"><small class="text-muted">docs</small></a>
</div>
</div>
<b-breadcrumb :items="items"/>
@@ -7,9 +7,9 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Carousel</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Carousel</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/carousel" target="_blank"><small className="text-muted">docs</small></a>
<a href="https://bootstrap-vue.js.org/docs/components/carousel" target="_blank"><small class="text-muted">docs</small></a>
</div>
</div>
<div>
@@ -7,9 +7,9 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Collapse</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Collapse</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/collapse" target="_blank"><small className="text-muted">docs</small></a>
<a href="https://bootstrap-vue.js.org/docs/components/collapse" target="_blank"><small class="text-muted">docs</small></a>
</div>
</div>
<div>
@@ -31,7 +31,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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>
<!-- Using modifiers -->
@@ -56,7 +56,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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>
<b-btn v-b-toggle.collapse3 class="m-1">Toggle Collapse</b-btn>
@@ -73,7 +73,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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>
<b-btn @click="showCollapse = !showCollapse"
@@ -97,7 +97,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Collapse</strong> <small>multiple elements</small>
<i class="fa fa-align-justify"></i> <strong>Collapse</strong> <small>multiple elements</small>
</div>
<div>
<!-- Single button triggers two b-collapse components -->
@@ -122,7 +122,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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 role="tablist">
<b-card no-body class="mb-1">
+54 -54
View File
@@ -601,25 +601,25 @@
</div>
<b-form-group>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-user"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="fa fa-user"></i></b-input-group-text>
</b-input-group-prepend>
<b-form-input type="text" placeholder="Username"></b-form-input>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<b-form-input type="email" placeholder="Email"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-envelope-o"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-envelope-o"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-euro"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="fa fa-euro"></i></b-input-group-text>
</b-input-group-prepend>
<b-form-input type="text" placeholder="ex. $1.000.000"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text">.00</span></b-input-group-addon>
<b-input-group-append><b-input-group-text>.00</b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<div slot="footer">
@@ -636,11 +636,11 @@
<b-form-group>
<b-input-group>
<!-- Attach Left button -->
<b-input-group-button class="input-group-prepend" slot="left">
<b-input-group-prepend>
<b-button variant="primary">
<i class="fa fa-search"></i> Search
</b-button>
</b-input-group-button>
</b-input-group-prepend>
<b-form-input type="text" placeholder="Username"></b-form-input>
</b-input-group>
</b-form-group>
@@ -648,22 +648,22 @@
<b-input-group>
<b-form-input type="email" placeholder="Email"></b-form-input>
<!-- Attach Right button -->
<b-input-group-button class="input-group-append" slot="right">
<b-input-group-append>
<b-button variant="primary">Submit</b-button>
</b-input-group-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<!-- Attach Left button -->
<div class="input-group-prepend">
<b-input-group-prepend>
<b-button variant="primary"><i class="fa fa-facebook"></i></b-button>
</div>
</b-input-group-prepend>
<b-form-input type="email" placeholder="Email"></b-form-input>
<!-- Attach Left button -->
<b-input-group-button class="input-group-append" slot="right">
<b-input-group-append>
<b-button variant="primary"><i class="fa fa-twitter"></i></b-button>
</b-input-group-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<div slot="footer">
@@ -680,14 +680,14 @@
<b-form-group>
<b-input-group>
<!-- Attach Left button -->
<b-input-group-button class="input-group-prepend" slot="left">
<b-input-group-prepend>
<b-dropdown text="Action" variant="primary">
<b-dropdown-item>Action</b-dropdown-item>
<b-dropdown-item>Another action</b-dropdown-item>
<b-dropdown-item>Something else here...</b-dropdown-item>
<b-dropdown-item disabled>Disabled action</b-dropdown-item>
</b-dropdown>
</b-input-group-button>
</b-input-group-prepend>
<b-form-input placeholder="Username"></b-form-input>
</b-input-group>
</b-form-group>
@@ -695,37 +695,37 @@
<b-input-group>
<b-form-input placeholder="Email"></b-form-input>
<!-- Attach Right button -->
<b-input-group-button class="input-group-append" slot="right">
<b-input-group-append>
<b-dropdown text="Action" variant="primary" right>
<b-dropdown-item>Action</b-dropdown-item>
<b-dropdown-item>Another action</b-dropdown-item>
<b-dropdown-item>Something else here...</b-dropdown-item>
<b-dropdown-item disabled>Disabled action</b-dropdown-item>
</b-dropdown>
</b-input-group-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<!-- Attach Left button -->
<b-input-group-button class="input-group-prepend" slot="left">
<b-input-group-prepend>
<b-dropdown text="Split" variant="primary" split>
<b-dropdown-item href="#">Action</b-dropdown-item>
<b-dropdown-item href="#">Another action</b-dropdown-item>
<b-dropdown-item href="#">Something else here...</b-dropdown-item>
<b-dropdown-item disabled>Disabled action</b-dropdown-item>
</b-dropdown>
</b-input-group-button>
</b-input-group-prepend>
<b-form-input placeholder="..."></b-form-input>
<!-- Attach Right button -->
<b-input-group-button class="input-group-append" slot="right">
<b-input-group-append>
<b-dropdown text="Action" variant="primary" right>
<b-dropdown-item>Action</b-dropdown-item>
<b-dropdown-item>Another action</b-dropdown-item>
<b-dropdown-item>Something else here...</b-dropdown-item>
<b-dropdown-item disabled>Disabled action</b-dropdown-item>
</b-dropdown>
</b-input-group-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<div slot="footer">
@@ -853,23 +853,23 @@
</div>
<b-form-group>
<b-input-group>
<b-input-group-addon class="input-group-prepend"><span class="input-group-text">Username</span></b-input-group-addon>
<b-input-group-prepend><b-input-group-text>Username</b-input-group-text></b-input-group-prepend>
<b-form-input type="text"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-user"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-user"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<b-input-group-addon class="input-group-prepend"><span class="input-group-text">Email</span></b-input-group-addon>
<b-input-group-prepend><b-input-group-text>Email</b-input-group-text></b-input-group-prepend>
<b-form-input type="email"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-envelope"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-envelope"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<b-input-group-addon class="input-group-prepend"><span class="input-group-text">Password</span></b-input-group-addon>
<b-input-group-prepend><b-input-group-text>Password</b-input-group-text></b-input-group-prepend>
<b-form-input type="password"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-asterisk"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-asterisk"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<div class="form-group form-actions">
@@ -885,19 +885,19 @@
<b-form-group>
<b-input-group>
<b-form-input type="text" placeholder="Username"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-user"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-user"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<b-form-input type="email" placeholder="Email"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-envelope"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-envelope"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<b-form-input type="password" placeholder="Password"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text"><i class="fa fa-asterisk"></i></span></b-input-group-addon>
<b-input-group-append><b-input-group-text><i class="fa fa-asterisk"></i></b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<div class="form-group form-actions">
@@ -912,25 +912,25 @@
</div>
<b-form-group>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-user"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="fa fa-user"></i></b-input-group-text>
</b-input-group-prepend>
<b-form-input type="text" placeholder="Username"></b-form-input>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-envelope"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="fa fa-envelope"></i></b-input-group-text>
</b-input-group-prepend>
<b-form-input type="email" placeholder="Email"></b-form-input>
</b-input-group>
</b-form-group>
<b-form-group>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text"><i class="fa fa-asterisk"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="fa fa-asterisk"></i></b-input-group-text>
</b-input-group-prepend>
<b-form-input type="password" placeholder="Password"></b-form-input>
</b-input-group>
</b-form-group>
@@ -955,42 +955,42 @@
<b-card-body>
<b-form-group label="Prepended text" label-for="elementsEmail" description="Here's some help text">
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text">@</span>
</div>
<b-input-group-prepend>
<b-input-group-text>@</b-input-group-text>
</b-input-group-prepend>
<b-form-input id="elementsEmail" type="email"></b-form-input>
</b-input-group>
</b-form-group>
<b-form-group label="Appended text" label-for="elementsAppend" description="Here's some help text">
<b-input-group>
<b-form-input id="elementsAppend" type="text"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text">.00</span></b-input-group-addon>
<b-input-group-append><b-input-group-text>.00</b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group label="Append and prepend" label-for="elementsPrependAppend" description="Here's some help text">
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text">$</span>
</div>
<b-input-group-prepend>
<b-input-group-text>$</b-input-group-text>
</b-input-group-prepend>
<b-form-input id="elementsPrependAppend" type="text"></b-form-input>
<b-input-group-addon class="input-group-append"><span class="input-group-text">.00</span></b-input-group-addon>
<b-input-group-append><b-input-group-text>.00</b-input-group-text></b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group label="Append with button" label-for="elementsAppendButton" description="Here's some help text">
<b-input-group>
<b-form-input id="elementsAppendButton" type="text"></b-form-input>
<b-input-group-button class="input-group-append">
<b-input-group-append>
<b-button variant="primary">Go!</b-button>
</b-input-group-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<b-form-group label="Two-buttons append" label-for="elementsTwoButtons">
<b-input-group>
<b-form-input id="elementsTwoButtons" type="text"></b-form-input>
<div class="input-group-append">
<b-input-group-append>
<b-button variant="primary">Search</b-button>
<b-button variant="danger">Options</b-button>
</div>
</b-input-group-append>
</b-input-group>
</b-form-group>
<div class="form-actions">
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Jumbotron</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Jumbotron</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/jumbotron" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -23,7 +23,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Jumbotron</strong>
<i class="fa fa-align-justify"></i> <strong>Jumbotron</strong>
<small>with slots</small>
</div>
<div>
@@ -49,7 +49,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Jumbotron</strong>
<i class="fa fa-align-justify"></i> <strong>Jumbotron</strong>
<small>variants</small>
</div>
<div>
+11 -11
View File
@@ -7,10 +7,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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">
<a href="https://bootstrap-vue.js.org/docs/components/list-group" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -28,7 +28,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>active items</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>active items</small>
</div>
<b-list-group>
<b-list-group-item>Cras justo odio</b-list-group-item>
@@ -46,7 +46,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>disabled items</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>disabled items</small>
</div>
<b-list-group>
<b-list-group-item disabled>Cras justo odio</b-list-group-item>
@@ -62,7 +62,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>actionable items</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>actionable items</small>
</div>
<b-list-group>
<b-list-group-item href="#some-link">Awesome link</b-list-group-item>
@@ -79,7 +79,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>buttons</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>buttons</small>
</div>
<b-list-group>
<b-list-group-item button>Button item</b-list-group-item>
@@ -94,7 +94,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>with badges</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>with badges</small>
</div>
<b-list-group>
<b-list-group-item class="d-flex justify-content-between align-items-center">
@@ -119,7 +119,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>variants</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>variants</small>
</div>
<b-list-group>
<b-list-group-item>This is a default list group item</b-list-group-item>
@@ -139,7 +139,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>variants active</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>variants active</small>
</div>
<b-list-group>
<b-list-group-item href="#">This is a default list group item</b-list-group-item>
@@ -161,7 +161,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>inside cards</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>inside cards</small>
</div>
<b-card-group deck>
<b-card header="<b>Card with list group</b>">
@@ -200,7 +200,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>List group</strong> <small>custom content</small>
<i class="fa fa-align-justify"></i> <strong>List group</strong> <small>custom content</small>
</div>
<b-list-group>
<b-list-group-item href="#" active class="flex-column align-items-start">
+7 -7
View File
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navbar</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navbar</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/navbar" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -57,7 +57,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Navbar</strong>
<i class="fa fa-align-justify"></i> <strong>Navbar</strong>
<small>brand</small>
</div>
<div>
@@ -74,7 +74,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Navbar</strong>
<i class="fa fa-align-justify"></i> <strong>Navbar</strong>
<small>text</small>
</div>
<div>
@@ -93,7 +93,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Navbar</strong>
<i class="fa fa-align-justify"></i> <strong>Navbar</strong>
<small>dropdown</small>
</div>
<div>
@@ -123,7 +123,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Navbar</strong>
<i class="fa fa-align-justify"></i> <strong>Navbar</strong>
<small>form</small>
</div>
<div>
@@ -139,7 +139,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Navbar</strong>
<i class="fa fa-align-justify"></i> <strong>Navbar</strong>
<small>input group</small>
</div>
<div>
+8 -8
View File
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/nav" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -25,7 +25,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong> <small>tab style</small>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <small>tab style</small>
</div>
<div>
<b-nav tabs>
@@ -40,7 +40,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong> <small>pill style</small>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <small>pill style</small>
</div>
<div>
<b-nav pills>
@@ -55,7 +55,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong> <small>fill tabs</small>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <small>fill tabs</small>
</div>
<div>
<b-nav fill tabs>
@@ -70,7 +70,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong> <small>justified tabs</small>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <small>justified tabs</small>
</div>
<div>
<b-nav justified tabs>
@@ -85,7 +85,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong> <small>dropdown support</small>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <small>dropdown support</small>
</div>
<div>
<b-nav pills>
@@ -104,7 +104,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Navs</strong> <small>vertical variation</small>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Navs</strong> <small>vertical variation</small>
</div>
<div>
<b-nav vertical class="w-25">
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Pagination</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Pagination</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/pagination" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -37,7 +37,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Pagination</strong>
<i class="fa fa-align-justify"></i> <strong>Pagination</strong>
<small>alignment</small>
</div>
<div>
@@ -63,11 +63,11 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Pagination</strong>
<i class="fa fa-align-justify"></i> <strong>Pagination</strong>
<small>navigation</small>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/pagination" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
+8 -8
View File
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Popovers</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Popovers</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/popovers" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -35,7 +35,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Popovers</strong>
<i class="fa fa-align-justify"></i> <strong>Popovers</strong>
<small>placement</small>
</div>
<div class="my-3">
@@ -59,7 +59,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Popovers</strong>
<i class="fa fa-align-justify"></i> <strong>Popovers</strong>
<small>via properties or slots</small>
</div>
<b-row>
@@ -86,7 +86,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Popovers</strong>
<i class="fa fa-align-justify"></i> <strong>Popovers</strong>
<small>show</small>
</div>
<div class="d-flex flex-column text-md-center">
@@ -106,7 +106,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Popover</strong>
<i class="fa fa-align-justify"></i> <strong>Popover</strong>
<small>open/close events</small>
</div>
<div class="d-flex flex-column text-md-center">
@@ -127,7 +127,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Popover</strong>
<i class="fa fa-align-justify"></i> <strong>Popover</strong>
<small>enable/disable events</small>
</div>
<div class="d-flex flex-column text-md-center">
@@ -148,7 +148,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Popover</strong><small><code>v-b-popover</code>directive</small>
<i class="fa fa-align-justify"></i> <strong>Popover</strong><small><code>v-b-popover</code>directive</small>
</div>
<b-row>
<b-col md="3" class="py-3 text-center">
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Progress</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Progress</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/progress" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -26,7 +26,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>labels</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>labels</small>
</div>
<div>
<h5>No label</h5>
@@ -45,7 +45,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>width</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>width</small>
</div>
<div>
<h5>Default width</h5>
@@ -60,7 +60,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>height</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>height</small>
</div>
<div>
<h5>Default height</h5>
@@ -75,7 +75,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>variants</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>variants</small>
</div>
<div>
<div v-for="bar in bars" class="row mb-1">
@@ -93,7 +93,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>striped</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>striped</small>
</div>
<div>
<b-progress :value="25" variant="success" :striped="striped" class="mb-2"></b-progress>
@@ -109,7 +109,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>animated</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>animated</small>
</div>
<div>
<b-progress :value="25" variant="success" striped :animated="animate" class="mb-2"></b-progress>
@@ -125,7 +125,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Progress</strong> <small>multiple bars</small>
<i class="fa fa-align-justify"></i> <strong>Progress</strong> <small>multiple bars</small>
</div>
<div>
<b-progress :max="max3" class="mb-3">
+6 -6
View File
@@ -5,10 +5,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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">
<a href="https://bootstrap-vue.js.org/docs/components/tooltip" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -32,7 +32,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Tooltips</strong><small><code>b-tooltip</code>component</small>
<i class="fa fa-align-justify"></i> <strong>Tooltips</strong><small><code>b-tooltip</code>component</small>
</div>
<b-row>
<b-col md="6" class="py-4 text-center">
@@ -55,7 +55,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Tooltips</strong><small><code>show</code>prop</small>
<i class="fa fa-align-justify"></i> <strong>Tooltips</strong><small><code>show</code>prop</small>
</div>
<div class="text-center">
<b-btn id="tooltipButton-1" variant="primary">I have a tooltip</b-btn>
@@ -71,7 +71,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Tooltips</strong><small><code>open close</code>events</small>
<i class="fa fa-align-justify"></i> <strong>Tooltips</strong><small><code>open close</code>events</small>
</div>
<div class="d-flex flex-column text-md-center">
<div class="p-2">
@@ -91,7 +91,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Tooltips</strong><small><code>enable disable</code>events</small>
<i class="fa fa-align-justify"></i> <strong>Tooltips</strong><small><code>enable disable</code>events</small>
</div>
<div class="d-flex flex-column text-md-center">
<div class="p-2">
@@ -7,10 +7,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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">
<a href="https://bootstrap-vue.js.org/docs/components/button-group" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -39,7 +39,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Button group</strong> sizing
<i class="fa fa-align-justify"></i> <strong>Button group</strong> sizing
</div>
<div>
<b-button-group>
@@ -67,7 +67,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Button group</strong> dropdown support
<i class="fa fa-align-justify"></i> <strong>Button group</strong> dropdown support
</div>
<div>
<b-button-group>
@@ -95,7 +95,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Button group</strong> vertical variation
<i class="fa fa-align-justify"></i> <strong>Button group</strong> vertical variation
</div>
<div>
<b-button-group vertical>
@@ -111,10 +111,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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">
<a href="https://bootstrap-vue.js.org/docs/components/button-toolbar" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -143,18 +143,18 @@
<b-btn>Edit</b-btn>
</b-button-group>
<b-input-group size="sm" class="w-25 mx-1">
<div class="input-group-prepend">
<span class="input-group-text">$</span>
</div>
<b-input-group-prepend>
<b-input-group-text>$</b-input-group-text>
</b-input-group-prepend>
<b-form-input value="100" class="text-right"></b-form-input>
<div class="input-group-append">
<span class="input-group-text">.00</span>
</div>
<b-input-group-append>
<b-input-group-text>.00</b-input-group-text>
</b-input-group-append>
</b-input-group>
<b-input-group size="sm" class="w-25 mx-1">
<div class="input-group-prepend">
<span class="input-group-text">Size</span>
</div>
<b-input-group-prepend>
<b-input-group-text>Size</b-input-group-text>
</b-input-group-prepend>
<b-form-select value="Medium" :options="['Large','Medium','Small']"></b-form-select>
</b-input-group>
<b-button-group size="sm" class="mx-1">
@@ -7,9 +7,9 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Dropdown</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Dropdown</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/dropdown" target="_blank"><small className="text-muted">docs</small></a>
<a href="https://bootstrap-vue.js.org/docs/components/dropdown" target="_blank"><small class="text-muted">docs</small></a>
</div>
</div>
<div>
@@ -52,7 +52,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Dropdown</strong> <small>positioning</small>
<i class="fa fa-align-justify"></i> <strong>Dropdown</strong> <small>positioning</small>
</div>
<div>
<b-dropdown id="ddown-left" text="Left align" variant="primary" class="m-2">
@@ -96,7 +96,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Dropdown</strong> <small>hidden caret</small>
<i class="fa fa-align-justify"></i> <strong>Dropdown</strong> <small>hidden caret</small>
</div>
<div>
<b-dropdown variant="link" size="lg" no-caret>
@@ -116,7 +116,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Dropdown</strong> <small>sizing</small>
<i class="fa fa-align-justify"></i> <strong>Dropdown</strong> <small>sizing</small>
</div>
<div>
<b-dropdown id="ddown-lg" size="lg" text="Large" class="m-2">
@@ -150,7 +150,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Dropdown</strong> <small>headers and accessibility</small>
<i class="fa fa-align-justify"></i> <strong>Dropdown</strong> <small>headers and accessibility</small>
</div>
<div>
<b-dropdown id="ddown-aria" text="Dropdown ARIA" variant="primary" class="m-2">
@@ -175,7 +175,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="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>
<b-dropdown size="sm" id="ddown_primary" text="Primary" variant="primary" class="m-0">
<b-dropdown-item>First Action</b-dropdown-item>
@@ -7,10 +7,10 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Alert</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Alert</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/alert" target="_blank">
<small className="text-muted">docs</small>
<small class="text-muted">docs</small>
</a>
</div>
</div>
@@ -31,7 +31,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i> Alert
<i class="fa fa-align-justify"></i> Alert
<small> use <code>.alert-link</code> to provide links</small>
</div>
<div>
@@ -69,7 +69,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i>Alerts</strong>
<i class="fa fa-align-justify"></i>Alerts</strong>
<small>with additional content</small>
</div>
<b-alert show variant="success">
@@ -91,7 +91,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i>Alerts</strong>
<i class="fa fa-align-justify"></i>Alerts</strong>
<small>dismissible</small>
</div>
<div>
@@ -113,7 +113,7 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i>Alerts</strong>
<i class="fa fa-align-justify"></i>Alerts</strong>
<small>auto dismissible</small>
</div>
<div>
@@ -7,9 +7,9 @@
header-tag="header"
footer-tag="footer">
<div slot="header">
<i className="fa fa-align-justify"></i><strong>Bootstrap Badge</strong>
<i class="fa fa-align-justify"></i> <strong>Bootstrap Badge</strong>
<div class="card-actions">
<a href="https://bootstrap-vue.js.org/docs/components/badge" target="_blank"><small className="text-muted">docs</small></a>
<a href="https://bootstrap-vue.js.org/docs/components/badge" target="_blank"><small class="text-muted">docs</small></a>
</div>
</div>
<div>
+2 -2
View File
@@ -9,11 +9,11 @@
<h1>Login</h1>
<p class="text-muted">Sign In to your account</p>
<b-input-group class="mb-3">
<div class="input-group-prepend"><span class="input-group-text"><i class="icon-user"></i></span></div>
<b-input-group-prepend><b-input-group-text><i class="icon-user"></i></b-input-group-text></b-input-group-prepend>
<input type="text" class="form-control" placeholder="Username">
</b-input-group>
<b-input-group class="mb-4">
<div class="input-group-prepend"><span class="input-group-text"><i class="icon-lock"></i></span></div>
<b-input-group-prepend><b-input-group-text><i class="icon-lock"></i></b-input-group-text></b-input-group-prepend>
<input type="password" class="form-control" placeholder="Password">
</b-input-group>
<b-row>
+6 -6
View File
@@ -9,15 +9,15 @@
<p class="text-muted">The page you are looking for was not found.</p>
</div>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text">
<b-input-group-prepend>
<b-input-group-text>
<i class="fa fa-search"></i>
</span>
</div>
</b-input-group-text>
</b-input-group-prepend>
<input id="prependedInput" class="form-control" size="16" type="text" placeholder="What are you looking for?">
<div class="input-group-append">
<b-input-group-append>
<b-button variant="info">Search</b-button>
</div>
</b-input-group-append>
</b-input-group>
</b-col>
</b-row>
+6 -6
View File
@@ -9,15 +9,15 @@
<p class="text-muted">The page you are looking for is temporarily unavailable.</p>
</div>
<b-input-group>
<div class="input-group-prepend">
<span class="input-group-text">
<b-input-group-prepend>
<b-input-group-text>
<i class="fa fa-search"></i>
</span>
</div>
</b-input-group-text>
</b-input-group-prepend>
<input id="prependedInput" class="form-control" size="16" type="text" placeholder="What are you looking for?">
<div class="input-group-append">
<b-input-group-append>
<b-button variant="info">Search</b-button>
</div>
</b-input-group-append>
</b-input-group>
</b-col>
</b-row>
+12 -12
View File
@@ -8,30 +8,30 @@
<h1>Register</h1>
<p class="text-muted">Create your account</p>
<b-input-group class="mb-3">
<div class="input-group-prepend">
<span class="input-group-text"><i class="icon-user"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="icon-user"></i></b-input-group-text>
</b-input-group-prepend>
<input type="text" class="form-control" placeholder="Username">
</b-input-group>
<b-input-group class="mb-3">
<div class="input-group-prepend">
<span class="input-group-text">@</span>
</div>
<b-input-group-prepend>
<b-input-group-text>@</b-input-group-text>
</b-input-group-prepend>
<input type="text" class="form-control" placeholder="Email">
</b-input-group>
<b-input-group class="mb-3">
<div class="input-group-prepend">
<span class="input-group-text"><i class="icon-lock"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="icon-lock"></i></b-input-group-text>
</b-input-group-prepend>
<input type="password" class="form-control" placeholder="Password">
</b-input-group>
<b-input-group class="mb-4">
<div class="input-group-prepend">
<span class="input-group-text"><i class="icon-lock"></i></span>
</div>
<b-input-group-prepend>
<b-input-group-text><i class="icon-lock"></i></b-input-group-text>
</b-input-group-prepend>
<input type="password" class="form-control" placeholder="Repeat password">
</b-input-group>