Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit 9aa2400

Browse filesBrowse files
committed
feat: CNav component: add tag prop and vertical breakpoint option
1 parent 94256a1 commit 9aa2400
Copy full SHA for 9aa2400

File tree

Expand file treeCollapse file tree

2 files changed

+8
-5
lines changed
Filter options
Expand file treeCollapse file tree

2 files changed

+8
-5
lines changed

‎src/components/index.d.ts

Copy file name to clipboardExpand all lines: src/components/index.d.ts
+1Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -414,6 +414,7 @@ export declare class CNav extends Vue {
414414
variant?: string
415415
vertical?: boolean
416416
inCard?: boolean
417+
tag?: boolean
417418
}
418419

419420
export declare class CNavItem extends CLink {}

‎src/components/nav/CNav.vue

Copy file name to clipboardExpand all lines: src/components/nav/CNav.vue
+7-5Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
2-
<ul :class="navClasses" @click="onClick">
2+
<component :is="tag || 'ul'" :class="navClasses" @click="onClick">
33
<slot></slot>
4-
</ul>
4+
</component>
55
</template>
66

77
<script>
@@ -14,8 +14,9 @@ export default {
1414
},
1515
fill: Boolean,
1616
justified: Boolean,
17-
vertical: Boolean,
18-
inCard: Boolean
17+
vertical: [Boolean, String],
18+
inCard: Boolean,
19+
tag: String
1920
},
2021
provide () {
2122
const nav = {}
@@ -31,10 +32,11 @@ export default {
3132
},
3233
computed: {
3334
navClasses () {
35+
const verticalSuffix = this.vertical === true ? '' : '-' + this.vertical
3436
return {
3537
'nav': true,
3638
[`nav-${this.variant}`]: this.variant,
37-
'flex-column': this.vertical,
39+
[`flex${verticalSuffix}-column`]: this.vertical,
3840
'nav-fill': this.fill,
3941
'nav-justified': this.justified,
4042
[`card-header-${this.variant}`]: this.inCard && this.variant

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.