-
SCSS-videoDetailProject using node.js/Cloning Youtube 2020. 9. 2. 12:14
pages/videoDetail.scss
.profile { display: flex; flex-direction: column; align-items: center; .profile__column { &:nth-child(2) { display: flex; flex-direction: column; align-items: center; margin: 20px 0; margin-bottom: 40px; font-weight: 400; font-size: 18px; .profile__name { margin-bottom: 20px; } } &:last-child { .profile__btns { display: flex; flex-direction: column; align-items: center; margin-bottom: 50px; .profile__edit { margin-bottom: 20px; } a { width: 100%; max-width: 320px; } } } } } .uploaded-videos { display: grid; grid-template-columns: repeat(6, minmax(150px, 1fr)); grid-gap: 30px; .videoBlock:first-child, .videoBlock:nth-child(2) { grid-column: span 3; } .videoBlock:nth-child(3), .videoBlock:nth-child(4), .videoBlock:nth-child(5) { grid-column: span 2; } }
View
참고 자료
소스 코드
https://github.com/zpskek/wetube-v3/commit/787ee7a719f7bd513bac265740469856cfd3640d
'Project using node.js > Cloning Youtube' 카테고리의 다른 글
SCSS-videoPlayer (0) 2020.09.03 SCSS-search (0) 2020.09.02 SCSS-userDetail (0) 2020.09.02 SCSS-socialLogin (0) 2020.09.02 SCSS-form (0) 2020.09.02