# styled components
Swiperjs 커스터마이징 / react, styled-components
요구사항1\. enable/disable 일 때 svg 컬러 다르게2\. 각각 left/right 화살표 mouseOver 시 화살표 꼬리 애니메이션 넣기📎 \[swiperjs 공식문서 react\`\`\`typescriptimport SwiperCore, { Nav
styled-components
💖 일단 설치 사용하고 싶은 js파일 위에 😍 사용해보자! 여기 적은 스타일이 다른 JS 파일로 오염되지 않습니다. 원래 그냥 App.css파일은 오염됩니다. 😍 props로 재활용가능 (참고) 컴포넌트명.module.css 여러분이 App.css 파일을 만들어서 App.js에서 import해서 쓴다고 해도 거기 적은 클래스명들은 Detail....
createGlobalStyle 경고
createGlobalStyle 에 @import(폰트) 사용 시 do not use @import 경고 문구
styled-component React 스타일 적용하기 (1)
React에서는 여러 css를 적용할 수 있지만많은 사이트에서 쓰이고 있는 styled-component 잘 모르는채로 살짝만 써보다가, 이번에 노마드코더 강의를 들으면서 제대로 기초부터 익히게 되었다.npm공식 문서 기본설치와 예제 참고creact-react-app이
2023-05-12
styled-components가 필요한 경우 class 만들어놓은 걸 까먹고 중복해서 또 만들거나 갑자기 다른 이상한 컴포넌트에 원하지 않는 스타일이 적용되거나 CSS 파일이 너무 길어져서 수정이 어렵거나 npm install styled-components styled-components를 사용하기 위해 npm install styled-compone...
Next.js로 나만의 블로그 만들기 [2] Recoil과 Styled-components로 다크 모드 구현하기
Recoil과 theme-provider로 만들어보는 다크 모드
(SEB_FE) Section3 Unit3 styled-component 복습
과거에는 CSS 파일을 작성하는데 정해진 일관된 규칙이 존재하지 않았다. 하지만 점점 프로젝트의 규모나 복잡도가 점점 커지며 함께 작업해야 할 팀원 수도 많아지게 되고, 모바일이나 태블릿을 비롯한 다양한 디바이스들의 등장으로 웹사이트들이 다양한 디스플레이를 커버해야 하
Styledcomponents background-image넣기
✍️ styled components 에서 background-image를 적용하려고 하니 css처럼 경로를 입력하니 적용이 안되어 찾아 보았다.
왜 Sass에서 Styled-components로 전환했을까?
오늘은 프로젝트에서 스타일링 작업을 진행하면서 Sass에서 Styled-components로 전환한 이유에 대해서 알아보자.Sass에서는 클래스명이나 ID명 등의 선택자를 사용하여 스타일을 적용하므로, 불필요한 중첩과 복잡도가 높아지는 단점이 있었다. 프로젝트 규모가
New 포트폴리오
구 버전의 포트폴리오가 너무 허접해서 새 포트폴리오의 필요성을 느낀참에 next.js와 styled-components를 사용해서 만들기로 했다.
[리액트]nodebird 섹션1. - antd와 styled-components
package.json 에 설치가 된다.https://ant.design/components/menu 사이트에서 코드를 가져다 쓰면된다.AppLayout.js공식문서에서 코드를 보면 되기때문에 코드를 외우지 않아도된다.
Styled-Components 시작하기 #5, attaching additional props, Overriding attrs 와 Animation
갑자기 쉬워져요