SCSS - home

pages/home.scss

.home-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

http://localhost:5002/

참고 자료

• 노마드 코더의 유튜브 클론 강의

소스 코드

https://github.com/zpskek/wetube-v3/commit/cec8d685c18b739c253bcf437308d236c54a93ef