Browse Source

Implementando BEM

master
JailtonAraujo 3 years ago
parent
commit
00f56e1c0c
3 changed files with 14 additions and 11 deletions
  1. +4
    -2
      css/global.css
  2. +7
    -6
      css/home.css
  3. +3
    -3
      index.html

+ 4
- 2
css/global.css View File

@ -28,7 +28,7 @@ header{
margin-bottom: 1em;
}
header > nav > ul{
header > .header__menu > ul{
display: flex;
gap: 1em;
}
@ -37,11 +37,13 @@ header > .brand > a > img {
width: 50px;
}
header > nav > ul > li > a{
header > .header__menu > ul > li > a{
color: var(--third-color);
font-weight: bold;
transition: all .2s ease-in-out;
}
main{
min-height: 85vh;
width: 100%;


+ 7
- 6
css/home.css View File

@ -1,30 +1,31 @@
@import url("./variables.css");
.title{
.container__title{
text-align: center;
}
.title > h1 {
.container__title > h1 {
font-size: 4em;
margin-bottom: 0.3em;
}
.title > h1 > span {
.container__title > h1 > span {
color: var(--third-color);
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.title > h3{
.container__title > h3{
font-size: 2em;
margin-bottom: 0.3em;
}
.title > h4{
.container__title > h4{
font-size: 2em;
margin-bottom: 0.3em;
}
.title > h4 > a {
.container__title > h4 > a {
color: var(--third-color);
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
text-decoration: underline;
}

+ 3
- 3
index.html View File

@ -17,9 +17,9 @@
<header>
<div class="brand"> <a href="#"><img src="./img/moeda.png" alt="img_coin"></a> </div>
<div class="header__logo"> <a href="#"><img src="./img/moeda.png" alt="img_coin"></a> </div>
<nav class="navbar">
<nav class="header__menu">
<ul>
<li> <a href="#">HOME</a> </li>
<li> <a href="#">CLIENTES</a></li>
@ -33,7 +33,7 @@
<div class="container">
<div class="title">
<div class="container__title">
<h1><span>Coin</span>Bank,</h1>
<h3>O banco que cuida do seu dinherio!</h3>


Loading…
Cancel
Save