React Router Link 태그에 styled-components 적용하기

lbr·2022년 9월 9일
1

React Router Link 태그에 styled-components 적용하기

import {Link} from "react-router-dom";
import styled from "styled-components";

export const NavbarContainer= styled.nav
width: 100%;
height:50px;
background-color: purple;
display: flex;
flex-direction: column;
;

 export const NavbarLinkContainer = styled.div
     display: flex;

 export const NavbarLink = styled(Link)
 color:white;
 font-size: x-large;
 font-family: Arial, Helvetica, sans-serif;
 text-decoration: none;
 margin: 10px;
&:hover,
&:focus{
    color: blue;
}
&:active{
    color: red;
};

styled. 이 아닌, styled()를 사용하여,
styled(Link) 이렇게 스타일 적용.

0개의 댓글