Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[feat] 나무가 없을 때 diary 뷰 완성 #5

Merged
merged 1 commit into from
Feb 12, 2023
Merged

Conversation

yunsun99
Copy link

🔥 Related Issues

close #4

🍀 작업 내용

  • 나무가 없을 때 diary 뷰 완성

🌈 PR Point

  • 슬랙에 남겨놓았는데 답변들이 없어서 일단 제 임의로 결정한 사항이 있습니다..!
  • 배경 이미지가 휴대폰 배경화면처럼 긴데, 배경 이미지의 가운데에 핵심 이미지가 들어간 탓에 flex로 화면을 구성하면 여러 휴대폰 기종에서 테스트 해봤을 때 이미지와 글씨/버튼들이 겹치는 현상이 발생했습니다. 그래서 flex로 전체적인 화면을 구성하는 대신 배경을 position: relative로 주고 그 위에 글씨와 버튼을 position: absolute로 휴대폰 기종읜 높이에 반응할 수 있도록 했는데, 이렇게 코드를 짜는게 평소에는 굉장히 안 좋다고 알고 있어서 다른 대안이 있는지 궁금합니다.

😡 Trouble Shooting

  • 네이티브와 달리, 모바일 웹에서 시간/와이파이/배터리를 보여주는 상단 뷰의 넓이/높이를 처리하는 방법을 모르고 사전에 결정된 사항이 없는 걸로 알아서 임의로 피그마에 있는 높이만큼 비워두었습니다.

👀 스크린샷 / GIF / 링크

스크린샷 2023-01-22 오전 1 19 39

@yunsun99 yunsun99 added the feat 기능구현 label Jan 21, 2023
@yunsun99 yunsun99 self-assigned this Jan 21, 2023
@@ -1,7 +1,122 @@
import React from 'react';
import styled from 'styled-components';

// import noTreeImage from '../asset/image/BgTreeDiaryEmpty.png';
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

주석은 지우기!

import styled from 'styled-components';

// import noTreeImage from '../asset/image/BgTreeDiaryEmpty.png';
import Router from '../components/common/Router';
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이고 왜 가져왔지?!


const StHomeButton = styled.button`
background-color: transparent;
padding: 3px;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

우리 px단위아니고 rem이요

Comment on lines +80 to +83
font-weight: 700;
font-size: 25px;
line-height: 34px;
text-align: center;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

폰트 전역으로 추가해써 내가!

Comment on lines +103 to +120
const StJupGoButton = styled.button`
width: 166px;
height: 46px;
position: absolute;
bottom: 20%;
background-color: #b6e599;
color: white;
border: none;
border-radius: 14px;
font-weight: 700;
font-size: 25px;
line-height: 34px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
padding-top: 5px;
`;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

css속성우리 컨벤션대로 띄어주세요!

@yunsun99 yunsun99 changed the base branch from main to feature-diary February 12, 2023 17:47
@yunsun99 yunsun99 merged commit c82fcc5 into feature-diary Feb 12, 2023
@yunsun99 yunsun99 deleted the diary/4 branch February 12, 2023 17:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feat 기능구현
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[TreeDiary] 나무가 없을 때 페이지 뷰 구현
2 participants