diff --git a/app/soapbox/components/authorize-reject-buttons.tsx b/app/soapbox/components/authorize-reject-buttons.tsx index a785c31ea..a5fddc61a 100644 --- a/app/soapbox/components/authorize-reject-buttons.tsx +++ b/app/soapbox/components/authorize-reject-buttons.tsx @@ -165,7 +165,7 @@ const AuthorizeRejectButton: React.FC = ({ theme, icon, src={isLoading ? require('@tabler/icons/player-stop-filled.svg') : icon} onClick={action} theme='seamless' - className='h-10 w-10 items-center justify-center bg-gray-900' + className='h-10 w-10 items-center justify-center bg-white focus:!ring-0 dark:!bg-gray-900' iconClassName={clsx('h-6 w-6', { 'text-primary-500': theme === 'primary', 'text-danger-600': theme === 'danger', diff --git a/app/soapbox/components/status.tsx b/app/soapbox/components/status.tsx index 3ec072394..65291a420 100644 --- a/app/soapbox/components/status.tsx +++ b/app/soapbox/components/status.tsx @@ -8,7 +8,6 @@ import { mentionCompose, replyCompose } from 'soapbox/actions/compose'; import { toggleFavourite, toggleReblog } from 'soapbox/actions/interactions'; import { openModal } from 'soapbox/actions/modals'; import { toggleStatusHidden, unfilterStatus } from 'soapbox/actions/statuses'; -import Icon from 'soapbox/components/icon'; import TranslateButton from 'soapbox/components/translate-button'; import AccountContainer from 'soapbox/containers/account-container'; import QuotedStatus from 'soapbox/features/status/containers/quoted-status-container'; @@ -22,7 +21,7 @@ import StatusMedia from './status-media'; import StatusReplyMentions from './status-reply-mentions'; import SensitiveContentOverlay from './statuses/sensitive-content-overlay'; import StatusInfo from './statuses/status-info'; -import { Card, Stack, Text } from './ui'; +import { Card, Icon, Stack, Text } from './ui'; import type { Account as AccountEntity, @@ -217,7 +216,7 @@ const Status: React.FC = (props) => { } + icon={} text={ = (props) => { return ( } + icon={} text={ @@ -255,7 +254,7 @@ const Status: React.FC = (props) => { } + icon={} text={ { src: string /** Text to display next ot the button. */ text?: string - /** Don't render a background behind the icon. */ - transparent?: boolean /** Predefined styles to display for the button. */ - theme?: 'seamless' | 'outlined' | 'secondary' + theme?: 'seamless' | 'outlined' | 'secondary' | 'transparent' /** Override the data-testid */ 'data-testid'?: string } /** A clickable icon. */ const IconButton = React.forwardRef((props: IIconButton, ref: React.ForwardedRef): JSX.Element => { - const { src, className, iconClassName, text, transparent = false, theme = 'seamless', ...filteredProps } = props; + const { src, className, iconClassName, text, theme = 'seamless', ...filteredProps } = props; return (