diff --git a/packages/visualizations/src/components/Table/Row.svelte b/packages/visualizations/src/components/Table/Row.svelte
index 3f3fbb3b..978d8c24 100644
--- a/packages/visualizations/src/components/Table/Row.svelte
+++ b/packages/visualizations/src/components/Table/Row.svelte
@@ -29,11 +29,18 @@
};
-
+
{#if rows?.onClick}
- |
{/if}
@@ -64,20 +71,33 @@
display: flex;
justify-content: center;
align-items: center;
- visibility: hidden;
}
- :global(.ods-dataviz--default) button:hover {
- background-color: #e2e6ee;
- cursor: pointer;
+ span {
+ width: 100%;
+ height: 100%;
+ }
+
+ /* Hides visually but leaves it accessible by kb/sr */
+ .visually-hidden:not(:focus):not(:active) {
+ clip: rect(0 0 0 0);
+ clip-path: inset(50%);
+ height: 1px;
+ overflow: hidden;
+ position: absolute;
+ white-space: nowrap;
+ width: 1px;
}
- :global(.ods-dataviz--default) button.visible {
- visibility: visible;
+ :global(.ods-dataviz--default) button:hover,
+ :global(.ods-dataviz--default) button:focus {
+ background-color: #e2e6ee;
+ cursor: pointer;
}
:global(.ods-dataviz--default) .button-cell {
padding: 0;
padding-left: 6px;
+ width: 34px;
}