Commitc7d51ba

committed

improve overflowMenu

1 parentd08ad22 commitc7d51baCopy full SHA for c7d51ba

File tree

+24

-7

lines changed

+24

-7

lines changed

Lines changed: 7 additions & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`<template>`
`2`		`- <divdata-overflow-menutabindex="0"aria-label="Overflow menu description"class="bx--overflow-menu">`
	`2`	`+ <divdata-overflow-menutabindex="0"aria-label="Overflow menu description"class="bx--overflow-menu">`
`3`	`3`	`<svgclass="bx--overflow-menu__icon"width="4"height="20"viewBox="0 0 4 20"fill-rule="evenodd">`
`4`	`4`	`<circlecx="2"cy="2"r="2"></circle>`
`5`	`5`	`<circlecx="2"cy="10"r="2"></circle>`
`@@ -23,3 +23,9 @@`
`23`	`23`	`}`
`24`	`24`	`};`
`25`	`25`	`</script>`
	`26`	`+`
	`27`	`+<style scoped>`
	`28`	`+.bx--overflow-menu-options:focus {`
	`29`	`+outline:none;`
	`30`	`+}`
	`31`	`+</style>`

Lines changed: 7 additions & 1 deletion

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`<template>`
`2`	`2`	`<liclass="bx--overflow-menu-options__option">`
`3`		`- <buttonclass="bx--overflow-menu-options__btn">`
	`3`	`+ <buttonclass="bx--overflow-menu-options__btn"@click="onClick">`
`4`	`4`	`<slot></slot>`
`5`	`5`	`</button>`
`6`	`6`	`</li>`
`@@ -9,5 +9,11 @@`
`9`	`9`	`<script>`
`10`	`10`	`exportdefault {`
`11`	`11`	`name:'ca-overflow-menu-option',`
	`12`	`+ props: {`
	`13`	`+ onClick: {`
	`14`	`+ type:Function,`
	`15`	`+default: ()=> {}`
	`16`	`+ }`
	`17`	`+ }`
`12`	`18`	`};`
`13`	`19`	`</script>`

Lines changed: 10 additions & 5 deletions

Original file line number	Diff line number	Diff line change
`@@ -2,19 +2,24 @@ import { storiesOf } from '@storybook/vue';`
`2`	`2`
`3`	`3`	`storiesOf('OverflowMenu',module)`
`4`	`4`	`.add('Default',()=>({`
	`5`	`+methods:{`
	`6`	`+onClick(){`
	`7`	`+console.log('onClick');`
	`8`	`+},`
	`9`	`+},`
`5`	`10`	template:`
`6`	`11`	`<ca-overflow-menu>`
`7`		`- <ca-overflow-menu-option>`
`8`		`-<button data-floating-menu-primary-focus>Option 1</button>`
	`12`	`+ <ca-overflow-menu-option :onClick="onClick">`
	`13`	`+ Option 1`
`9`	`14`	`</ca-overflow-menu-option>`
`10`	`15`	`<ca-overflow-menu-option>`
`11`		`-<button>Option 2</button>`
	`16`	`+ Option 2`
`12`	`17`	`</ca-overflow-menu-option>`
`13`	`18`	`<ca-overflow-menu-option>`
`14`		`-<button>Option 3</button>`
	`19`	`+ Option 3`
`15`	`20`	`</ca-overflow-menu-option>`
`16`	`21`	`<ca-overflow-menu-option>`
`17`		`-<button>Option 4</button>`
	`22`	`+ Option 4`
`18`	`23`	`</ca-overflow-menu-option>`
`19`	`24`	`</ca-overflow-menu>`
`20`	`25`	`,

Comments

(0)