codeit-boost-ds-1 · yyrin · Jul 14, 2024 · Jul 14, 2024
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -2,27 +2,29 @@
 
 ## ✨ 구현 기능 명세
 
-- 기능을 작성해주세요.
-
+- '음악 플레이어' 만들기: 왼쪽 사이트 바 & 아래쪽 플레이어 고정하기, 본문 디자인 등
+  
 <br />
 
 ##  📌 내가 새로 알게 된 부분
 <!-- 새롭게 알게 된 부분 가볍게 기록하기 (기록하면서 개발하기!) -->
-- ~ 부분 이렇게 구현했어요!
+- fixed 포지션과 Flexbox를 직접 이용해보면서 사용법을 익힐 수 있었다.
 
 <br />
 
 ## 💎 구현과정에서의 고민과정(어려웠던 부분) 공유!
-- ~ 부분이 잘 구현한건지 잘 모르겠어요!
-- ~부분 다른 방법이 있는지 궁금해요!
+- 아래쪽 플레이어 부분을 구현하는 게 가장 어려웠다. 자꾸 왼쪽 사이드바에 가려진다거나 플레이어 안의 요소들이 제대로 정렬이 안돼서(버튼들이 약간 오른쪽에 치우쳐서 정렬된다든지...) 고민을 많이 했었다.
 
 <br />
 
 ## 🥺 소요 시간
-- `6h`
+- `1h 30m`
 
 <br />
 
 ## 🌈 구현 결과물
 
+https://github.com/user-attachments/assets/cde9c2b0-1c17-40bd-9bd1-8951be0708a1
+
+
 <!-- 스크린샷, gif, 배포링크 등 자유롭게 작성하되 애니메이션이나 동적UI 확인이 필요한 경우에는 스크린샷은 인정하지 않습니다. -->
diff --git a/images/icon_after.svg b/images/icon_after.svg
diff --git a/images/icon_album.svg b/images/icon_album.svg
diff --git a/images/icon_before.svg b/images/icon_before.svg
diff --git a/images/icon_down.svg b/images/icon_down.svg
diff --git a/images/icon_genre.svg b/images/icon_genre.svg
diff --git a/images/icon_home.svg b/images/icon_home.svg
diff --git a/images/icon_pause.svg b/images/icon_pause.svg
diff --git a/images/icon_play.svg b/images/icon_play.svg
diff --git a/images/icon_playlist.svg b/images/icon_playlist.svg
diff --git a/images/icon_same.svg b/images/icon_same.svg
diff --git a/images/icon_up.svg b/images/icon_up.svg
diff --git a/images/img_artist_1.png b/images/img_artist_1.png
diff --git a/images/img_artist_2.png b/images/img_artist_2.png
diff --git a/images/img_artist_3.png b/images/img_artist_3.png
diff --git a/images/img_artist_4.png b/images/img_artist_4.png
diff --git a/images/img_artist_5.png b/images/img_artist_5.png
diff --git a/images/img_cafe.png b/images/img_cafe.png
diff --git a/images/img_chart_1.png b/images/img_chart_1.png
diff --git a/images/img_chart_10.png b/images/img_chart_10.png
diff --git a/images/img_chart_2.png b/images/img_chart_2.png
diff --git a/images/img_chart_3.png b/images/img_chart_3.png
diff --git a/images/img_chart_4.png b/images/img_chart_4.png
diff --git a/images/img_chart_5.png b/images/img_chart_5.png
diff --git a/images/img_chart_6.png b/images/img_chart_6.png
diff --git a/images/img_chart_7.png b/images/img_chart_7.png
diff --git a/images/img_chart_8.png b/images/img_chart_8.png
diff --git a/images/img_chart_9.png b/images/img_chart_9.png
diff --git a/images/img_current_song.png b/images/img_current_song.png
diff --git a/images/img_main_banner.png b/images/img_main_banner.png
diff --git a/images/img_playlist_1.png b/images/img_playlist_1.png
diff --git a/images/img_playlist_2.png b/images/img_playlist_2.png
diff --git a/images/img_playlist_3.png b/images/img_playlist_3.png
diff --git a/images/img_playlist_4.png b/images/img_playlist_4.png
diff --git a/images/img_playlist_5.png b/images/img_playlist_5.png
diff --git a/images/img_playlist_6.png b/images/img_playlist_6.png
diff --git a/images/img_playlist_7.png b/images/img_playlist_7.png
diff --git a/images/img_playlist_8.png b/images/img_playlist_8.png
diff --git a/images/img_playlist_9.png b/images/img_playlist_9.png
diff --git a/images/img_station_1.png b/images/img_station_1.png
diff --git a/images/img_station_2.png b/images/img_station_2.png
diff --git a/images/img_station_3.png b/images/img_station_3.png
diff --git a/images/img_station_4.png b/images/img_station_4.png
diff --git a/images/img_station_5.png b/images/img_station_5.png
diff --git a/images/img_station_6.png b/images/img_station_6.png
diff --git a/images/img_station_7.png b/images/img_station_7.png
diff --git a/images/img_station_8.png b/images/img_station_8.png
diff --git a/images/img_station_9.png b/images/img_station_9.png
diff --git a/images/logo.svg b/images/logo.svg
diff --git a/images/phone.png b/images/phone.png