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

Update AdvancedDoc.vue

pull/4604/head
Tuğçe Küçükoğlu 2023-10-10 19:59:27 +03:00
parent 9c4af3a565
commit 2e1ebc50e0
1 changed files with 16 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
doc/dock/AdvancedDoc.vue
View File

@ -546,11 +546,8 @@ export default {
background-image: url("https://primefaces.org/cdn/primevue/images/dock/window.jpg"); background-image: url("https://primefaces.org/cdn/primevue/images/dock/window.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
} }
.dock-demo .p-menubar { .dock-demo .p-menubar {
padding: 0; padding: 0;
border-radius: 0; border-radius: 0;
@ -562,10 +559,24 @@ export default {
<div class="card dock-demo"> <div class="card dock-demo">
<Toast position="top-center" group="tc" /> <Toast position="top-center" group="tc" />
<Menubar :model="menubarItems">
<template #start>
<i class="pi pi-apple px-2"></i>
</template>
<template #end>
<i class="pi pi-video px-2" />
<i class="pi pi-wifi px-2" />
<i class="pi pi-volume-up px-2" />
<span class="px-2">Fri 13:07</span>
<i class="pi pi-search px-2" />
<i class="pi pi-bars px-2" />
</template>
</Menubar>
<div class="dock-window dock-advanced"> <div class="dock-window dock-advanced">
<Dock :model="items"> <Dock :model="items">
<template #item="{ item }"> <template #item="{ item }">
<a href="#" class="p-dock-link" v-tooltip.top="item.label" @click="onDockItemClick($event, item)"> <a v-tooltip.top="item.label" href="#" class="p-dock-link" @click="onDockItemClick($event, item)">
<img :alt="item.label" :src="item.icon" style="width: 100%" /> <img :alt="item.label" :src="item.icon" style="width: 100%" />
</a> </a>
</template> </template>
@ -579,8 +590,7 @@ export default {
<Tree :value="nodes" /> <Tree :value="nodes" />
</Dialog> </Dialog>
<Galleria v-model:visible="displayPhotos" :value="images" :responsiveOptions="responsiveOptions" :numVisible="2" containerStyle="width: 400px" <Galleria v-model:visible="displayPhotos" :value="images" :responsiveOptions="responsiveOptions" :numVisible="2" containerStyle="width: 400px" :circular="true" :fullScreen="true" :showThumbnails="false" :showItemNavigators="true">
:circular="true" :fullScreen="true" :showThumbnails="false" :showItemNavigators="true">
<template #item="slotProps"> <template #item="slotProps">
<img :src="slotProps.item.itemImageSrc" :alt="slotProps.item.alt" style="width: 100%" /> <img :src="slotProps.item.itemImageSrc" :alt="slotProps.item.alt" style="width: 100%" />
</template> </template>
@ -846,8 +856,6 @@ const commandHandler = (text) => {
} }
.dock-demo .p-menubar { .dock-demo .p-menubar {
padding: 0; padding: 0;
border-radius: 0; border-radius: 0;