HZC v6

Continuando projeto HZC adicionando mais um layout.

assets/css/componentes/cards.css

@@ -9,27 +9,31 @@
 
 .card_1{
     grid-area: card_1;
+    max-height: 320px;
 }
 
 .card_2{
     grid-area: card_2;
+    max-height: 320px;
 }
 
 .card_3{
     grid-area: card_3;
+    max-height: 320px;
 }
 
 .card_4{
     grid-area: card_4;
+    max-height: 320px;
 }
 
-.foto_card{
+img.foto_card{
     border-radius: 16px 16px 0 0;
 }
 
 .card_info{
     display: grid;
-    gap: 12px 24px;
+    gap: 8px 24px;
     grid-template-columns: auto 1fr;
     padding: 16px;
 }
@@ -46,13 +50,18 @@
     font-weight: bold;
     grid-column: 1 / -1;
     margin: 0 0 18px 0;
+    max-width: 20ch;
 }
 
 .card_titulo.destaque{
     font-size: 1.625rem;
     margin: 0;
 }
 
+.card_titulo.tirar_margem{
+    margin: 0;
+}
+
 .card_autor{
     font-size: 0.875rem;
     line-height: 1.7;

assets/css/componentes/secao.css

@@ -1,7 +1,7 @@
 .secao{
     display: grid;
     align-items: start;
-    gap: 32px 24px;
+    gap: 24px 32px;
 }
 
 .secao_titulo{

assets/css/global/global.css

@@ -12,7 +12,7 @@ a{
 }
 
 img{
-    width: 100%;
+    max-width: 100%;
     display: block;
 }
 

assets/css/home/camisas_mais_recentes.css

@@ -0,0 +1,7 @@
+.camisas_mais_recentes{
+    grid-template: 
+    "titulo titulo titulo titulo" 
+    "card_1 card_2 card_3 card_4"
+    / 1fr 1fr 1fr 1fr
+    ;
+}

assets/css/home/videos_mais_vistos.css

@@ -5,4 +5,8 @@
     "lista_conteudo card_destaque card_destaque card_destaque" auto
     / 1fr 1fr 1fr 1fr
     ;
+}
+
+.lista_conteudos.novas_artes{
+    padding: 16px;
 }

assets/css/style.css

@@ -32,4 +32,7 @@
 @import "./home/hero.css";
 
 /* Videos mais vistos (seção) */
-@import "./home/videos_mais_vistos.css";
+@import "./home/videos_mais_vistos.css";
+
+/* Camisas mais recentes (seção) */
+@import "./home/camisas_mais_recentes.css";