diff options
Diffstat (limited to 'packages/web-util/src/components/Attention.tsx')
-rw-r--r-- | packages/web-util/src/components/Attention.tsx | 4 |
1 files changed, 3 insertions, 1 deletions
diff --git a/packages/web-util/src/components/Attention.tsx b/packages/web-util/src/components/Attention.tsx index b85230a1b..bb87d5415 100644 --- a/packages/web-util/src/components/Attention.tsx +++ b/packages/web-util/src/components/Attention.tsx @@ -1,5 +1,6 @@ import { TranslatedString, assertUnreachable } from "@gnu-taler/taler-util"; import { ComponentChildren, Fragment, VNode, h } from "preact"; +import { useTranslationContext } from "../index.browser.js"; interface Props { type?: "info" | "success" | "warning" | "danger", @@ -8,6 +9,7 @@ interface Props { children?: ComponentChildren, } export function Attention({ type = "info", title, children, onClose }: Props): VNode { + const { i18n } = useTranslationContext(); return <div class={`group attention-${type} mt-2 shadow-lg`}> <div class="rounded-md group-[.attention-info]:bg-blue-50 group-[.attention-warning]:bg-yellow-50 group-[.attention-danger]:bg-red-50 group-[.attention-success]:bg-green-50 p-4 shadow"> <div class="flex"> @@ -39,7 +41,7 @@ export function Attention({ type = "info", title, children, onClose }: Props): V </div> {onClose && <div> - <button type="button" class="font-semibold items-center rounded bg-transparent px-2 py-1 text-xs text-gray-900 hover:bg-gray-50" + <button type="button" aria-label={i18n.str`Close banner`} class="font-semibold items-center rounded bg-transparent px-2 py-1 text-xs text-gray-900 hover:bg-gray-50" onClick={(e) => { e.preventDefault(); onClose(); |