codestates / codestates/LearnRegex
[✍️ DevLog] 은유 / 2021-12-18
- Dominant language
- JavaScript
- Stars
- 2
- Forks
- 0
- PR merge metrics
- No merged PRs in 30d
Description
### 오늘은 어떻게 프로젝트에 기여했나요?
어제와 오늘 한 일
* 학습하기, 퀴즈 리스트, 퀴즈 문제 풀기, 퀴즈 수정 페이지 전체적인 UI 구성
* 작성하는 퀴즈폼, 문제 푸는 퀴즈폼 UI 작업
* 회원 관련 정보 페이지 반응형 작업 -> css 요소 컴포넌트화
* 학습하기 페이지의 사이드바 UI 작업
### 오늘의 프로젝트에서 힘든 점은 무엇인가요?
* 브라우저를 줄였을 때 컨텐츠 부분들이 같이 줄어들지 않고 브라우저 바깥을 뛰쳐나가는 걸 잡는 반응형 구현이 제일 힘들었다.
* 반응형 구현이 자연스럽게 되려면 제일 바깥을 감싸고 있는 부모 요소는 아래와 같은 속성을 가지고 있어야하고,
```css
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
margin: auto;
```
자식 요소는 아래와 같은 속성을 가지고 있으면 된다.
```css
// 양쪽 마진 auto를 통해 양쪽 여백부터 줄어든다.
width: 50rem; // 보여주고싶은 크기 설정
margin: 0 auto;
@media screen and (max-width: 768px){
// 반응형 크기가 됐을 때
width: auto;
margin: 0 2rem; // 주고싶은 양쪽 여백 정의
}
```
### 내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?
* [ ] 파비콘 설정
* [ ] 버그 찾기
* [ ] Read Me 수정
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.