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

Fixed visual issues at templating menu demos

pull/5806/head
Cagatay Civici 2024-05-25 14:12:46 +03:00
parent 6f648faa54
commit 78ce1c62d5
4 changed files with 16 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
doc/contextmenu/TemplateDoc.vue
View File

@ -29,7 +29,7 @@
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="item.items" class="pi pi-angle-right ml-auto"></i> <i v-if="item.items" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>
@ -105,7 +105,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="item.items" class="pi pi-angle-right ml-auto"></i> <i v-if="item.items" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>
@ -140,7 +140,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="item.items" class="pi pi-angle-right ml-auto"></i> <i v-if="item.items" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>
@ -230,7 +230,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="item.items" class="pi pi-angle-right ml-auto"></i> <i v-if="item.items" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>

8
doc/menubar/TemplateDoc.vue
View File

@ -23,7 +23,7 @@
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" /> <Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i> <i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i>
</a> </a>
</template> </template>
@ -111,7 +111,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" /> <Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i> <i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i>
</a> </a>
</template> </template>
@ -144,7 +144,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" /> <Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i> <i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i>
</a> </a>
</template> </template>
@ -243,7 +243,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" /> <Badge v-if="item.badge" :class="{ 'ml-auto': !root, 'ml-2': root }" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i> <i v-if="hasSubmenu" :class="['pi pi-angle-down', { 'pi-angle-down ml-2': root, 'pi-angle-right ml-auto': !root }]"></i>
</a> </a>
</template> </template>

8
doc/panelmenu/TemplateDoc.vue
View File

@ -9,7 +9,7 @@
<span :class="[item.icon, 'text-primary']" /> <span :class="[item.icon, 'text-primary']" />
<span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span> <span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
</a> </a>
</template> </template>
</PanelMenu> </PanelMenu>
@ -92,7 +92,7 @@ export default {
<span :class="[item.icon, 'text-primary']" /> <span :class="[item.icon, 'text-primary']" />
<span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span> <span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
</a> </a>
</template> </template>
</PanelMenu> </PanelMenu>
@ -106,7 +106,7 @@ export default {
<span :class="[item.icon, 'text-primary']" /> <span :class="[item.icon, 'text-primary']" />
<span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span> <span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
</a> </a>
</template> </template>
</PanelMenu> </PanelMenu>
@ -194,7 +194,7 @@ export default {
<span :class="[item.icon, 'text-primary']" /> <span :class="[item.icon, 'text-primary']" />
<span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span> <span :class="['ml-2', { 'font-semibold': item.items }]">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
</a> </a>
</template> </template>
</PanelMenu> </PanelMenu>

8
doc/tieredmenu/TemplateDoc.vue
View File

@ -9,7 +9,7 @@
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i> <i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>
@ -109,7 +109,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i> <i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>
@ -124,7 +124,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i> <i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>
@ -229,7 +229,7 @@ export default {
<span :class="item.icon" /> <span :class="item.icon" />
<span class="ml-2">{{ item.label }}</span> <span class="ml-2">{{ item.label }}</span>
<Badge v-if="item.badge" class="ml-auto" :value="item.badge" /> <Badge v-if="item.badge" class="ml-auto" :value="item.badge" />
<span v-if="item.shortcut" class="ml-auto border border-surface-200 dark:border-surface-700 rounded bg-surface-100 text-xs p-1">{{ item.shortcut }}</span> <span v-if="item.shortcut" class="ml-auto border border-surface rounded bg-emphasis text-muted-color text-xs p-1">{{ item.shortcut }}</span>
<i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i> <i v-if="hasSubmenu" class="pi pi-angle-right ml-auto"></i>
</a> </a>
</template> </template>