Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-08-29 13:21:29 +04:00
Code Issues Projects Releases Wiki Activity

Improve accessibility across layouts, components, and forms (#2799)

Browse Source
This commit is contained in:
Paweł Kuna
2026-08-05 23:40:37 +02:00
committed by GitHub
parent 17d2363ef2
commit 1effe221cb
160 changed files with 1494 additions and 1092 deletions
Download Patch File Download Diff File Expand all files Collapse all files
shared/components/modals/Modal.astro
+5 -3
View File
@@ -9,17 +9,19 @@ interface Props {
class?: string
show?: boolean
style?: string
/** id of the title element the root references via aria-labelledby; defaults to `modal-${modalId}-title` */
titleId?: string
}
const { modalId = 'simple', size, top, scrollable, class: className, show, style } = Astro.props
const { modalId = 'simple', size, top, scrollable, class: className, show, style, titleId = `modal-${modalId}-title` } = Astro.props
const modalClass = ['modal modal-blur fade', className, show && 'show'].filter(Boolean).join(' ')
const dialogClass = ['modal-dialog', size && `modal-${size}`, !top && 'modal-dialog-centered', scrollable && 'modal-dialog-scrollable'].filter(Boolean).join(' ')
---
<!-- BEGIN MODAL -->
<div class={modalClass} style={style} id={`modal-${modalId}`} tabindex="-1" role="dialog" aria-hidden={show ? 'false' : 'true'}>
<div class={dialogClass} role="document">
<div class={modalClass} style={style} id={`modal-${modalId}`} tabindex="-1" role="dialog" aria-modal="true" aria-labelledby={titleId} aria-hidden={show ? undefined : 'true'}>
<div class={dialogClass}>
<div class="modal-content">
<slot />
</div>