Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@rafa3772
rafa3772 authored Jun 12, 2024
1 parent 4a989fe commit 3f7dce5
Show file tree
Hide file tree
Showing 18 changed files with 6,335 additions and 0 deletions.
372 changes: 372 additions & 0 deletions lasanha.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,372 @@
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Open Sans", sans-serif;
}

ul{
list-style: none;
}

a{
text-decoration: none;
}

img{
max-width: 100%;
}

a, a:visited, a:hover, a:active {
color: inherit; /* Mantém a cor do texto ao invés de usar a cor padrão do link */
text-decoration: none; /* Remove o sublinhado */
font-size: inherit; /* Mantém o tamanho da fonte */
}

@media screen and (max-width: 480px) {}

@media screen and (min-width: 1200px) {
.container{
display: grid;
grid-template-columns: 65% 30%;
justify-content: space-between;
padding: 10px 5%;
grid-template-areas:
"header header"
"main aside"
;
}
.sair{
font-size: 15px;
padding: 10px;
margin: auto;
width: auto;
margin-left: 300px;
}

/* Dispositivos com largura máxima de 768px (tablets) */
@media screen and (max-width: 768px){}

header{
grid-area: header;
display: grid;
grid-template-columns: 20% 50% 30%;
grid-template-areas:
"logo search nav--right"
"nav nav nav"
;
align-items: center;
}
.logo{
grid-area: logo;
padding: 0 5%;
cursor: pointer;
}
.search{
grid-area: search;
padding-right: 5%;
margin-left: 30%;
}
.search input[type='search']{
display: inline-block;
width: 70%;
height: 50px;
border-radius: 7px 0px 0px 7px;
margin-right: -4px;
font-size: 18px;
padding: 0 7px;
}
.search button{
display: inline-block;
height: 50px;
padding: 8px;
border-radius: 0 7px 7px 0;
background: black;
border: black;
vertical-align: top;
cursor: pointer;
}
.nav--right{
grid-area: nav--right;
text-align: center;
}
.nav--right ul li{
display: inline-block;
margin: 0 10px;
}
#Entrar{
font-size: 18px;
font-weight: 500;
float: right;
display: flex;
width: 100px;
padding-top: 20px;
}
}
.nav--right li svg{
margin-top: 10px;
display: flex;
float: right;
margin-right: -120px;
cursor: pointer;
}
.foto_usuario{
width: 70px;
float: right;
}
nav{
grid-area: nav;
display: flex;
justify-content: space-around;
background-color: #ffe987;
padding: 0px;
border-radius: 4px;
margin-bottom: 20px;
}
nav li{
font-weight: 500;
font-size: 19px;
margin: 0 40px;
display: inline-block;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
padding: 7px;
cursor: pointer;
}
.almoco{
text-decoration: none;
}
.breadcrumbs ul svg{
width: 20px;
vertical-align: middle;
}
.breadcrumbs{
font-family: "Roboto", sans-serif;
padding: 10px 48px;
box-shadow: 0 4px 30px -10px rgba(0, 0, 0, 0.2);
width: fit-content;
margin-bottom: 20px;
margin-left: 5%;
}
.breadcrumbs ul{
display: flex;
list-style: none;
align-items: center;
padding: 0;
margin: 0;
gap: 8px;
}
.breadcrumbs ul li a{
text-decoration: none;
color: black;
font-family: "Roboto", sans-serif;
display: flex;
text-align: center;
padding-top: 4px;
}
.breadcrumbs ul li a:hover{
color: #0984e3;
}
.breadcrumbs ul li:last-child a{
font-weight: bold;
}
.breadcrumbs ul li.arrow svg{
width: 18px;
}

main{grid-area: main;}

.slide{
display: grid;
grid-template-columns: 90% 10%;
grid-template-areas:
"slide__foto slide__btnshare"
"slide__btninferior slide__btninferior"
;
}

