aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/atoms
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2022-06-07 16:02:21 +0200
committerArmand Philippot <git@armandphilippot.com>2022-06-07 17:13:40 +0200
commit73f94705dc583e968114e5a09e85979448f3412b (patch)
tree45b7dd12f1af6a44caabab31a28c98f8749d08ff /src/components/atoms
parentd54fc38899b3ffc87104ed03f5e48be3f02e337c (diff)
chore(cards): use post title as link label
Diffstat (limited to 'src/components/atoms')
-rw-r--r--src/components/atoms/buttons/button-link.stories.tsx13
-rw-r--r--src/components/atoms/buttons/button-link.tsx4
-rw-r--r--src/components/atoms/buttons/buttons.module.scss2
3 files changed, 19 insertions, 0 deletions
diff --git a/src/components/atoms/buttons/button-link.stories.tsx b/src/components/atoms/buttons/button-link.stories.tsx
index d06aff3..22d13f6 100644
--- a/src/components/atoms/buttons/button-link.stories.tsx
+++ b/src/components/atoms/buttons/button-link.stories.tsx
@@ -24,6 +24,19 @@ export default {
required: false,
},
},
+ 'aria-labelledby': {
+ control: {
+ type: null,
+ },
+ description: 'One or more ids that refer to an accessible label.',
+ table: {
+ category: 'Accessibility',
+ },
+ type: {
+ name: 'string',
+ required: false,
+ },
+ },
children: {
control: {
type: 'text',
diff --git a/src/components/atoms/buttons/button-link.tsx b/src/components/atoms/buttons/button-link.tsx
index 64e0afd..989f737 100644
--- a/src/components/atoms/buttons/button-link.tsx
+++ b/src/components/atoms/buttons/button-link.tsx
@@ -8,6 +8,10 @@ export type ButtonLinkProps = {
*/
'aria-label'?: string;
/**
+ * One or more ids that refer to the accessible label.
+ */
+ 'aria-labelledby'?: string;
+ /**
* The button link body.
*/
children: ReactNode;
diff --git a/src/components/atoms/buttons/buttons.module.scss b/src/components/atoms/buttons/buttons.module.scss
index 2444bb1..b702544 100644
--- a/src/components/atoms/buttons/buttons.module.scss
+++ b/src/components/atoms/buttons/buttons.module.scss
@@ -21,6 +21,8 @@
&--square,
&--circle {
+ min-width: fit-content;
+ min-height: fit-content;
padding: var(--spacing-xs);
aspect-ratio: 1 / 1;
}