diff --git a/src/button/ReactionToggleButton.module.css b/src/button/ReactionToggleButton.module.css index af066d05..d86e27e9 100644 --- a/src/button/ReactionToggleButton.module.css +++ b/src/button/ReactionToggleButton.module.css @@ -1,3 +1,9 @@ + +.raisedButton > svg { + color: var(--cpd-color-icon-on-solid-primary); +} + + .reactionPopupMenu { padding: 1em; position: absolute; diff --git a/src/button/ReactionToggleButton.tsx b/src/button/ReactionToggleButton.tsx index 4b4d5c92..a6fa9ad5 100644 --- a/src/button/ReactionToggleButton.tsx +++ b/src/button/ReactionToggleButton.tsx @@ -14,8 +14,8 @@ import { } from "@vector-im/compound-web"; import { SearchIcon, - ReactionIcon, CloseIcon, + HandRaisedIcon, } from "@vector-im/compound-design-tokens/assets/web/icons"; import { ChangeEventHandler, @@ -41,6 +41,7 @@ import { ReactionSet, ElementCallReactionEventType, } from "../reactions"; +import classNames from "classnames"; interface InnerButtonProps extends ComponentPropsWithoutRef<"button"> { raised: boolean; @@ -50,12 +51,13 @@ const InnerButton: FC = ({ raised, ...props }) => { const { t } = useTranslation(); return ( - + );