여기서 로그인 버튼에 밝은 파란색을 넣어 주고 width를 100% 차지하는 것으로 수정해 보겠습니다. Button 컴포넌트를 다음과 같이 수정해 보세요.
components/common/Button.js
import React from 'react'; import styled, { css } from 'styled-components'; import palette from '../../lib/styles/palette'; const StyledButton = styled.button` border: none; border-radius: 4px; font-size: 1rem; font-weight: bold; padding: 0.25rem 1rem; color: white; outline: none; cursor: pointer; background: ${palette.gray[8]}; &:hover { background: ${palette.gray[6]}; } ${props => props.fullWidth && css` padding-top: 0.75rem; padding-bottom: 0.75rem; width: 100%; font-size: 1.125rem; `} ${props => props.cyan && css` background: ${palette.cyan[5]}; &:hover { background: ${palette.cyan[4]}; } `} `; const Button = props => <StyledButton {...props} />; export default Button;