.titulo{
display: grid;
grid-template-columns: 60% 15% 25%;
grid-template-areas:
"titulo_receita bolinha_imagem nome_pessoa"
;
}
.titulo_receita{
grid-area: titulo_receita;
padding-left: 30px;
padding-bottom: 5%;
}
.bolinha_imagem{
grid-area: bolinha_imagem;
width: 60%;
margin-right: -10px;
}
.nome_pessoa{
grid-area: nome_pessoa;
width: 50%;
align-content: left;
font-family: "Open Sans";
font-size: 15px;
display: flex;
padding-top: 20px;
margin-left: -20px;
}

.slide__foto{
grid-area: slide__foto;
}
.slide__foto img{
border-radius: 20px;
}
.slide__btnshare{
grid-area: slide__btnshare;
padding: 0 20%;
line-height: 30px;
align-content: center;
}
.slide__btninferior{
grid-area: slide__btninferior;
display: grid;
grid-template-columns: repeat(3, 16%);
justify-content: space-between;
padding-top: 20px;
padding-bottom: 60px;
}
.slide__btninferior div{
width: 52px;
height: 52px;
}
aside{
grid-area: aside;
margin-bottom: 30px;
}

.titulo h1{
font-family: "Open Sans";
font-size: 26px;
font-weight: 500;
color: #171717;
width: 400px;
}
.ingredientes_titulo{
height: 40px;
font-family: "Poppins";
font-size: 18px;
font-weight: 700;
line-height: 20px;
color: rgb(60, 60, 60);
margin-bottom: 20px;
background-color: #f3f3f3;
align-content: center;
}
.ingredientes_titulo ul{
margin-left: 20px;
}
.mododepreparo_titulo{
margin-top: 30px;
height: 40px;
font-family: "Poppins";
font-size: 18px;
font-weight: 700;
line-height: 20px;
color: rgb(60, 60, 60);
margin-bottom: 20px;
background-color: #f3f3f3;
align-content: center;
}
.mododepreparo_titulo ul{
margin-left: 20px;
}
.instrucoes_receita{
width: 90%;
}
.titulo h1{
font-family: "Open Sans";
font-size: 26px;
font-weight: 500;
color: #171717;
width: 400px;
}
.instrucoes_receita{
width: 90%;
}
.tabela_ingredientes th, .tabela_ingredientes td{
padding: 5px 20px 0px 5px;
font-family: "Poppins";
font-size: 14px;
line-height: 21px;
font-weight: 400;
}
.modo_de_preparo th, .modo_de_preparo td{
padding: 20px 40px 20px 5px;
border-bottom: 1px solid #e1e1e1;
border-collapse: unset;
font-family: "Poppins";
font-size: 14px;
line-height: 21px;
font-weight: 400;
}
#numero{
font-family: "Poppins";
font-size: 14px;
line-height: 21px;
font-weight: 600;
color: #ff6a28;
}
.recomendadas h1{
width: 100%;
font-family: "Open Sans";
font-size: 26px;
font-weight: 500;
color: #171717;
text-align: center;
margin-bottom: 17%;
}
.imagem_aside img{
border-radius: 20px;
}
.icones_inferior{
display: grid;
grid-template-columns: 20% 60% 20%;
grid-template-areas:
"bolinha_aside texto_bolinha_aside icone_coments"
;
}
.bolinha_aside{
grid-area: bolinha_aside;
}
.bolinha_aside img{
width: 60%;
padding: 0;
margin-left: 20%;
margin-top: 5%;
}
.texto_bolinha_aside{
grid-area: texto_bolinha_aside;
font-size: 15px;
justify-content: center;
width: 80%;
align-content: center;
}
.texto_bolinha_aside ul{
font-family: "Open Sans";
}
.icone_coments{
grid-area: icone_coments;
justify-content: center;
align-content: center;
}
.icone_coments img{
width: 40%;
margin-left: 10%;
margin-top: 5%;
}
.receita1, .receita2, .receita3, .receita4, .receita5, .receita6{
margin-top: 30px;
}
.icones{
cursor: pointer;
}
.imagem_receita{
cursor: pointer;
}
Loading

0 comments on commit 3f7dce5

Please sign in to comment.