feat: Create a ThreadBottomBar component (#3474)
* feat: Create a ThreadBottomBar component * capitalised share like Share in button * removed ButtonGroup to avoid the border-radius issue
This commit is contained in:
@ -0,0 +1,38 @@
|
|||||||
|
import styled from '@emotion/styled';
|
||||||
|
|
||||||
|
import { IconArrowBackUp, IconUserCircle } from '@/ui/display/icon';
|
||||||
|
import { Button } from '@/ui/input/button/components/Button';
|
||||||
|
|
||||||
|
const StyledThreadBottomBar = styled.div`
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
gap: ${({ theme }) => theme.spacing(2)};
|
||||||
|
padding-left: ${({ theme }) => theme.spacing(6)};
|
||||||
|
padding-right: ${({ theme }) => theme.spacing(6)};
|
||||||
|
padding-top: ${({ theme }) => theme.spacing(4)};
|
||||||
|
`;
|
||||||
|
|
||||||
|
export const ThreadBottomBar = () => {
|
||||||
|
return (
|
||||||
|
<StyledThreadBottomBar>
|
||||||
|
<Button
|
||||||
|
Icon={IconArrowBackUp}
|
||||||
|
title="Reply"
|
||||||
|
variant="secondary"
|
||||||
|
accent="default"
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
Icon={IconArrowBackUp}
|
||||||
|
title="Reply to all"
|
||||||
|
variant="secondary"
|
||||||
|
accent="default"
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
Icon={IconUserCircle}
|
||||||
|
title="Share"
|
||||||
|
variant="secondary"
|
||||||
|
accent="default"
|
||||||
|
/>
|
||||||
|
</StyledThreadBottomBar>
|
||||||
|
);
|
||||||
|
};
|
||||||
@ -7,6 +7,7 @@ export {
|
|||||||
IconApps,
|
IconApps,
|
||||||
IconArchive,
|
IconArchive,
|
||||||
IconArchiveOff,
|
IconArchiveOff,
|
||||||
|
IconArrowBackUp,
|
||||||
IconArrowDown,
|
IconArrowDown,
|
||||||
IconArrowLeft,
|
IconArrowLeft,
|
||||||
IconArrowRight,
|
IconArrowRight,
|
||||||
|
|||||||
Reference in New Issue
Block a user