rx.logo: make it accessible to screen readers

Add role="img" aria_label="Reflex" and title="Reflex".
This commit is contained in:
Masen Furer 2025-01-24 17:10:32 -08:00
parent c64ed43215
commit c6d874ae99
No known key found for this signature in database
GPG Key ID: B0008AD22B3B3A95

View File

@ -5,11 +5,15 @@ from typing import Union
import reflex as rx
def svg_logo(color: Union[str, rx.Var[str]] = rx.color_mode_cond("#110F1F", "white")):
def svg_logo(
color: Union[str, rx.Var[str]] = rx.color_mode_cond("#110F1F", "white"),
**props,
):
"""A Reflex logo SVG.
Args:
color: The color of the logo.
props: Extra props to pass to the svg component.
Returns:
The Reflex logo SVG.
@ -31,11 +35,14 @@ def svg_logo(color: Union[str, rx.Var[str]] = rx.color_mode_cond("#110F1F", "whi
return rx.el.svg(
*[logo_path(d) for d in paths],
width="56",
height="12",
viewBox="0 0 56 12",
rx.el.title("Reflex"),
aria_label="Reflex",
role="img",
width=props.pop("width", "56"),
height=props.pop("height", "12"),
fill=color,
xmlns="http://www.w3.org/2000/svg",
**props,
)