This commit is contained in:
Łukasz Holeczek
2017-09-22 11:09:17 +02:00
parent 38ef22c96d
commit 5271e28c36
41 changed files with 906 additions and 18256 deletions
+9 -7
View File
@@ -9,14 +9,16 @@ export default {
</script>
<style>
// Import Font Awesome Icons Set
$fa-font-path: "~font-awesome/fonts/";
@import "~font-awesome/css/font-awesome.min.css";
// Import Simple Line Icons Set
$simple-line-font-path: "~simple-line-icons/fonts/";
@import "~simple-line-icons/css/simple-line-icons.css";
/* Import Font Awesome Icons Set */
$fa-font-path: '~font-awesome/fonts/';
@import '~font-awesome/css/font-awesome.min.css';
/* Import Simple Line Icons Set */
$simple-line-font-path: '~simple-line-icons/fonts/';
@import '~simple-line-icons/css/simple-line-icons.css';
/* Import Bootstrap Vue Styles */
@import '~bootstrap-vue/dist/bootstrap-vue.css';
</style>
<style lang="scss">
// Import Main styles for this application
@import "./scss/style";
@import './scss/style';
</style>
+22 -10
View File
@@ -1,9 +1,11 @@
<template>
<div class="sidebar">
<SidebarHeader/>
<SidebarForm/>
<nav class="sidebar-nav">
<div slot="header"></div>
<ul class="nav">
<li class="nav-item" v-for="(item, index) in navItems">
<template v-for="(item, index) in navItems">
<template v-if="item.title">
<SidebarNavTitle :name="item.name" :classes="item.class" :wrapper="item.wrapper"/>
</template>
@@ -12,35 +14,42 @@
</template>
<template v-else>
<template v-if="item.children">
<!-- First level dropdown -->
<SidebarNavDropdown :name="item.name" :url="item.url" :icon="item.icon">
<template v-for="(child, index) in item.children">
<template v-if="child.children">
<SidebarNavDropdown :name="child.name" :url="child.url" :icon="child.icon">
<li class="nav-item" v-for="(child, index) in item.children">
<SidebarNavLink :name="child.name" :url="child.url" :icon="child.icon" :badge="child.badge"/>
<template v-for="(childL1, index) in item.children">
<template v-if="childL1.children">
<!-- Second level dropdown -->
<SidebarNavDropdown :name="childL1.name" :url="childL1.url" :icon="childL1.icon">
<li class="nav-item" v-for="(childL2, index) in childL1.children">
<SidebarNavLink :name="childL2.name" :url="childL2.url" :icon="childL2.icon" :badge="childL2.badge"/>
</li>
</SidebarNavDropdown>
</template>
<template v-else>
<li class="nav-item">
<SidebarNavLink :name="child.name" :url="child.url" :icon="child.icon" :badge="child.badge"/>
<SidebarNavLink :name="childL1.name" :url="childL1.url" :icon="childL1.icon" :badge="childL1.badge"/>
</li>
</template>
</template>
</SidebarNavDropdown>
</template>
<template v-else>
<SidebarNavLink :name="item.name" :url="item.url" :icon="item.icon" :badge="item.badge"/>
<li class="nav-item">
<SidebarNavLink :name="item.name" :url="item.url" :icon="item.icon" :badge="item.badge"/>
</li>
</template>
</template>
</li>
</template>
</ul>
<slot></slot>
<div slot="footer"></div>
</nav>
<SidebarFooter/>
</div>
</template>
<script>
import SidebarFooter from './SidebarFooter'
import SidebarForm from './SidebarForm'
import SidebarHeader from './SidebarHeader'
import SidebarNavDropdown from './SidebarNavDropdown'
import SidebarNavLink from './SidebarNavLink'
import SidebarNavTitle from './SidebarNavTitle'
@@ -54,6 +63,9 @@ export default {
}
},
components: {
SidebarFooter,
SidebarForm,
SidebarHeader,
SidebarNavDropdown,
SidebarNavLink,
SidebarNavTitle
@@ -0,0 +1,9 @@
<template>
<!-- <div class="sidebar-footer"></div> -->
</template>
<script>
export default {
name: 'sidebar-footer'
}
</script>
@@ -0,0 +1,9 @@
<template>
<!-- <div class="sidebar-form"></div> -->
</template>
<script>
export default {
name: 'sidebar-form'
}
</script>
@@ -0,0 +1,9 @@
<template>
<!-- <div class="sidebar-header"></div> -->
</template>
<script>
export default {
name: 'sidebar-header'
}
</script>
@@ -1,7 +1,7 @@
<template>
<router-link :to="url" class="nav-link">
<i :class="icon"></i> {{name}}
<b-badge :variant="badge.variant">{{badge.text}}</b-badge>
<b-badge v-if="badge.text" :variant="badge.variant">{{badge.text}}</b-badge>
</router-link>
</template>
+4 -4
View File
@@ -2,7 +2,7 @@
<div class="animated fadeIn">
<div class="row">
<div class="col-sm-6 col-lg-3">
<b-card class="bg-primary" :no-block="true">
<b-card class="bg-primary" :no-body="true">
<div class="card-body pb-0">
<b-dropdown class="float-right" variant="transparent p-0" right>
<template slot="button-content">
@@ -20,7 +20,7 @@
</b-card>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<b-card class="bg-info" :no-block="true">
<b-card class="bg-info" :no-body="true">
<div class="card-body pb-0">
<b-dropdown class="float-right" variant="transparent p-0" right>
<template slot="button-content">
@@ -38,7 +38,7 @@
</b-card>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<b-card class="bg-warning" :no-block="true">
<b-card class="bg-warning" :no-body="true">
<div class="card-body pb-0">
<b-dropdown class="float-right" variant="transparent p-0" right>
<template slot="button-content">
@@ -56,7 +56,7 @@
</b-card>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<b-card class="bg-danger" :no-block="true">
<b-card class="bg-danger" :no-body="true">
<div class="card-body pb-0">
<b-dropdown class="float-right" variant="transparent p-0" right>
<template slot="button-content">
+16 -16
View File
@@ -70,7 +70,7 @@
</div><!--/.row-->
<div class="row">
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-3 clearfix">
<i class="fa fa-cogs bg-primary p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 mt-2">$1.999,50</div>
@@ -79,7 +79,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-3 clearfix">
<i class="fa fa-laptop bg-info p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 mt-2">$1.999,50</div>
@@ -88,7 +88,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-3 clearfix">
<i class="fa fa-moon-o bg-warning p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 mt-2">$1.999,50</div>
@@ -97,7 +97,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-3 clearfix">
<i class="fa fa-bell bg-danger p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 mt-2">$1.999,50</div>
@@ -106,7 +106,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block footer-class="px-3 py-2">
<b-card :no-body="true" footer-class="px-3 py-2">
<div class="card-body p-3 clearfix">
<i class="fa fa-cogs bg-primary p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 mt-2">$1.999,50</div>
@@ -118,7 +118,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block footer-class="px-3 py-2">
<b-card :no-body="true" footer-class="px-3 py-2">
<div class="card-body p-3 clearfix">
<i class="fa fa-laptop bg-info p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 mt-2">$1.999,50</div>
@@ -130,7 +130,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block footer-class="px-3 py-2">
<b-card :no-body="true" footer-class="px-3 py-2">
<div class="card-body p-3 clearfix">
<i class="fa fa-moon-o bg-warning p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 mt-2">$1.999,50</div>
@@ -142,7 +142,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block footer-class="px-3 py-2">
<b-card :no-body="true" footer-class="px-3 py-2">
<div class="card-body p-3 clearfix">
<i class="fa fa-bell bg-danger p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 mt-2">$1.999,50</div>
@@ -156,7 +156,7 @@
</div><!--/.row-->
<div class="row">
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-cogs bg-primary p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 pt-3">$1.999,50</div>
@@ -165,7 +165,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-laptop bg-info p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 pt-3">$1.999,50</div>
@@ -174,7 +174,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-moon-o bg-warning p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 pt-3">$1.999,50</div>
@@ -183,7 +183,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-bell bg-danger p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 pt-3">$1.999,50</div>
@@ -192,7 +192,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-cogs bg-primary p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 pt-3">$1.999,50</div>
@@ -201,7 +201,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-laptop bg-info p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 pt-3">$1.999,50</div>
@@ -210,7 +210,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-moon-o bg-warning p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 pt-3">$1.999,50</div>
@@ -219,7 +219,7 @@
</b-card>
</div><!--/.col-->
<div class="col-6 col-lg-3">
<b-card no-block>
<b-card :no-body="true">
<div class="card-body p-0 clearfix">
<i class="fa fa-bell bg-danger p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 pt-3">$1.999,50</div>
@@ -94,7 +94,7 @@
label="Static"
:label-cols="3"
:horizontal="true">
<b-form-input-static type="text" value="Username"></b-form-input-static>
<b-form-input plaintext type="text" value="Username"></b-form-input>
</b-form-fieldset>
<b-form-fieldset
description="This is a help text"