9-8. WritePost 반응형 디자인 적용하기

이번 섹션에서는, WritePost 컴포넌트에도 브라우저 크기에 따라 알맞게 사이즈를 설정해주는 작업을 진행하겠습니다.

src/components/WritePost.js

(...)
import { shadow, media } from 'lib/styleUtils';

const Wrapper = styled.div`
    (...)
    ${media.desktop`
        width: 736px;
    `}
    ${media.tablet`
        width: 100%;
    `}
`;

const StyledTextarea = styled(Textarea)`
    (...)
    ${media.tablet`
        font-size: 1rem;
    `}
`;

(...)

이제 태블릿 / 모바일사이즈에서도 정상적으로 보여지게 됩니다.