diff --git a/components/src/components/organisms/Dialog/Dialog.tsx b/components/src/components/organisms/Dialog/Dialog.tsx
index 85188b86..a04a5b3f 100644
--- a/components/src/components/organisms/Dialog/Dialog.tsx
+++ b/components/src/components/organisms/Dialog/Dialog.tsx
@@ -1,7 +1,7 @@
import * as React from 'react'
import styled, { css } from 'styled-components'
-import { AlertSVG, CrossCircleSVG, EthSVG } from '@/src'
+import { AlertSVG, CrossSVG, EthSVG } from '@/src'
import { mq } from '@/src/utils/responsiveHelpers'
import { WithAlert } from '@/src/types'
@@ -11,9 +11,8 @@ import { Modal, Typography } from '../..'
const IconCloseContainer = styled.button(
({ theme }) => css`
position: absolute;
- top: ${theme.space['1']};
- right: ${theme.space['1']};
- padding: ${theme.space['3']};
+ top: ${theme.space['3']};
+ right: ${theme.space['3']};
color: ${theme.colors.greyPrimary};
cursor: pointer;
transition-property: all;
@@ -26,8 +25,9 @@ const IconCloseContainer = styled.button(
svg {
display: block;
- width: ${theme.space['6']};
- height: ${theme.space['6']};
+ width: ${theme.space['9']};
+ height: ${theme.space['9']};
+ padding: ${theme.space['1.5']};
}
`,
)
@@ -340,7 +340,7 @@ const ModalWithTitle = ({
const CloseButton = ({ onClick }: { onClick: () => void }) => (
-
+
)
diff --git a/components/src/components/organisms/Toast/Toast.tsx b/components/src/components/organisms/Toast/Toast.tsx
index 0b371b19..467e689a 100644
--- a/components/src/components/organisms/Toast/Toast.tsx
+++ b/components/src/components/organisms/Toast/Toast.tsx
@@ -4,16 +4,17 @@ import styled, { css, useTheme } from 'styled-components'
import { Space } from '@/src'
-import { Backdrop, ExitSVG, Typography } from '../..'
+import { Backdrop, CrossSVG, Typography } from '../..'
import { getTestId } from '../../../utils/utils'
-const IconCloseContainer = styled.div(
+const IconCloseContainer = styled.svg(
({ theme }) => css`
position: absolute;
top: ${theme.space['2.5']};
right: ${theme.space['2.5']};
- height: ${theme.space['8']};
- width: ${theme.space['8']};
+ width: ${theme.space['9']};
+ height: ${theme.space['9']};
+ padding: ${theme.space['1.5']};
opacity: 0.5;
cursor: pointer;
transition-property: all;
@@ -168,7 +169,7 @@ const DesktopToast = ({
$top={top}
>
onClose()}
/>
@@ -330,7 +331,7 @@ export const TouchToast = ({
<>
{children && {children}}
) => {
e.stopPropagation()