diff --git a/src/components/Notification/components/NotificationButton/index.js b/src/components/Notification/components/NotificationButton/index.js index 9d001380..f2e9fcf6 100644 --- a/src/components/Notification/components/NotificationButton/index.js +++ b/src/components/Notification/components/NotificationButton/index.js @@ -8,7 +8,9 @@ import colors from 'config/colors'; import { WHITE_COLOR } from 'config/animations'; import { getPrimaryColor } from 'utils/notification'; import Loader from 'components/Loader'; -import { TRANSITION, FONT_SIZE, FONT_WEIGHT } from 'config/variables'; +import { + TRANSITION, FONT_SIZE, FONT_WEIGHT, SCREEN_SIZE, +} from 'config/variables'; type Props = { type: string; @@ -48,6 +50,10 @@ const Wrapper = styled.button` border: 1px solid ${props => getPrimaryColor(props.type)}; transition: ${TRANSITION.HOVER}; + @media screen and (max-width: ${SCREEN_SIZE.SM}){ + padding: 12px 24px; + } + &:hover { color: ${colors.WHITE}; background: ${props => getPrimaryColor(props.type)};