From fc6f1800c49186771ef3a174bec14c8541b9fa99 Mon Sep 17 00:00:00 2001 From: "pre-commit-ci[bot]" <66853113+pre-commit-ci[bot]@users.noreply.github.com> Date: Wed, 4 Dec 2024 14:04:43 +0000 Subject: [PATCH] [pre-commit.ci] auto fixes from pre-commit.com hooks for more information, see https://pre-commit.ci --- vizro-core/docs/pages/user-guides/card-button.md | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/vizro-core/docs/pages/user-guides/card-button.md b/vizro-core/docs/pages/user-guides/card-button.md index 667ca664d..2fbebd5c4 100755 --- a/vizro-core/docs/pages/user-guides/card-button.md +++ b/vizro-core/docs/pages/user-guides/card-button.md @@ -404,13 +404,9 @@ To float an image for example to the right of the text, use the `src` attribute === "Result" [![CardImageFloating]][cardimagefloating] - ### Make an icon responsive to theme switch -To make an icon responsive to theme switching, override its -[`filter` CSS property](https://developer.mozilla.org/en-US/docs/Web/CSS/filter). In this example, we use the -`--fill-icon-image-card` CSS variable from the `vizro-bootstrap` CSS file. It leverages the `invert()` function to -flip the icon's color during a theme switch. +To make an icon responsive to theme switching, override its [`filter` CSS property](https://developer.mozilla.org/en-US/docs/Web/CSS/filter). In this example, we use the `--fill-icon-image-card` CSS variable from the `vizro-bootstrap` CSS file. It leverages the `invert()` function to flip the icon's color during a theme switch. This approach works if your icon initially has a white fill color. If not, modify the SVG code by adding `fill="white"`. @@ -678,7 +674,6 @@ vm.Page.add_type("controls", vm.Button) [button]: ../../assets/user_guides/components/button.png [buttontext]: ../../assets/user_guides/components/button_text.png [card]: ../../assets/user_guides/components/card.png -[cardicon]: ../../assets/user_guides/components/card_icon.png [cardimagedefault]: ../../assets/user_guides/components/card_image_default.png [cardimagefloating]: ../../assets/user_guides/components/card_image_floating.png [cardimagestyled]: ../../assets/user_guides/components/card_image_styled.png