vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Refactor layout into smaller components

pull/3/head
cagataycivici 2018-12-06 21:45:40 +03:00
parent e669157faf
commit 54b226dff4
4 changed files with 50 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/App.vue
View File

@ -1,41 +1,25 @@
<template> <template>
<div class="layout-wrapper"> <div class="layout-wrapper">
<div class="layout-topbar"> <app-topbar />
<a class="menu-button"><i class="pi pi-bars"></i></a> <app-menu />
<router-link to="/" class="logo">
<img alt="logo" src="./assets/images/primevue-logo.png">
</router-link>
<ul class="topbar-menu">
<li><router-link to="/setup">Get Started</router-link></li>
<li class="topbar-menu-themes">
<a>Themes</a>
<ul>
<li class="topbar-submenu-header">THEMING</li>
<li class="topbar-submenu-header">FREE THEMES</li>
</ul>
</li>
<li><router-link to="/support">Support</router-link></li>
</ul>
</div>
<div class="layout-sidebar">
</div>
<div class="layout-content"> <div class="layout-content">
<router-view/> <router-view/>
<app-footer />
<div class="content-section layout-footer clearfix">
<span>Released under the MIT License, Copyright © 2018 <a href="http://www.primetek.com.tr" target="_blank" rel="noopener noreferrer">PrimeTek</a></span>
<div class="footer-links">
<a href="https://github.com/primefaces/primevue"><i class=" icon-github fa fa-github-square"></i></a>
<a href="https://twitter.com/primevue"><i class="icon-twitter fa fa-twitter-square"></i></a>
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { import AppTopBar from '@/AppTopBar.vue';
import AppMenu from '@/AppMenu.vue';
import AppFooter from '@/AppFooter.vue';
export default {
components: {
'app-topbar': AppTopBar,
'app-menu': AppMenu,
'app-footer': AppFooter
}
} }
</script> </script>

9
src/AppFooter.vue Normal file
View File

@ -0,0 +1,9 @@
<template>
<div class="content-section layout-footer clearfix">
<span>Released under the MIT License, Copyright © 2018 <a href="http://www.primetek.com.tr" target="_blank" rel="noopener noreferrer">PrimeTek</a></span>
<div class="footer-links">
<a href="https://github.com/primefaces/primevue"><i class=" icon-github fa fa-github-square"></i></a>
<a href="https://twitter.com/primevue"><i class="icon-twitter fa fa-twitter-square"></i></a>
</div>
</div>
</template>

10
src/AppMenu.vue Normal file
View File

@ -0,0 +1,10 @@
<template>
<div class="layout-sidebar">
</div>
</template>
<script>
export default {
}
</script>

19
src/AppTopBar.vue Normal file
View File

@ -0,0 +1,19 @@
<template>
<div class="layout-topbar">
<a class="menu-button"><i class="pi pi-bars"></i></a>
<router-link to="/" class="logo">
<img alt="logo" src="./assets/images/primevue-logo.png">
</router-link>
<ul class="topbar-menu">
<li><router-link to="/setup">Get Started</router-link></li>
<li class="topbar-menu-themes">
<a>Themes</a>
<ul>
<li class="topbar-submenu-header">THEMING</li>
<li class="topbar-submenu-header">FREE THEMES</li>
</ul>
</li>
<li><router-link to="/support">Support</router-link></li>
</ul>
</div>
</template>