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

Add designer to showcase

pull/12/head
cagataycivici 2019-06-11 16:03:11 +03:00
parent b39fdd1c90
commit 5ebf89d6d1
5 changed files with 45 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/AppFooter.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="content-section layout-footer clearfix">
<span>PrimeVUE 1.0.0-beta.1</span>
<span>PrimeVUE 1.0.0-beta.3</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>

2
src/AppTopBar.vue
View File

@ -13,6 +13,8 @@
<transition name="p-input-overlay" @enter="onThemesMenuEnter" @leave="onThemesMenuLeave">
<ul v-if="themesMenuVisible">
<li class="topbar-submenu-header">THEMING</li>
<li><router-link to="/theming" @click.native="hideThemesMenu()"><i class="pi pi-fw pi-file"/><span>Guide</span></router-link></li>
<li><a href="https://www.primefaces.org/designer/primevue"><i class="pi pi-fw pi-cog" /><span>Designer</span></a></li>
<li><router-link to="/icons" @click.native="hideThemesMenu()"><i class="pi pi-fw pi-search"/><span>Icons</span></router-link></li>
<li class="topbar-submenu-header">FREE THEMES</li>
<li><a href="#" @click="changeTheme($event, 'nova-light', false)"><img src="./assets/images/layouts/themeswitcher-nova-light.png" alt="Nova Light" /><span>Nova Light</span></a></li>

BIN
src/assets/images/primevue-designer.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 361 KiB

5
src/router.js
View File

@ -21,6 +21,11 @@ export default new Router({
name: 'support',
component: () => import('./views/support/Support.vue')
},
{
path: '/theming',
name: 'theming',
component: () => import('./views/theming/Theming.vue')
},
{
path: '/icons',
name: 'icons',

37
src/views/theming/Theming.vue Normal file
View File

@ -0,0 +1,37 @@
<template>
<div>
<div class="content-section introduction">
<div class="feature-intro">
<h1>Theming</h1>
<p>Choose from a variety of premium themes or develop your own theme using PrimeVue Theme Designer API.</p>
</div>
</div>
<div class="content-section documentation">
<h3 style="margin-top:0">Theme Designer API</h3>
<p><a href="https://www.primefaces.org/designer/primevue">Designer API</a> is the ultimate tool to create your own PrimeVue experience powered by a SASS based theme engine
with 500+ variables and a demo application. In addition, PrimeVue only ships the generated CSS of <b>Nova</b>, <b>Luna</b> and <b>Rhea</b> themes whereas Designer provides
full access to the whole SASS structure and the variables of these pre-built themes.</p>
<p>Whether you have your own style guide or just need a custom theme, Designer API is the right tool to design and bring them to existence.</p>
<p>Visit <a href="https://www.primefaces.org/designer/primevue">Designer API HomePage</a> for more information and live demos.</p>
<a href="http://www.primefaces.org/designer/primevue" class="designer-image">
<img alt="PrimeVue Designer" src="../../assets/images/primevue-designer.jpg" style="width: 100%" />
</a>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style scoped>
.designer-image {
display: block;
margin-top: 30px;
}
</style>