스타일 확장

Styled Components의 스타일 확장은 styled()함수에 정의된 스타일 컴포넌트를 전달하여 컴포넌트 스타일을 확장(extends) 하는 것이다.

AppFillButton.js

import styled from 'styled-components'
import AppButton from './AppButton'

// AppButton 확장
export const AppFillButton = styled(AppButton)`
  border: 0;
  padding: 0.45em 0.95em 0.6em;
  background-color: ${ props => props.reject ? '#026' : '#06f' }
  color: ${ props => props.reject ? '#09f' : '#fff' }
  font-weight: 600
`

AppButton.js

참고 Extending Styles(공식 문서)