Skip to content

Commit 2f2bbf5

Browse files
arielmlimaarielmlima
committed
.
1 parent b1e3aba commit 2f2bbf5

File tree

8 files changed

+142
-3
lines changed

8 files changed

+142
-3
lines changed

‎DESAFIOS/013/estilos/social.css

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
@charset "UTF-8";
2+
* {
3+
margin: 0px;
4+
padding: 0px;
5+
font-family: Arial, Helvetica, sans-serif;
6+
}
7+
8+
::-webkit-scrollbar {
9+
/* Para tirar barra de rolagem */
10+
width: 0px;
11+
height: 0px;
12+
}
13+
14+
15+
img {
16+
width: 100vw;
17+
18+
}
19+
20+
a {
21+
display: block;
22+
background-color: darkred;
23+
padding: 20px;
24+
color: white;
25+
text-align: center;
26+
font-weight: bolder;
27+
text-decoration: none;
28+
}
29+
30+
a:hover{
31+
background-color: red;
32+
}

‎DESAFIOS/013/estilos/style.css

+28-2
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,32 @@ section#telefone {
4949
position: relative;
5050
top: 80px;
5151
left: 22px;
52-
width: 269px;
52+
width: 267px;
5353
height: 471px;
54-
}
54+
}
55+
56+
#redes-sociais{
57+
text-align: right;
58+
/* Botões na lateral direita */
59+
}
60+
61+
#redes-sociais img{
62+
width: 50px;
63+
/* diminuir um pouco os itens */
64+
margin: 10px;
65+
/* Separar um pouco os itens um do outro */
66+
border-radius: 50%;
67+
box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.447);
68+
box-sizing: border-box;
69+
/* Para a borda fazer parte da caixa, que vamos definir abaixo ao passar o mouse em cima */
70+
71+
}
72+
73+
#redes-sociais img:hover{
74+
border: 2px solid rgba(255, 255, 255, 0.682);
75+
transform: translate(-3px, -3px);
76+
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.607);
77+
transition: transform .2s, border 1s;
78+
/* GERAR UM MOVIMENTO DEPOIS DE 3 SEG */
79+
}
80+

‎DESAFIOS/013/facebook.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="pt-br">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Página</title>
7+
<link rel="stylesheet" href="estilos/social.css">
8+
</head>
9+
<body>
10+
<img src="imagens/tela-facebook.jpg" alt="Tela Facebook">
11+
<a href="https://www.facebook.com/gustavoguanabara" target="_blank">ACESSE</a>
12+
</body>
13+
</html>

‎DESAFIOS/013/github.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="pt-br">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Página</title>
7+
<link rel="stylesheet" href="estilos/social.css">
8+
</head>
9+
<body>
10+
<img src="imagens/tela-github.jpg" alt="Tela GitHub">
11+
<a href="https://www.github.com/gustavoguanabara" target="_blank">ACESSE</a>
12+
</body>
13+
</html>

‎DESAFIOS/013/index.html

+14-1
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,23 @@
1010
</head>
1111
<body>
1212
<section id="telefone">
13-
<iframe src="home.html" name="tela" id="tela" frameborder="0"></iframe>
13+
<iframe src="home.html" name="tela" id="tela" frameborder="0">
14+
Seu navegador não é compativel com isso.
15+
</iframe>
1416
</section>
1517

1618
<section id="redes-sociais">
19+
<a href="home.html" target="tela"><img src="imagens/logo-home.jpg" alt="Home"></a><br>
20+
21+
<a href="youtube.html" target="tela"><img src="imagens/logo-youtube.jpg" alt="Youtube"></a><br>
22+
23+
<a href="github.html" target="tela"><img src="imagens/logo-github.jpg" alt="GitHub"></a><br>
24+
25+
<a href="instagram.html" target="tela"><img src="imagens/logo-instagram.jpg" alt="Insta"></a><br>
26+
27+
<a href="twitter.html" target="tela"><img src="imagens/logo-twitter.jpg" alt="TT"></a><br>
28+
29+
<a href="facebook.html" target="tela"><img src="imagens/logo-facebook.jpg" alt="Fb"></a><br>
1730

1831
</section>
1932

‎DESAFIOS/013/instagram.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="pt-br">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Página</title>
7+
<link rel="stylesheet" href="estilos/social.css">
8+
</head>
9+
<body>
10+
<img src="imagens/tela-instagram.jpg" alt="Tela Insta">
11+
<a href="https://instagram.com/gustavoguanabara" target="_blank">ACESSE</a>
12+
</body>
13+
</html>

‎DESAFIOS/013/twitter.html

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="pt-br">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Página</title>
7+
<link rel="stylesheet" href="estilos/social.css">
8+
</head>
9+
<body>
10+
<img src="imagens/tela-twitter.jpg" alt="Tela Twitter">
11+
<a href="https://www.x.com/guanabara" target="_blank">ACESSE</a>
12+
</body>
13+
</html>

‎DESAFIOS/013/youtube.html

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<!DOCTYPE html>
2+
<html lang="pt-br">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Página</title>
8+
<link rel="stylesheet" href="estilos/social.css">
9+
</head>
10+
11+
<body>
12+
<img src="imagens/tela-youtube.png" alt="Tela Youtube">
13+
<a href="https://www.youtube.com/@CursoemVideo" target="_blank">ACESSE</a>
14+
</body>
15+
16+
</html>

0 commit comments

Comments
 (0)