VOCE TEM QUE USAR ISSO NO FRONT! · RivaldoSilva

Para evoluir teu front-end essa dica e necessaria

Hey guys sou eu Rivaldo Denovo, Porem dessa vez eu estou trazendo uma dica para voce dev Front-End.

Esse segredinho vai te ajudar muito na hora de codar o layout do seu site, e ele nao leva 10 Minutos para aprender.

Direto ao assunto vamos falar do Sass:

Oque e o SASS?

Syntactically Awesome Style Sheets

Sass é uma linguagem de folhas de estilo concebida inicialmente por Hampton Catlin e desenvolvida por Natalie Weizenbaum. Depois de suas versões iniciais, Weizenbaum e Chris Eppstein continuaram a estender Sass com SassScript, uma simples linguagem de script usada em arquivos Sass.

Agora que voce ja sabe oque e o Sass, como ele pode me ajudar na hora de montar layouts?

Esse e um codigo feito no sass

@import url(./_font.scss);
.uptade-log-background{
    border-radius: 0.5em;
    width: 300px;
    font-family: 'Inter', sans-serif;
    topo-uptade-log{
        h1{
            font-size: 1.1rem;
            margin: 0%;
            padding: 0%;
            margin-bottom: 0.10em;
        }
        h4{
            font-weight: 600;
            font-size: 0.9rem;
            bottom: -15px;
            position: absolute;
        }
    }

Esse codigo todo vira isso no css

@import url(./_font.scss);
.uptade-log-background {
  border-radius: 0.5em;
  width: 300px;
  background-color: rgb(235, 235, 235);
  font-family: "Inter", sans-serif;
}
.uptade-log-background topo-uptade-log {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 0%;
  border-bottom: 0.5px solid black;
  height: 2.5em;
  padding-left: 0.5em;
}
.uptade-log-background topo-uptade-log h1 {
  font-size: 1.1rem;
  margin: 0%;
  padding: 0%;
  margin-bottom: 0.1em;
}

Assim em diante!

O Sass compila todo seu Css deixando ele mais (Rapido,Legivel,Escalável,Didatico), e melhor parte se vocé ja sabe o CSS padrão nao leva 10 Minutos para aprender o Sass.

Se gostou do Sass pode acessar as aulas deles por aqui

Aprenda Sass em 10 Minutos - Esse video nao e meu

Qualquer duvida pode comentar e se ja utiliza me conta o quanto melhorou na sua perfomace, Eu pretendo abrir mias alguns post ensinando a usar ele porem por agora e isso❤️