fix(a11y): activities tablist must contain only tabs
The "Become a member" CTA was a direct child of role="tablist", which violates the ARIA rule that a tablist may only contain role="tab" children (axe: aria-required-children). Wrap the 4 tabs in an inner .activities-tabs[role=tablist] and leave the CTA as a sibling; add matching flex CSS so the layout is unchanged. JS uses `.activities-nav .activity-tab` (descendant), so tab behavior is unaffected. EN/MK/SI. Cache-bust bump. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
6323d55718
commit
e0ba30ea6a
261 files changed
+1197
-1180
No files matched your search
@@ -264,6 +264,14 @@
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* Tablist wrapper — holds only the tabs (the CTA sits outside it so the
|
||||
role="tablist" contains only role="tab" children, per ARIA). */
|
||||
.activities-tabs {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* Tab buttons — card style with icon + active highlight */
|
||||
.activity-tab {
|
||||
display: flex;
|
||||
@@ -780,6 +788,9 @@
|
||||
width: 100%;
|
||||
gap: 10px;
|
||||
}
|
||||
.activities-tabs {
|
||||
gap: 10px;
|
||||
}
|
||||
.activity-tab {
|
||||
padding: 14px 16px;
|
||||
gap: 14px;
|
||||
|
||||
Reference in new issue
Block a user