diff --git a/aries-site/src/data/structures/templates/templates.js b/aries-site/src/data/structures/templates/templates.js index fa59b097f..8c03094ac 100644 --- a/aries-site/src/data/structures/templates/templates.js +++ b/aries-site/src/data/structures/templates/templates.js @@ -249,15 +249,27 @@ export const templates = [ name: 'Popover', available: true, cardOrder: 5, - description: `A Popover is an overlay presenting contextual information related to a specific UI element.`, + description: `A Popover is an overlay presenting contextual information + related to a specific UI element.`, preview: { component: () => , background: 'background-front', }, - seoDescription: `A Popover is an overlay presenting contextual information related to a specific UI element. It is revealed and closed by click events.`, + seoDescription: `A Popover is an overlay presenting contextual information + related to a specific UI element. It is revealed and closed by click + events.`, relatedContent: ['Tip'], sections: ['Use cases', 'Anatomy', 'Content guidelines', 'Accessibility'], - tags: ['popup', 'pop up', 'popover', 'tip', 'tooltip', 'modal', 'popover menu', 'inline popover'], + tags: [ + 'popup', + 'pop up', + 'popover', + 'tip', + 'tooltip', + 'modal', + 'popover menu', + 'inline popover', + ], }, { name: 'User feedback collection', diff --git a/aries-site/src/examples/templates/popover/PopoverAnatomy.js b/aries-site/src/examples/templates/popover/PopoverAnatomy.js index 4eb9bebf3..f8d13a5a4 100644 --- a/aries-site/src/examples/templates/popover/PopoverAnatomy.js +++ b/aries-site/src/examples/templates/popover/PopoverAnatomy.js @@ -110,7 +110,7 @@ export const PopoverAnatomy = () => { alignSelf="center" id="round" kind="style" - target={mobile ? '4' : 'round="xsmall"'} + target={mobile ? '6' : 'round="xsmall"'} gridArea="annotation-round" /> diff --git a/aries-site/src/examples/templates/popover/PopoverInlineExample.js b/aries-site/src/examples/templates/popover/PopoverInlineExample.js index 67de0e01e..2a6a1937c 100644 --- a/aries-site/src/examples/templates/popover/PopoverInlineExample.js +++ b/aries-site/src/examples/templates/popover/PopoverInlineExample.js @@ -31,8 +31,8 @@ const device = [ const columns = { xsmall: ['auto'], - small: ['auto'], - medium: ['auto'], + small: ['auto', 'auto', 'auto'], + medium: ['auto', 'auto', 'auto'], large: ['auto', 'auto', 'auto'], xlarge: ['auto', 'auto', 'auto', 'auto'], }; @@ -77,7 +77,7 @@ export const PopoverInlineExample = () => {