Fix icon button group design (#12656)
- remove not expected animation - move border to iconButtonGroup ui component
This commit is contained in:
@ -9,7 +9,6 @@ import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/
|
||||
import { workflowInsertStepIdsComponentState } from '@/workflow/workflow-steps/states/workflowInsertStepIdsComponentState';
|
||||
|
||||
const StyledIconButtonGroup = styled(IconButtonGroup)`
|
||||
border: 1px solid ${({ theme }) => theme.border.color.strong};
|
||||
pointer-events: all;
|
||||
`;
|
||||
|
||||
|
||||
@ -21,6 +21,7 @@ const StyledIconButtonGroupContainer = styled.div<
|
||||
background-color: ${({ disabled, theme }) =>
|
||||
disabled ? 'inherit' : theme.background.transparent.lighter};
|
||||
border-radius: ${({ theme }) => theme.border.radius.sm};
|
||||
border: 1px solid ${({ theme }) => theme.border.color.strong};
|
||||
gap: 2px;
|
||||
padding: 2px;
|
||||
backdrop-filter: blur(20px);
|
||||
|
||||
@ -31,15 +31,6 @@ const StyledButton = styled.button`
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledAnimatedIconWrapper = styled.span`
|
||||
display: flex;
|
||||
transition: transform 0.1s ease;
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-3%);
|
||||
}
|
||||
`;
|
||||
|
||||
export const InsideButton = ({
|
||||
className,
|
||||
Icon,
|
||||
@ -50,11 +41,7 @@ export const InsideButton = ({
|
||||
|
||||
return (
|
||||
<StyledButton className={className} onClick={onClick} disabled={disabled}>
|
||||
{Icon && (
|
||||
<StyledAnimatedIconWrapper>
|
||||
<Icon size={theme.icon.size.sm} />
|
||||
</StyledAnimatedIconWrapper>
|
||||
)}
|
||||
{Icon && <Icon size={theme.icon.size.sm} />}
|
||||
</StyledButton>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user