Add theme display at topbar
cagataycivici
parent
4c4f605d54
commit
f5030cd4ad
|
Before Width: | Height: | Size: 8.0 KiB After Width: | Height: | Size: 8.0 KiB |
|
Before Width: | Height: | Size: 7.9 KiB After Width: | Height: | Size: 7.9 KiB |
|
Before Width: | Height: | Size: 7.8 KiB After Width: | Height: | Size: 7.8 KiB |
|
Before Width: | Height: | Size: 7.8 KiB After Width: | Height: | Size: 7.8 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 576 B After Width: | Height: | Size: 576 B |
|
Before Width: | Height: | Size: 576 B After Width: | Height: | Size: 576 B |
|
Before Width: | Height: | Size: 576 B After Width: | Height: | Size: 576 B |
|
Before Width: | Height: | Size: 576 B After Width: | Height: | Size: 576 B |
|
Before Width: | Height: | Size: 970 B After Width: | Height: | Size: 970 B |
|
Before Width: | Height: | Size: 991 B After Width: | Height: | Size: 991 B |
|
Before Width: | Height: | Size: 943 B After Width: | Height: | Size: 943 B |
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
15
src/App.vue
15
src/App.vue
|
|
@ -18,8 +18,8 @@
|
||||||
<router-view/>
|
<router-view/>
|
||||||
<app-footer />
|
<app-footer />
|
||||||
</div>
|
</div>
|
||||||
<div class="app-theme">
|
<div class="app-theme" v-tooltip.bottom="theme">
|
||||||
<img :src="getLogo()" />
|
<img :src="'demo/images/themes/' + logoMap[theme]" />
|
||||||
</div>
|
</div>
|
||||||
<Toast />
|
<Toast />
|
||||||
<Toast position="topleft" group="tl" />
|
<Toast position="topleft" group="tl" />
|
||||||
|
|
@ -46,15 +46,14 @@ export default {
|
||||||
'bootstrap4-light-purple': 'bootstrap4-light-purple.svg',
|
'bootstrap4-light-purple': 'bootstrap4-light-purple.svg',
|
||||||
'bootstrap4-dark-blue': 'bootstrap4-dark-blue.svg',
|
'bootstrap4-dark-blue': 'bootstrap4-dark-blue.svg',
|
||||||
'bootstrap4-dark-purple': 'bootstrap4-dark-purple.svg',
|
'bootstrap4-dark-purple': 'bootstrap4-dark-purple.svg',
|
||||||
'bootstrap4-dark-purple': 'bootstrap4-dark-purple.svg',
|
|
||||||
'md-light-indigo': 'md-light-indigo.svg',
|
'md-light-indigo': 'md-light-indigo.svg',
|
||||||
'md-light-purple': 'md-light-purple.svg',
|
'md-light-purple': 'md-light-purple.svg',
|
||||||
'md-dark-indigo': 'md-dark-indigo.svg',
|
'md-dark-indigo': 'md-dark-indigo.svg',
|
||||||
'md-dark-indigo': 'md-dark-purple.svg',
|
'md-dark-purple': 'md-dark-purple.svg',
|
||||||
'mdc-light-indigo': 'md-light-indigo.svg',
|
'mdc-light-indigo': 'md-light-indigo.svg',
|
||||||
'mdc-light-purple': 'md-light-purple.svg',
|
'mdc-light-purple': 'md-light-purple.svg',
|
||||||
'mdc-dark-indigo': 'md-dark-indigo.svg',
|
'mdc-dark-indigo': 'md-dark-indigo.svg',
|
||||||
'mdc-dark-indigo': 'md-dark-purple.svg',
|
'mdc-dark-purple': 'md-dark-purple.svg',
|
||||||
'saga-blue': 'saga-blue.png',
|
'saga-blue': 'saga-blue.png',
|
||||||
'saga-green': 'saga-green.png',
|
'saga-green': 'saga-green.png',
|
||||||
'saga-orange': 'saga-orange.png',
|
'saga-orange': 'saga-orange.png',
|
||||||
|
|
@ -152,11 +151,7 @@ export default {
|
||||||
}
|
}
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
},
|
}
|
||||||
getLogo() {
|
|
||||||
var images = require.context('./assets/images/themes', false);
|
|
||||||
return images('./' + this.logoMap[this.theme]);
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
containerClass() {
|
containerClass() {
|
||||||
|
|
|
||||||
|
|
@ -29,25 +29,25 @@
|
||||||
<div class="p-grid free-themes">
|
<div class="p-grid free-themes">
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/bootstrap4-light-blue.svg" alt="Bootstrap Light Blue" @click="changeTheme($event, 'bootstrap4-light-blue')"/>
|
<img src="demo/images/themes/bootstrap4-light-blue.svg" alt="Bootstrap Light Blue" @click="changeTheme($event, 'bootstrap4-light-blue')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Blue</span>
|
<span>Blue</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/bootstrap4-light-purple.svg" alt="Bootstrap Light Blue" @click="changeTheme($event, 'bootstrap4-light-purple')"/>
|
<img src="demo/images/themes/bootstrap4-light-purple.svg" alt="Bootstrap Light Blue" @click="changeTheme($event, 'bootstrap4-light-purple')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Purple</span>
|
<span>Purple</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/bootstrap4-dark-blue.svg" alt="Bootstrap Dark Blue" @click="changeTheme($event, 'bootstrap4-dark-blue', true)"/>
|
<img src="demo/images/themes/bootstrap4-dark-blue.svg" alt="Bootstrap Dark Blue" @click="changeTheme($event, 'bootstrap4-dark-blue', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Blue</span>
|
<span>Blue</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/bootstrap4-dark-purple.svg" alt="Bootstrap Dark Blue" @click="changeTheme($event, 'bootstrap4-dark-purple', true)"/>
|
<img src="demo/images/themes/bootstrap4-dark-purple.svg" alt="Bootstrap Dark Blue" @click="changeTheme($event, 'bootstrap4-dark-purple', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Purple</span>
|
<span>Purple</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -57,25 +57,25 @@
|
||||||
<div class="p-grid free-themes">
|
<div class="p-grid free-themes">
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-light-indigo.svg" alt="Material Light Indigo" @click="changeTheme($event, 'md-light-indigo')"/>
|
<img src="demo/images/themes/md-light-indigo.svg" alt="Material Light Indigo" @click="changeTheme($event, 'md-light-indigo')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Indigo</span>
|
<span>Indigo</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-light-deeppurple.svg" alt="Material Light Deep Purple" @click="changeTheme($event, 'md-light-deeppurple')"/>
|
<img src="demo/images/themes/md-light-deeppurple.svg" alt="Material Light Deep Purple" @click="changeTheme($event, 'md-light-deeppurple')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Deep Purple</span>
|
<span>Deep Purple</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-dark-indigo.svg" alt="Material Dark Indigo" @click="changeTheme($event, 'md-dark-indigo', true)"/>
|
<img src="demo/images/themes/md-dark-indigo.svg" alt="Material Dark Indigo" @click="changeTheme($event, 'md-dark-indigo', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Indigo</span>
|
<span>Indigo</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-dark-deeppurple.svg" alt="Material Dark Deep Purple" @click="changeTheme($event, 'md-dark-deeppurple', true)"/>
|
<img src="demo/images/themes/md-dark-deeppurple.svg" alt="Material Dark Deep Purple" @click="changeTheme($event, 'md-dark-deeppurple', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Deep Purple</span>
|
<span>Deep Purple</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -85,25 +85,25 @@
|
||||||
<div class="p-grid free-themes">
|
<div class="p-grid free-themes">
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-light-indigo.svg" alt="Material Compact Light Indigo" @click="changeTheme($event, 'mdc-light-indigo')"/>
|
<img src="demo/images/themes/md-light-indigo.svg" alt="Material Compact Light Indigo" @click="changeTheme($event, 'mdc-light-indigo')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Indigo</span>
|
<span>Indigo</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-light-deeppurple.svg" alt="Material Compact Deep Purple" @click="changeTheme($event, 'mdc-light-deeppurple')"/>
|
<img src="demo/images/themes/md-light-deeppurple.svg" alt="Material Compact Deep Purple" @click="changeTheme($event, 'mdc-light-deeppurple')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Deep Purple</span>
|
<span>Deep Purple</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-dark-indigo.svg" alt="Material Compact Dark Indigo" @click="changeTheme($event, 'mdc-dark-indigo', true)"/>
|
<img src="demo/images/themes/md-dark-indigo.svg" alt="Material Compact Dark Indigo" @click="changeTheme($event, 'mdc-dark-indigo', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Indigo</span>
|
<span>Indigo</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/md-dark-deeppurple.svg" alt="Material Compact Dark Deep Purple" @click="changeTheme($event, 'mdc-dark-deeppurple', true)"/>
|
<img src="demo/images/themes/md-dark-deeppurple.svg" alt="Material Compact Dark Deep Purple" @click="changeTheme($event, 'mdc-dark-deeppurple', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Deep Purple</span>
|
<span>Deep Purple</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -113,73 +113,73 @@
|
||||||
<div class="p-grid free-themes">
|
<div class="p-grid free-themes">
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/saga-blue.png" alt="Saga Blue" @click="changeTheme($event, 'saga-blue')"/>
|
<img src="demo/images/themes/saga-blue.png" alt="Saga Blue" @click="changeTheme($event, 'saga-blue')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Saga Blue</span>
|
<span>Saga Blue</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/saga-green.png" alt="Saga Green" @click="changeTheme($event, 'saga-green')"/>
|
<img src="demo/images/themes/saga-green.png" alt="Saga Green" @click="changeTheme($event, 'saga-green')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Saga Green</span>
|
<span>Saga Green</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/saga-orange.png" alt="Saga Orange" @click="changeTheme($event, 'saga-orange')"/>
|
<img src="demo/images/themes/saga-orange.png" alt="Saga Orange" @click="changeTheme($event, 'saga-orange')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Saga Orange</span>
|
<span>Saga Orange</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/saga-purple.png" alt="Saga Purple" @click="changeTheme($event, 'saga-purple')"/>
|
<img src="demo/images/themes/saga-purple.png" alt="Saga Purple" @click="changeTheme($event, 'saga-purple')"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Saga Purple</span>
|
<span>Saga Purple</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/vela-blue.png" alt="Vela Blue" @click="changeTheme($event, 'vela-blue', true)"/>
|
<img src="demo/images/themes/vela-blue.png" alt="Vela Blue" @click="changeTheme($event, 'vela-blue', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Vela Blue</span>
|
<span>Vela Blue</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/vela-green.png" alt="Vela Green" @click="changeTheme($event, 'vela-green', true)"/>
|
<img src="demo/images/themes/vela-green.png" alt="Vela Green" @click="changeTheme($event, 'vela-green', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Vela Green</span>
|
<span>Vela Green</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/vela-orange.png" alt="Vela Orange" @click="changeTheme($event, 'vela-orange', true)"/>
|
<img src="demo/images/themes/vela-orange.png" alt="Vela Orange" @click="changeTheme($event, 'vela-orange', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Vela Orange</span>
|
<span>Vela Orange</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/vela-purple.png" alt="Vela Purple" @click="changeTheme($event, 'vela-purple', true)"/>
|
<img src="demo/images/themes/vela-purple.png" alt="Vela Purple" @click="changeTheme($event, 'vela-purple', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Vela Purple</span>
|
<span>Vela Purple</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/arya-blue.png" alt="Arya Blue" @click="changeTheme($event, 'arya-blue', true)"/>
|
<img src="demo/images/themes/arya-blue.png" alt="Arya Blue" @click="changeTheme($event, 'arya-blue', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Arya Blue</span>
|
<span>Arya Blue</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/arya-green.png" alt="Arya Green" @click="changeTheme($event, 'arya-green', true)"/>
|
<img src="demo/images/themes/arya-green.png" alt="Arya Green" @click="changeTheme($event, 'arya-green', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Arya Green</span>
|
<span>Arya Green</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/arya-orange.png" alt="Arya Orange" @click="changeTheme($event, 'arya-orange', true)"/>
|
<img src="demo/images/themes/arya-orange.png" alt="Arya Orange" @click="changeTheme($event, 'arya-orange', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Arya Orange</span>
|
<span>Arya Orange</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="p-col-3">
|
<div class="p-col-3">
|
||||||
<button class="p-link">
|
<button class="p-link">
|
||||||
<img src="./assets/images/themes/arya-purple.png" alt="Arya Purple" @click="changeTheme($event, 'arya-purple', true)"/>
|
<img src="demo/images/themes/arya-purple.png" alt="Arya Purple" @click="changeTheme($event, 'arya-purple', true)"/>
|
||||||
</button>
|
</button>
|
||||||
<span>Arya Purple</span>
|
<span>Arya Purple</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -17,36 +17,36 @@
|
||||||
<li><a href="https://www.primefaces.org/designer/primevue"><i class="pi pi-fw pi-palette" /><span>Designer</span></a></li>
|
<li><a href="https://www.primefaces.org/designer/primevue"><i class="pi pi-fw pi-palette" /><span>Designer</span></a></li>
|
||||||
<li><router-link to="/icons"><i class="pi pi-fw pi-info-circle"/><span>Icons</span></router-link></li>
|
<li><router-link to="/icons"><i class="pi pi-fw pi-info-circle"/><span>Icons</span></router-link></li>
|
||||||
<li class="topbar-submenu-header">BOOTSTRAP</li>
|
<li class="topbar-submenu-header">BOOTSTRAP</li>
|
||||||
<li><a @click="changeTheme($event, 'bootstrap4-light-blue')"><img src="./assets/images/themes/bootstrap4-light-blue.svg" alt="Blue Light" /><span>Blue Light</span></a></li>
|
<li><a @click="changeTheme($event, 'bootstrap4-light-blue')"><img src="demo/images/themes/bootstrap4-light-blue.svg" alt="Blue Light" /><span>Blue Light</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'bootstrap4-light-purple')"><img src="./assets/images/themes/bootstrap4-light-purple.svg" alt="Purple Light" /><span>Purple Light</span></a></li>
|
<li><a @click="changeTheme($event, 'bootstrap4-light-purple')"><img src="demo/images/themes/bootstrap4-light-purple.svg" alt="Purple Light" /><span>Purple Light</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'bootstrap4-dark-blue')"><img src="./assets/images/themes/bootstrap4-dark-blue.svg" alt="Blue Dark" /><span>Blue Dark</span></a></li>
|
<li><a @click="changeTheme($event, 'bootstrap4-dark-blue')"><img src="demo/images/themes/bootstrap4-dark-blue.svg" alt="Blue Dark" /><span>Blue Dark</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'bootstrap4-dark-purple')"><img src="./assets/images/themes/bootstrap4-dark-purple.svg" alt="Purple Dark" /><span>Purple Dark</span></a></li>
|
<li><a @click="changeTheme($event, 'bootstrap4-dark-purple')"><img src="demo/images/themes/bootstrap4-dark-purple.svg" alt="Purple Dark" /><span>Purple Dark</span></a></li>
|
||||||
|
|
||||||
<li class="topbar-submenu-header">MATERIAL DESIGN</li>
|
<li class="topbar-submenu-header">MATERIAL DESIGN</li>
|
||||||
<li><a @click="changeTheme($event, 'md-light-indigo')"><img src="./assets/images/themes/md-light-indigo.svg" alt="Indigo Light" /><span>Indigo Light</span></a></li>
|
<li><a @click="changeTheme($event, 'md-light-indigo')"><img src="demo/images/themes/md-light-indigo.svg" alt="Indigo Light" /><span>Indigo Light</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'md-light-deeppurple')"><img src="./assets/images/themes/md-light-deeppurple.svg" alt="Deep Purple Light" /><span>Deep Purple Light</span></a></li>
|
<li><a @click="changeTheme($event, 'md-light-deeppurple')"><img src="demo/images/themes/md-light-deeppurple.svg" alt="Deep Purple Light" /><span>Deep Purple Light</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'md-dark-indigo')"><img src="./assets/images/themes/md-dark-indigo.svg" alt="Indigo Dark" /><span>Indigo Dark</span></a></li>
|
<li><a @click="changeTheme($event, 'md-dark-indigo')"><img src="demo/images/themes/md-dark-indigo.svg" alt="Indigo Dark" /><span>Indigo Dark</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'md-dark-deeppurple')"><img src="./assets/images/themes/md-dark-deeppurple.svg" alt="Deep Purple Dark" /><span>Deep Purple Dark</span></a></li>
|
<li><a @click="changeTheme($event, 'md-dark-deeppurple')"><img src="demo/images/themes/md-dark-deeppurple.svg" alt="Deep Purple Dark" /><span>Deep Purple Dark</span></a></li>
|
||||||
|
|
||||||
<li class="topbar-submenu-header">MATERIAL DESIGN COMPACT</li>
|
<li class="topbar-submenu-header">MATERIAL DESIGN COMPACT</li>
|
||||||
<li><a @click="changeTheme($event, 'mdc-light-indigo')"><img src="./assets/images/themes/md-light-indigo.svg" alt="Indigo Light" /><span>Indigo Light</span></a></li>
|
<li><a @click="changeTheme($event, 'mdc-light-indigo')"><img src="demo/images/themes/md-light-indigo.svg" alt="Indigo Light" /><span>Indigo Light</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'mdc-light-deeppurple')"><img src="./assets/images/themes/md-light-deeppurple.svg" alt="Deep Purple Light" /><span>Deep Purple Light</span></a></li>
|
<li><a @click="changeTheme($event, 'mdc-light-deeppurple')"><img src="demo/images/themes/md-light-deeppurple.svg" alt="Deep Purple Light" /><span>Deep Purple Light</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'mdc-dark-indigo')"><img src="./assets/images/themes/md-dark-indigo.svg" alt="Indigo Dark" /><span>Indigo Dark</span></a></li>
|
<li><a @click="changeTheme($event, 'mdc-dark-indigo')"><img src="demo/images/themes/md-dark-indigo.svg" alt="Indigo Dark" /><span>Indigo Dark</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'mdc-dark-deeppurple')"><img src="./assets/images/themes/md-dark-deeppurple.svg" alt="Deep Purple Dark" /><span>Deep Purple Dark</span></a></li>
|
<li><a @click="changeTheme($event, 'mdc-dark-deeppurple')"><img src="demo/images/themes/md-dark-deeppurple.svg" alt="Deep Purple Dark" /><span>Deep Purple Dark</span></a></li>
|
||||||
|
|
||||||
<li class="topbar-submenu-header">PRIMEONE</li>
|
<li class="topbar-submenu-header">PRIMEONE</li>
|
||||||
<li><a @click="changeTheme($event, 'saga-blue')"><img src="./assets/images/themes/saga-blue.png" alt="Saga Blue" /><span>Saga Blue</span></a></li>
|
<li><a @click="changeTheme($event, 'saga-blue')"><img src="demo/images/themes/saga-blue.png" alt="Saga Blue" /><span>Saga Blue</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'saga-green')"><img src="./assets/images/themes/saga-green.png" alt="Saga Green" /><span>Saga Green</span></a></li>
|
<li><a @click="changeTheme($event, 'saga-green')"><img src="demo/images/themes/saga-green.png" alt="Saga Green" /><span>Saga Green</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'saga-orange')"><img src="./assets/images/themes/saga-orange.png" alt="Saga Orange" /><span>Saga Orange</span></a></li>
|
<li><a @click="changeTheme($event, 'saga-orange')"><img src="demo/images/themes/saga-orange.png" alt="Saga Orange" /><span>Saga Orange</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'saga-purple')"><img src="./assets/images/themes/saga-purple.png" alt="Saga Purple" /><span>Saga Purple</span></a></li>
|
<li><a @click="changeTheme($event, 'saga-purple')"><img src="demo/images/themes/saga-purple.png" alt="Saga Purple" /><span>Saga Purple</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'vela-blue', true)"><img src="./assets/images/themes/vela-blue.png" alt="Vela Blue" /><span>Vela Blue</span></a></li>
|
<li><a @click="changeTheme($event, 'vela-blue', true)"><img src="demo/images/themes/vela-blue.png" alt="Vela Blue" /><span>Vela Blue</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'vela-green', true)"><img src="./assets/images/themes/vela-green.png" alt="Vela Green" /><span>Vela Green</span></a></li>
|
<li><a @click="changeTheme($event, 'vela-green', true)"><img src="demo/images/themes/vela-green.png" alt="Vela Green" /><span>Vela Green</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'vela-orange', true)"><img src="./assets/images/themes/vela-orange.png" alt="Vela Orange" /><span>Vela Orange</span></a></li>
|
<li><a @click="changeTheme($event, 'vela-orange', true)"><img src="demo/images/themes/vela-orange.png" alt="Vela Orange" /><span>Vela Orange</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'vela-purple', true)"><img src="./assets/images/themes/vela-purple.png" alt="Vela Purple" /><span>Vela Purple</span></a></li>
|
<li><a @click="changeTheme($event, 'vela-purple', true)"><img src="demo/images/themes/vela-purple.png" alt="Vela Purple" /><span>Vela Purple</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'arya-blue', true)"><img src="./assets/images/themes/arya-blue.png" alt="Arya Blue" /><span>Arya Blue</span></a></li>
|
<li><a @click="changeTheme($event, 'arya-blue', true)"><img src="demo/images/themes/arya-blue.png" alt="Arya Blue" /><span>Arya Blue</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'arya-green', true)"><img src="./assets/images/themes/arya-green.png" alt="Arya Green" /><span>Arya Green</span></a></li>
|
<li><a @click="changeTheme($event, 'arya-green', true)"><img src="demo/images/themes/arya-green.png" alt="Arya Green" /><span>Arya Green</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'arya-orange', true)"><img src="./assets/images/themes/arya-orange.png" alt="Arya Orange" /><span>Arya Orange</span></a></li>
|
<li><a @click="changeTheme($event, 'arya-orange', true)"><img src="demo/images/themes/arya-orange.png" alt="Arya Orange" /><span>Arya Orange</span></a></li>
|
||||||
<li><a @click="changeTheme($event, 'arya-purple', true)"><img src="./assets/images/themes/arya-purple.png" alt="Arya Purple" /><span>Arya Purple</span></a></li>
|
<li><a @click="changeTheme($event, 'arya-purple', true)"><img src="demo/images/themes/arya-purple.png" alt="Arya Purple" /><span>Arya Purple</span></a></li>
|
||||||
|
|
||||||
<li class="topbar-submenu-header">LEGACY</li>
|
<li class="topbar-submenu-header">LEGACY</li>
|
||||||
<li><a @click="changeTheme($event, 'nova')"><img src="./assets/images/layouts/themeswitcher-nova.png" alt="Nova" /><span>Nova</span></a></li>
|
<li><a @click="changeTheme($event, 'nova')"><img src="./assets/images/layouts/themeswitcher-nova.png" alt="Nova" /><span>Nova</span></a></li>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue