sean/manja_ui_dev
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

refactor: small fixes and refactors, update coreui styles

Browse Source
This commit is contained in:
woothu
2019-10-15 10:53:25 +02:00
parent 14ba9223f9
commit 26d30c2fb0
11 changed files with 144 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+1 -1
View File
@@ -14,7 +14,7 @@
"test:e2e": "vue-cli-service test:e2e" "test:e2e": "vue-cli-service test:e2e"
}, },
"dependencies": { "dependencies": {
"@coreui/coreui": "3.0.0-alpha.13", "@coreui/coreui": "3.0.0-alpha.14",
"@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.1", "@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.1",
"@coreui/coreui-vue-chartjs": "../coreui-vue-chartjs", "@coreui/coreui-vue-chartjs": "../coreui-vue-chartjs",
"@coreui/icons": "github:coreui/coreui-icons#v1-alpha", "@coreui/icons": "github:coreui/coreui-icons#v1-alpha",
src/containers/TheHeader.vue
+5 -5
View File
@@ -2,7 +2,7 @@
<CHeader fixed with-subheader light> <CHeader fixed with-subheader light>
<CSidebarToggler <CSidebarToggler
class="c-header-toggler ml-3" class="c-header-toggler ml-3"
v-c-emit-root-event:c-sidebar-toggle v-c-emit-root-event:toggle-sidebar
/> />
<img <img
class="c-header-brand mx-auto d-lg-none" class="c-header-brand mx-auto d-lg-none"
@@ -11,12 +11,12 @@
height="46" height="46"
alt="CoreUI Logo" alt="CoreUI Logo"
/> />
<ul class="c-header-nav d-md-down-none mr-auto"> <CHeaderNav class="d-md-down-none mr-auto">
<CHeaderNavItem class="px-3" to="/dashboard">Dashboard</CHeaderNavItem> <CHeaderNavItem class="px-3" to="/dashboard">Dashboard</CHeaderNavItem>
<CHeaderNavItem class="px-3" to="/users" exact>Users</CHeaderNavItem> <CHeaderNavItem class="px-3" to="/users" exact>Users</CHeaderNavItem>
<CHeaderNavItem class="px-3">Settings</CHeaderNavItem> <CHeaderNavItem class="px-3">Settings</CHeaderNavItem>
</ul> </CHeaderNav>
<ul class="c-header-nav mr-4"> <CHeaderNav class="mr-4">
<CHeaderNavItem class="d-md-down-none mx-2"> <CHeaderNavItem class="d-md-down-none mx-2">
<i class="cui-bell"></i> <i class="cui-bell"></i>
</CHeaderNavItem> </CHeaderNavItem>
@@ -27,7 +27,7 @@
<i class="cui-envelope-open"></i> <i class="cui-envelope-open"></i>
</CHeaderNavItem> </CHeaderNavItem>
<TheHeaderDropdownAccnt/> <TheHeaderDropdownAccnt/>
</ul> </CHeaderNav>
<div class="c-subheader px-3"> <div class="c-subheader px-3">
<CBreadcrumbRouter class="border-0"/> <CBreadcrumbRouter class="border-0"/>
</div> </div>
src/containers/TheSidebar.vue
+6 -2
View File
@@ -13,7 +13,7 @@
<CRenderFunction :contentToRender="nav"/> <CRenderFunction :contentToRender="nav"/>
<!-- <CSidebarFooter/> --> <!-- <CSidebarFooter/> -->
<CSidebarMinimizer <CSidebarMinimizer
class="d-md-down-none" class="d-md-down-none c-sidebar-minimized-unfoldable"
@click.native="minimize = !minimize" @click.native="minimize = !minimize"
/> />
</CSidebar> </CSidebar>
@@ -26,8 +26,12 @@ export default {
data () { data () {
return { return {
minimize: false, minimize: false,
nav nav,
show: null
} }
},
mounted () {
this.$root.$on('toggle-sidebar', () => this.show = !this.show)
} }
} }
</script> </script>
src/views/base/Cards.vue
+3 -1
View File
@@ -66,7 +66,9 @@
Card with label Card with label
<CBadge pill variant="danger" class="float-right">42</CBadge> <CBadge pill variant="danger" class="float-right">42</CBadge>
</CCardHeader> </CCardHeader>
<CCardBody :body-html="loremIpsum"/> <CCardBody>
{{loremIpsum}}
</CCardBody>
</CCard> </CCard>
</CCol> </CCol>
</CRow> </CRow>
src/views/base/Forms.vue
+11 -7
View File
@@ -210,14 +210,14 @@
</CCol> </CCol>
<CCol sm="9" :class="key % 2 === 1 ? 'form-inline' : ''"> <CCol sm="9" :class="key % 2 === 1 ? 'form-inline' : ''">
<CFormRadio <CFormRadio
v-for="option in options" v-for="(option, optionIndex) in options"
:key="option" :key="option"
:label="option" :label="option"
type="radio" type="radio"
:value="option" :value="option"
:custom="key > 1" :custom="key > 1"
:name="`Option 1${key}`" :name="`Option 1${key}`"
checked="Option 1" :checked="optionIndex === key"
:inline="key % 2 === 1" :inline="key % 2 === 1"
/> />
</CCol> </CCol>
@@ -561,7 +561,7 @@
<CFormInput placeholder="Username"> <CFormInput placeholder="Username">
<template #prepend> <template #prepend>
<CDropdown <CDropdown
button-html="Action" togglerText="Action"
variant="primary" variant="primary"
> >
<CDropdownItem>Action</CDropdownItem> <CDropdownItem>Action</CDropdownItem>
@@ -578,7 +578,7 @@
> >
<template #append> <template #append>
<CDropdown <CDropdown
button-html="Action" togglerText="Action"
variant="primary" variant="primary"
right right
> >
@@ -593,7 +593,7 @@
<template #prepend> <template #prepend>
<CDropdown <CDropdown
button-html="Split" togglerText="Split"
variant="primary" variant="primary"
split split
> >
@@ -606,7 +606,7 @@
<template #append> <template #append>
<CDropdown <CDropdown
button-html="Action" togglerText="Action"
variant="primary" variant="primary"
right right
> >
@@ -861,7 +861,11 @@ export default {
options: ['Option 1', 'Option 2', 'Option 3'], options: ['Option 1', 'Option 2', 'Option 3'],
selectOptions: [ selectOptions: [
'Option 1', 'Option 2', 'Option 3', 'Option 1', 'Option 2', 'Option 3',
{ value: ['some value', 'another value'], label: 'Option 4' }], {
value: ['some value', 'another value'],
label: 'Selected option'
}
],
selectedOption: ['some value', 'another value'], selectedOption: ['some value', 'another value'],
formCollapsed: true, formCollapsed: true,
src/views/base/Navbars.vue
+5 -5
View File
@@ -20,7 +20,7 @@
toggleable="md" toggleable="md"
variant="info" variant="info"
> >
<CNavbarToggle @click="show=!show"/> <CNavbarToggler @click="show=!show"/>
<CNavbarBrand href="#">NavBar</CNavbarBrand> <CNavbarBrand href="#">NavBar</CNavbarBrand>
<CCollapse :show="show" navbar> <CCollapse :show="show" navbar>
<CNavbarNav> <CNavbarNav>
@@ -42,7 +42,7 @@
</CForm> </CForm>
<CDropdown <CDropdown
button-html="Lang" toggler-text="Lang"
nav nav
placement="bottom-end" placement="bottom-end"
> >
@@ -54,7 +54,7 @@
<CDropdown <CDropdown
nav nav
buttonHtml="<em>User</em>" toggler-text="User"
placement="bottom-end" placement="bottom-end"
> >
<CDropdownItem>Profile</CDropdownItem> <CDropdownItem>Profile</CDropdownItem>
@@ -111,7 +111,7 @@
<CNavItem href="#">Link</CNavItem> <CNavItem href="#">Link</CNavItem>
<!-- Navbar dropdowns --> <!-- Navbar dropdowns -->
<CDropdown <CDropdown
button-html="Lang" toggler-text="Lang"
right right
nav nav
> >
@@ -121,7 +121,7 @@
<CDropdownItem>FA</CDropdownItem> <CDropdownItem>FA</CDropdownItem>
</CDropdown> </CDropdown>
<CDropdown <CDropdown
button-html="User" toggler-text="User"
right right
nav nav
> >
src/views/base/ProgressBars.vue
+10 -10
View File
@@ -16,7 +16,7 @@
</div> </div>
</CCardHeader> </CCardHeader>
<CCardBody> <CCardBody>
<CProgress :value="counter" :max="max" show-progress animated></CProgress> <CProgress :value="counter" :max="max" show-percentage animated></CProgress>
<CProgress class="mt-1" :max="max" show-value> <CProgress class="mt-1" :max="max" show-value>
<CProgressBar :value="counter*(6/10)" variant="success"/> <CProgressBar :value="counter*(6/10)" variant="success"/>
<CProgressBar :value="counter*(2.5/10)" variant="warning"/> <CProgressBar :value="counter*(2.5/10)" variant="warning"/>
@@ -41,11 +41,11 @@
<h6>Value label</h6> <h6>Value label</h6>
<CProgress :value="value" :max="max2" show-value class="mb-3"/> <CProgress :value="value" :max="max2" show-value class="mb-3"/>
<h6>Progress label</h6> <h6>Progress label</h6>
<CProgress :value="value" :max="max2" show-progress class="mb-3"/> <CProgress :value="value" :max="max2" show-percentage class="mb-3"/>
<h6>Value label with precision</h6> <h6>Value label with precision</h6>
<CProgress :value="value" :max="max2" :precision="2" show-value class="mb-3"/> <CProgress :value="value" :max="max2" :precision="2" show-value class="mb-3"/>
<h6>Progress label with precision</h6> <h6>Progress label with precision</h6>
<CProgress :value="value" :max="max2" :precision="2" show-progress class="mb-3"/> <CProgress :value="value" :max="max2" :precision="2" show-percentage class="mb-3"/>
</CCardBody> </CCardBody>
</CCard> </CCard>
<CCard> <CCard>
@@ -71,10 +71,10 @@
</CCardHeader> </CCardHeader>
<CCardBody> <CCardBody>
<h6>Default height</h6> <h6>Default height</h6>
<CProgress :value="value3" show-progress class="mb-3"/> <CProgress :value="value3" show-percentage class="mb-3"/>
<h6>Custom heights</h6> <h6>Custom heights</h6>
<CProgress height="2rem" :value="value3" show-progress class="mb-2"/> <CProgress height="2rem" :value="value3" show-percentage class="mb-2"/>
<CProgress height="20px" :value="value3" show-progress class="mb-2"/> <CProgress height="20px" :value="value3" show-percentage class="mb-2"/>
<CProgress height="2px" :value="value3"/> <CProgress height="2px" :value="value3"/>
</CCardBody> </CCardBody>
</CCard> </CCard>
@@ -184,7 +184,7 @@
<CProgressBar variant="success" :value="values[1]"/> <CProgressBar variant="success" :value="values[1]"/>
<CProgressBar variant="info" :value="values[2]"/> <CProgressBar variant="info" :value="values[2]"/>
</CProgress> </CProgress>
<CProgress show-progress :max="max3" class="mb-3"> <CProgress show-percentage :max="max3" class="mb-3">
<CProgressBar variant="primary" :value="values[0]"/> <CProgressBar variant="primary" :value="values[0]"/>
<CProgressBar variant="success" :value="values[1]"/> <CProgressBar variant="success" :value="values[1]"/>
<CProgressBar variant="info" :value="values[2]"/> <CProgressBar variant="info" :value="values[2]"/>
@@ -195,9 +195,9 @@
<CProgressBar variant="info" :value="values[2]"/> <CProgressBar variant="info" :value="values[2]"/>
</CProgress> </CProgress>
<CProgress :max="max3" class="mb-3"> <CProgress :max="max3" class="mb-3">
<CProgressBar variant="primary" :value="values[0]" show-progress/> <CProgressBar variant="primary" :value="values[0]" show-percentage/>
<CProgressBar variant="success" :value="values[1]" animated show-progress/> <CProgressBar variant="success" :value="values[1]" animated show-percentage/>
<CProgressBar variant="info" :value="values[2]" striped show-progress/> <CProgressBar variant="info" :value="values[2]" striped show-percentage/>
</CProgress> </CProgress>
</CCardBody> </CCardBody>
</CCard> </CCard>
src/views/base/Table.vue
+1 -1
View File
@@ -8,7 +8,7 @@
:fixed="fixed" :fixed="fixed"
:items="items" :items="items"
:fields="fields" :fields="fields"
:per-page="small ? 10 : 5" :items-per-page="small ? 10 : 5"
:dark="dark" :dark="dark"
pagination pagination
> >
src/views/buttons/ButtonGroups.vue
+64 -70
View File
@@ -125,78 +125,72 @@
</div> --> </div> -->
</CCardHeader> </CCardHeader>
<CCardBody> <CCardBody>
<div> <CButtonToolbar aria-label="Toolbar with button groups" >
<CButtonToolbar aria-label="Toolbar with button groups"> <CButtonGroup class="mx-1">
<CButtonGroup class="mx-1"> <CButton variant="secondary" class="d-sm-down-none">&laquo;</CButton>
<CButton variant="secondary" class="d-sm-down-none">&laquo;</CButton> <CButton variant="secondary">&lsaquo;</CButton>
<CButton variant="secondary">&lsaquo;</CButton> </CButtonGroup>
</CButtonGroup> <CButtonGroup class="mx-1">
<CButtonGroup class="mx-1"> <CButton variant="secondary" class="d-sm-down-none">Edit</CButton>
<CButton variant="secondary" class="d-sm-down-none">Edit</CButton> <CButton variant="secondary">Undo</CButton>
<CButton variant="secondary">Undo</CButton> <CButton variant="secondary">Redo</CButton>
<CButton variant="secondary">Redo</CButton> </CButtonGroup>
</CButtonGroup> <CButtonGroup class="mx-1">
<CButtonGroup class="mx-1"> <CButton variant="secondary">&rsaquo;</CButton>
<CButton variant="secondary">&rsaquo;</CButton> <CButton variant="secondary" class="d-sm-down-none">&raquo;</CButton>
<CButton variant="secondary" class="d-sm-down-none">&raquo;</CButton> </CButtonGroup>
</CButtonGroup> </CButtonToolbar>
</CButtonToolbar>
</div>
<hr class="d-sm-down-none"/> <hr class="d-sm-down-none"/>
<div> <CButtonToolbar
<CButtonToolbar aria-label="Toolbar with button groups and input groups"
aria-label="Toolbar with button groups and input groups" class="d-sm-down-none"
class="d-sm-down-none" >
> <CButtonGroup size="sm" class="mx-1">
<CButtonGroup size="sm" class="mx-1"> <CButton variant="secondary">New</CButton>
<CButton variant="secondary">New</CButton> <CButton variant="secondary">Edit</CButton>
<CButton variant="secondary">Edit</CButton> </CButtonGroup>
</CButtonGroup> <CFormInput
<CFormInput class="mb-0 w-25 mx-1"
class="mb-0 w-25 mx-1" size="sm"
size="sm" prepend-html="$"
prepend-html="$" append-html=".00"
append-html=".00" value="100"
value="100" />
/> <CFormSelect
<CFormSelect class="mb-0 w-25 mx-1"
class="mb-0 w-25 mx-1" size="sm"
size="sm" prepend-html="Size"
prepend-html="Size" value="Medium"
value="Medium" :options="['Large','Medium','Small']"
:options="['Large','Medium','Small']" custom
custom />
/> <CButtonGroup size="sm" class="mx-1">
<CButtonGroup size="sm" class="mx-1"> <CButton variant="secondary">Save</CButton>
<CButton variant="secondary">Save</CButton> <CButton variant="secondary">Cancel</CButton>
<CButton variant="secondary">Cancel</CButton> </CButtonGroup>
</CButtonGroup> </CButtonToolbar>
</CButtonToolbar>
</div>
<hr/> <hr/>
<div> <CButtonToolbar aria-label="Toolbar with button groups and dropdown menu">
<CButtonToolbar aria-label="Toolbar with button groups and dropdown menu"> <CButtonGroup class="mx-1 d-sm-down-none">
<CButtonGroup class="mx-1 d-sm-down-none"> <CButton variant="secondary">New</CButton>
<CButton variant="secondary">New</CButton> <CButton variant="secondary">Edit</CButton>
<CButton variant="secondary">Edit</CButton> <CButton variant="secondary">Undo</CButton>
<CButton variant="secondary">Undo</CButton> </CButtonGroup>
</CButtonGroup> <CDropdown
<CDropdown variant="secondary"
variant="secondary" class="mx-1"
class="mx-1" placement="bottom-end"
placement="bottom-end" button-content="Menu"
button-content="Menu" >
> <CDropdownItem>Item 1</CDropdownItem>
<CDropdownItem>Item 1</CDropdownItem> <CDropdownItem>Item 2</CDropdownItem>
<CDropdownItem>Item 2</CDropdownItem> <CDropdownItem>Item 3</CDropdownItem>
<CDropdownItem>Item 3</CDropdownItem> </CDropdown>
</CDropdown> <CButtonGroup class="mx-1">
<CButtonGroup class="mx-1"> <CButton variant="secondary">Save</CButton>
<CButton variant="secondary">Save</CButton> <CButton variant="secondary">Cancel</CButton>
<CButton variant="secondary">Cancel</CButton> </CButtonGroup>
</CButtonGroup> </CButtonToolbar>
</CButtonToolbar>
</div>
</CCardBody> </CCardBody>
</CCard> </CCard>
</CCol> </CCol>
src/views/notifications/Modals.vue
+11 -11
View File
@@ -54,7 +54,7 @@
<!-- Modal Component --> <!-- Modal Component -->
<CModal <CModal
title="Modal title" title="Modal title"
:visible.sync="myModal" :show.sync="myModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -66,7 +66,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
size="lg" size="lg"
:visible.sync="largeModal" :show.sync="largeModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -78,7 +78,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
size="sm" size="sm"
:visible.sync="smallModal" :show.sync="smallModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -90,7 +90,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
:visible.sync="primaryModal" :show.sync="primaryModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -102,7 +102,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
variant="success" variant="success"
:visible.sync="successModal" :show.sync="successModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -114,7 +114,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
variant="warning" variant="warning"
:visible.sync="warningModal" :show.sync="warningModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -126,7 +126,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
variant="danger" variant="danger"
:visible.sync="dangerModal" :show.sync="dangerModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -138,7 +138,7 @@
<CModal <CModal
title="Modal title" title="Modal title"
variant="info" variant="info"
:visible.sync="infoModal" :show.sync="infoModal"
> >
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
@@ -148,7 +148,7 @@
proident, sunt in culpa qui officia deserunt mollit anim id est laborum. proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</CModal> </CModal>
<CModal <CModal
:visible.sync="darkModal" :show.sync="darkModal"
:no-close-on-backdrop="true" :no-close-on-backdrop="true"
:centered="true" :centered="true"
title="Modal title 2" title="Modal title 2"
@@ -166,8 +166,8 @@
<CButtonClose @click="hide()" class="text-white"/> <CButtonClose @click="hide()" class="text-white"/>
</template> </template>
<template #footer="{hide}"> <template #footer="{hide}">
<CButton @click="hide()" variant="danger">Discard</CButton> <CButton @click="darkModal = false" variant="danger">Discard</CButton>
<CButton @click="hide(true)" variant="success">Accept</CButton> <CButton @click="darkModal = false" variant="success">Accept</CButton>
</template> </template>
</CModal> </CModal>
</div> </div>
src/views/users/UsersData.js
+27 -26
View File
@@ -1,30 +1,31 @@
const usersData = [ const usersData = [
{id: 1, name: 'Samppa Nori', registered: '2018/01/01', role: 'Member', status: 'Active'}, { username: 'Samppa Nori', registered: '2012/01/01', role: 'Member', status: 'Active'},
{id: 2, name: 'Estavan Lykos', registered: '2018/02/01', role: 'Staff', status: 'Banned'}, { username: 'Estavan Lykos', registered: '2012/02/01', role: 'Staff', status: 'Banned'},
{id: 3, name: 'Chetan Mohamed', registered: '2018/02/01', role: 'Admin', status: 'Inactive'}, { username: 'Chetan Mohamed', registered: '2012/02/01', role: 'Admin', status: 'Inactive'},
{id: 4, name: 'Derick Maximinus', registered: '2018/03/01', role: 'Member', status: 'Pending'}, { username: 'Derick Maximinus', registered: '2012/03/01', role: 'Member', status: 'Pending'},
{id: 5, name: 'Friderik Dávid', registered: '2018/01/21', role: 'Staff', status: 'Active'}, { username: 'Friderik Dávid', registered: '2012/01/21', role: 'Staff', status: 'Active'},
{id: 6, name: 'Yiorgos Avraamu', registered: '2018/01/01', role: 'Member', status: 'Active'}, { username: 'Yiorgos Avraamu', registered: '2012/01/01', role: 'Member', status: 'Active'},
{id: 7, name: 'Avram Tarasios', registered: '2018/02/01', role: 'Staff', status: 'Banned'}, { username: 'Avram Tarasios', registered: '2012/02/01', role: 'Staff', status: 'Banned', _classes: 'table-success'},
{id: 8, name: 'Quintin Ed', registered: '2018/02/01', role: 'Admin', status: 'Inactive'}, { username: 'Quintin Ed', registered: '2012/02/01', role: 'Admin', status: 'Inactive'},
{id: 9, name: 'Enéas Kwadwo', registered: '2018/03/01', role: 'Member', status: 'Pending'}, { username: 'Enéas Kwadwo', registered: '2012/03/01', role: 'Member', status: 'Pending'},
{id: 10, name: 'Agapetus Tadeáš', registered: '2018/01/21', role: 'Staff', status: 'Active'}, { username: 'Agapetus Tadeáš', registered: '2012/01/21', role: 'Staff', status: 'Active'},
{id: 11, name: 'Carwyn Fachtna', registered: '2018/01/01', role: 'Member', status: 'Active'}, { username: 'Carwyn Fachtna', registered: '2012/01/01', role: 'Member', status: 'Active', _classes: 'table-success'},
{id: 12, name: 'Nehemiah Tatius', registered: '2018/02/01', role: 'Staff', status: 'Banned'}, { username: 'Nehemiah Tatius', registered: '2012/02/01', role: 'Staff', status: 'Banned'},
{id: 13, name: 'Ebbe Gemariah', registered: '2018/02/01', role: 'Admin', status: 'Inactive'}, { username: 'Ebbe Gemariah', registered: '2012/02/01', role: 'Admin', status: 'Inactive'},
{id: 14, name: 'Eustorgios Amulius', registered: '2018/03/01', role: 'Member', status: 'Pending'}, { username: 'Eustorgios Amulius', registered: '2012/03/01', role: 'Member', status: 'Pending'},
{id: 15, name: 'Leopold Gáspár', registered: '2018/01/21', role: 'Staff', status: 'Active'}, { username: 'Leopold Gáspár', registered: '2012/01/21', role: 'Staff', status: 'Active'},
{id: 16, name: 'Pompeius René', registered: '2018/01/01', role: 'Member', status: 'Active'}, { username: 'Pompeius René', registered: '2012/01/01', role: 'Member', status: 'Active'},
{id: 17, name: 'Paĉjo Jadon', registered: '2018/02/01', role: 'Staff', status: 'Banned'}, { username: 'Paĉjo Jadon', registered: '2012/02/01', role: 'Staff', status: 'Banned'},
{id: 18, name: 'Micheal Mercurius', registered: '2018/02/01', role: 'Admin', status: 'Inactive'}, { username: 'Micheal Mercurius', registered: '2012/02/01', role: 'Admin', status: 'Inactive'},
{id: 19, name: 'Ganesha Dubhghall', registered: '2018/03/01', role: 'Member', status: 'Pending'}, { username: 'Ganesha Dubhghall', registered: '2012/03/01', role: 'Member', status: 'Pending'},
{id: 20, name: 'Hiroto Šimun', registered: '2018/01/21', role: 'Staff', status: 'Active'}, { username: 'Hiroto Šimun', registered: '2012/01/21', role: 'Staff', status: 'Active'},
{id: 21, name: 'Vishnu Serghei', registered: '2018/01/01', role: 'Member', status: 'Active'}, { username: 'Vishnu Serghei', registered: '2012/01/01', role: 'Member', status: 'Active'},
{id: 22, name: 'Zbyněk Phoibos', registered: '2018/02/01', role: 'Staff', status: 'Banned'}, { username: 'Zbyněk Phoibos', registered: '2012/02/01', role: 'Staff', status: 'Banned'},
{id: 23, name: 'Einar Randall', registered: '2018/02/01', role: 'Admin', status: 'Inactive'}, { username: 'Einar Randall', registered: '2012/02/01', role: 'Admin', status: 'Inactive', _classes: 'table-danger'},
{id: 24, name: 'Félix Troels', registered: '2018/03/21', role: 'Staff', status: 'Active'}, { username: 'Félix Troels', registered: '2012/03/21', role: 'Staff', status: 'Active'},
{id: 25, name: 'Aulus Agmundr', registered: '2018/01/01', role: 'Member', status: 'Pending'}, { username: 'Aulus Agmundr', registered: '2012/01/01', role: 'Member', status: 'Pending'}
{id: 42, name: 'Ford Prefex', registered: '2001/05/21', role: 'Alien', status: 'Don\'t panic!'}
] ]
export default usersData export default usersData