refactor: minor bug fixes and refactors
This commit is contained in:
woothu
+162
-197
@@ -1,212 +1,177 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<div>
|
||||
<!-- <CCard>
|
||||
<CNavbar toggleable="md" light variant="light">
|
||||
<CNavbarToggle class="hehe" @click="test2 = !test2"/>
|
||||
<CLink class="navbar-brand">NavBar</CLink>
|
||||
<CCollapse :duration="500" :show="test2" navbar @finish="test2 = test2" >
|
||||
<CNavbarNav pills class="navbar-nav">
|
||||
<CNavItem>
|
||||
hehehe1
|
||||
</CNavItem>
|
||||
<CNavItem class="nav-item">
|
||||
hehehe1
|
||||
</CNavItem>
|
||||
<CNavItem class="nav-item">
|
||||
hehehe2
|
||||
</CNavItem>
|
||||
<DefaultHeaderDropdownAccnt/>
|
||||
</CNavbarNav>
|
||||
<CNavbarNav class="ml-auto">
|
||||
<CDropdown right class="nav-item " toggle-classes="nav-link">
|
||||
<CDropdownItem><i class="cui-file" /> Projects
|
||||
<CBadge variant="primary">32</CBadge>
|
||||
</CDropdownItem>
|
||||
<CDropdownItem><i class="cui-shield" /> Lock Account</CDropdownItem>
|
||||
<CDropdownItem><i class="cui-lock-locked" /> Logout</CDropdownItem>
|
||||
</CDropdown>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCard> -->
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i>
|
||||
<strong> Bootstrap Navbar </strong>
|
||||
<div class="card-header-actions">
|
||||
<a
|
||||
href="https://coreui.io/vue/docs/3.0/components/Navbar"
|
||||
class="card-header-action"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
>
|
||||
<small class="text-muted">docs</small>
|
||||
</a>
|
||||
</div>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar
|
||||
toggleable="md"
|
||||
variant="info"
|
||||
<div>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i>
|
||||
<strong> Bootstrap Navbar </strong>
|
||||
<div class="card-header-actions">
|
||||
<a
|
||||
href="https://coreui.io/vue/docs/3.0/components/Navbar"
|
||||
class="card-header-action"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
>
|
||||
<CNavbarToggle @click="show=!show"/>
|
||||
<CNavbarBrand href="#">NavBar</CNavbarBrand>
|
||||
<CCollapse :show="show" navbar>
|
||||
<CNavbarNav>
|
||||
<CNavItem href="#">Link</CNavItem>
|
||||
<CNavItem href="#" disabled>Disabled</CNavItem>
|
||||
</CNavbarNav>
|
||||
<small class="text-muted">docs</small>
|
||||
</a>
|
||||
</div>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar
|
||||
toggleable="md"
|
||||
variant="info"
|
||||
>
|
||||
<CNavbarToggle @click="show=!show"/>
|
||||
<CNavbarBrand href="#">NavBar</CNavbarBrand>
|
||||
<CCollapse :show="show" navbar>
|
||||
<CNavbarNav>
|
||||
<CNavItem href="#">Link</CNavItem>
|
||||
<CNavItem href="#" disabled>Disabled</CNavItem>
|
||||
</CNavbarNav>
|
||||
|
||||
<!-- Right aligned nav items -->
|
||||
<CNavbarNav class="ml-auto">
|
||||
<CForm inline>
|
||||
<CFormInput
|
||||
class="mr-sm-2"
|
||||
placeholder="Search"
|
||||
size="sm"
|
||||
/>
|
||||
<CButton variant="light" size="sm" class="my-2 my-sm-0">
|
||||
Search
|
||||
</CButton>
|
||||
</CForm>
|
||||
<!-- Right aligned nav items -->
|
||||
<CNavbarNav class="ml-auto">
|
||||
<CForm inline>
|
||||
<CFormInput
|
||||
class="mr-sm-2"
|
||||
placeholder="Search"
|
||||
size="sm"
|
||||
/>
|
||||
<CButton variant="light" size="sm" class="my-2 my-sm-0">
|
||||
Search
|
||||
</CButton>
|
||||
</CForm>
|
||||
|
||||
<CDropdown
|
||||
button-html="Lang"
|
||||
nav
|
||||
placement="bottom-end"
|
||||
>
|
||||
<CDropdownItem>EN</CDropdownItem>
|
||||
<CDropdownItem>ES</CDropdownItem>
|
||||
<CDropdownItem>RU</CDropdownItem>
|
||||
<CDropdownItem>FA</CDropdownItem>
|
||||
</CDropdown>
|
||||
|
||||
<CDropdown
|
||||
nav
|
||||
buttonHtml="<em>User</em>"
|
||||
placement="bottom-end"
|
||||
>
|
||||
<CDropdownItem>Profile</CDropdownItem>
|
||||
<CDropdownItem>Signout</CDropdownItem>
|
||||
</CDropdown>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>brand</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<!-- Image and text -->
|
||||
<CNavbar variant="faded" light>
|
||||
<CNavbarBrand href="#">
|
||||
<img src="https://placekitten.com/g/30/30" class="d-inline-block align-top" alt="CoreuiVue">
|
||||
CoreuiVue
|
||||
</CNavbarBrand>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>text</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar toggleable="sm" light variant="light">
|
||||
<CNavbarToggle @click="navbarText=!navbarText"></CNavbarToggle>
|
||||
<CNavbarBrand>CoreuiVue</CNavbarBrand>
|
||||
<CCollapse :show="navbarText" navbar>
|
||||
<CNavbarNav>
|
||||
<span class="navbar-text">Navbar text</span>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>dropdown</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar toggleable="sm" variant="primary">
|
||||
<CNavbarToggle @click="navbarDropdown = !navbarDropdown"></CNavbarToggle>
|
||||
<CCollapse :show="navbarDropdown" navbar>
|
||||
<CNavbarNav>
|
||||
<CNavItem href="#">Home</CNavItem>
|
||||
<CNavItem href="#">Link</CNavItem>
|
||||
<!-- Navbar dropdowns -->
|
||||
<CDropdown
|
||||
button-html="Lang"
|
||||
right
|
||||
nav
|
||||
>
|
||||
<CDropdown
|
||||
button-html="Lang"
|
||||
nav
|
||||
placement="bottom-end"
|
||||
>
|
||||
<CDropdownItem>EN</CDropdownItem>
|
||||
<CDropdownItem>ES</CDropdownItem>
|
||||
<CDropdownItem>RU</CDropdownItem>
|
||||
<CDropdownItem>FA</CDropdownItem>
|
||||
</CDropdown>
|
||||
<CDropdown
|
||||
button-html="User"
|
||||
right
|
||||
nav
|
||||
>
|
||||
<CDropdownItem>Account</CDropdownItem>
|
||||
<CDropdownItem>Settings</CDropdownItem>
|
||||
</CDropdown>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>form</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar light variant="light">
|
||||
<CForm inline>
|
||||
<CFormInput
|
||||
class="mr-sm-2"
|
||||
placeholder="Search"
|
||||
size="sm"
|
||||
/>
|
||||
<CButton variant="outline-success" class="my-2 my-sm-0" type="submit">Search</CButton>
|
||||
</CForm>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>input group</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar light variant="light">
|
||||
<CForm inline>
|
||||
<CFormInput
|
||||
class="mr-sm-2"
|
||||
placeholder="Username"
|
||||
/>
|
||||
</CForm>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
</div>
|
||||
</CDropdown>
|
||||
|
||||
<CDropdown
|
||||
nav
|
||||
buttonHtml="<em>User</em>"
|
||||
placement="bottom-end"
|
||||
>
|
||||
<CDropdownItem>Profile</CDropdownItem>
|
||||
<CDropdownItem>Signout</CDropdownItem>
|
||||
</CDropdown>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>brand</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<!-- Image and text -->
|
||||
<CNavbar variant="faded" light>
|
||||
<CNavbarBrand href="#">
|
||||
<img src="https://placekitten.com/g/30/30" class="d-inline-block align-top" alt="CoreuiVue">
|
||||
CoreuiVue
|
||||
</CNavbarBrand>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>text</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar toggleable="sm" light variant="light">
|
||||
<CNavbarToggle @click="navbarText=!navbarText"></CNavbarToggle>
|
||||
<CNavbarBrand>CoreuiVue</CNavbarBrand>
|
||||
<CCollapse :show="navbarText" navbar>
|
||||
<CNavbarNav>
|
||||
<span class="navbar-text">Navbar text</span>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>dropdown</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar toggleable="sm" variant="primary">
|
||||
<CNavbarToggle @click="navbarDropdown = !navbarDropdown"></CNavbarToggle>
|
||||
<CCollapse :show="navbarDropdown" navbar>
|
||||
<CNavbarNav>
|
||||
<CNavItem href="#">Home</CNavItem>
|
||||
<CNavItem href="#">Link</CNavItem>
|
||||
<!-- Navbar dropdowns -->
|
||||
<CDropdown
|
||||
button-html="Lang"
|
||||
right
|
||||
nav
|
||||
>
|
||||
<CDropdownItem>EN</CDropdownItem>
|
||||
<CDropdownItem>ES</CDropdownItem>
|
||||
<CDropdownItem>RU</CDropdownItem>
|
||||
<CDropdownItem>FA</CDropdownItem>
|
||||
</CDropdown>
|
||||
<CDropdown
|
||||
button-html="User"
|
||||
right
|
||||
nav
|
||||
>
|
||||
<CDropdownItem>Account</CDropdownItem>
|
||||
<CDropdownItem>Settings</CDropdownItem>
|
||||
</CDropdown>
|
||||
</CNavbarNav>
|
||||
</CCollapse>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>form</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar light variant="light">
|
||||
<CForm inline>
|
||||
<CFormInput
|
||||
class="mr-sm-2"
|
||||
placeholder="Search"
|
||||
size="sm"
|
||||
/>
|
||||
<CButton variant="outline-success" class="my-2 my-sm-0" type="submit">Search</CButton>
|
||||
</CForm>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
<CCard>
|
||||
<CCardHeader>
|
||||
<i class="fa fa-align-justify"></i> <strong> Navbar </strong>
|
||||
<small>input group</small>
|
||||
</CCardHeader>
|
||||
<CCardBody>
|
||||
<CNavbar light variant="light">
|
||||
<CForm inline>
|
||||
<CFormInput
|
||||
class="mr-sm-2"
|
||||
placeholder="Username"
|
||||
/>
|
||||
</CForm>
|
||||
</CNavbar>
|
||||
</CCardBody>
|
||||
</CCard>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import DefaultHeaderDropdownAccnt from '../../containers/DefaultHeaderDropdownAccnt'
|
||||
export default {
|
||||
name: 'navbars',
|
||||
components: {
|
||||
DefaultHeaderDropdownAccnt
|
||||
},
|
||||
name: 'Navbars',
|
||||
data () {
|
||||
return {
|
||||
show: false,
|
||||
|
||||
Reference in New Issue
Block a user