[BUG] #89 레이아웃 비율 변경 시 UI 잘리는 버그 수정

[kimjuyoung99]

✅ PR Checklist

• 불필요한 코드 중복이 없습니다.
• 민감한 정보를 포함하지 않았습니다.
• 불필요한 콘솔 로그나 주석을 포함하지 않았습니다.
• 컴포넌트 key값에 고유한 값을 할당했습니다.

📝 Summary

• 절대단위 px를 상대 단위(rem,em,vh) 통일하였습니다.
• iPhoneSE, iPad 등 여러 디바이스에 반응하여 화면 크기에 따라 자연스럽게 크기가 조정되게 변경하였습니다
  (a7d1c8f)

@kimjuyoung99

🔗 ISSUE : #89

🖼️ Screenshots

[github-actions]

⚡ Lighthouse Reports

http://localhost:4173/

Performance Metrics

Category	Score
Performance	🟠 73
Accessibility	🟢 95
Best Practices	🟢 100
SEO	🟢 100

Detailed Metrics

Metric	Value
First Contentful Paint	🟠 2.3 s
Largest Contentful Paint	🔴 4.1 s
Total Blocking Time	🟠 460 ms
Cumulative Layout Shift	🟢 0.008
Speed Index	🟢 2.6 s

Security Checks

Check	Status	Details
CSP-XSS	⚠️	Ensure CSP is effective against XSS attacks

http://localhost:4173/log

Performance Metrics

Category	Score
Performance	🟠 89
Accessibility	🟢 95
Best Practices	🟢 100
SEO	🟢 100

Detailed Metrics

Metric	Value
First Contentful Paint	🟢 1.6 s
Largest Contentful Paint	🟠 3.6 s
Total Blocking Time	🟢 10 ms
Cumulative Layout Shift	🟢 0
Speed Index	🟢 1.6 s

Security Checks

Check	Status	Details
CSP-XSS	⚠️	Ensure CSP is effective against XSS attacks

http://localhost:4173/login

Performance Metrics

Category	Score
Performance	🟢 95
Accessibility	🟢 97
Best Practices	🟢 100
SEO	🟢 92

Detailed Metrics

Metric	Value
First Contentful Paint	🟢 1.6 s
Largest Contentful Paint	🟠 2.8 s
Total Blocking Time	🟢 0 ms
Cumulative Layout Shift	🟢 0.006
Speed Index	🟢 1.6 s

Security Checks

Check	Status	Details
CSP-XSS	⚠️	Ensure CSP is effective against XSS attacks

http://localhost:4173/mypage

Performance Metrics

Category	Score
Performance	🟠 82
Accessibility	🟢 95
Best Practices	🟢 100
SEO	🟢 92

Detailed Metrics

Metric	Value
First Contentful Paint	🟠 1.9 s
Largest Contentful Paint	🔴 4.7 s
Total Blocking Time	🟢 20 ms
Cumulative Layout Shift	🟢 0.002
Speed Index	🟢 1.9 s

Security Checks

Check	Status	Details
CSP-XSS	⚠️	Ensure CSP is effective against XSS attacks