Skip to content

Commit d2f5787

Browse files
m4rcos-devm4rcos-dev
authored
Merge pull request #2 from m4rcos-dev/projeto-pixels-art
Projeto pixels art
2 parents 70a6439 + fd8f95b commit d2f5787

File tree

3 files changed

+90
-58
lines changed

3 files changed

+90
-58
lines changed

‎imagens/avatar2.png‎

348 KB
Loading

‎index.html‎

Lines changed: 20 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,68 +1,30 @@
11
<!DOCTYPE html>
22
<html lang="pt-br">
3-
43
<head>
54
<meta charset="UTF-8">
6-
<title>{ 🚀 } Portfólio</title>
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Marcos Paulo</title>
78
</head>
89

910
<body>
10-
<h1 id="#avatar">Marcos Paulo Pereira</h1>
11-
<hr>
12-
<img src="imagens/avatar.png" width="300px">
13-
<p>*/
14-
<ul>
15-
<li>💻 Apaixonado por tecnologia e seu universo!</li>
16-
<li>👫 Marido</li>
17-
<li>👨‍👩‍👧‍👧 Pai de casal</li>
18-
<li>💬 Estudante desenvolvimento Web! | <a href="https://www.betrybe.com" target="_blank">TRYBE!</a></li>
19-
<li>💾 Técnico informática</li>
20-
<li>🎥 <a href="https://twitch.tv/novatogamertv" target="_blank"> Streamer </a> | <strong>⏸ Projeto Pausado</strong></li>
21-
<li>👾 Gamer</li>
22-
</ul>
23-
/*</p>
24-
25-
<hr>
26-
27-
<h2>Linguagens</h2>
28-
<p>
29-
<img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/javascript/javascript-plain.svg"
30-
width="40px">
31-
<img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/html5/html5-original.svg"
32-
width="40px">
33-
<img src="https://raw.githubusercontent.com/devicons/devicon/master/icons/css3/css3-original.svg" width="40px">
34-
...
35-
</p>
36-
37-
<p>
38-
Atualmente <a href="#avatar">eu</a> estudo desenvolvimento web na <strong>TRYBE</strong> e essas são algumas linguagens e tecnologias que estou usando em meus projetos!
39-
Mas como estou no inicio dessa jornada ainda virão muitas outras linguagens e tecnologias aqui.
40-
</p>
41-
42-
<details>
43-
<h3>Javascript</h3>
44-
<p><em>"É uma linguagem de programação interpretada estruturada, de script em alto nível com tipagem dinâmica fraca e multiparadigma. Juntamente com HTML e CSS, o JavaScript é uma das três principais tecnologias da World Wide Web."</em></p>
45-
46-
<h3>HTML 5</h3>
47-
<p><em>"É uma linguagem de marcação para a World Wide Web e é uma tecnologia chave da Internet, originalmente proposto por Opera Software. É a quinta versão da linguagem HTML."</em></p>
48-
49-
<h3>CSS 3</h3>
50-
<p><em>"Style Sheets (CSS) é uma "folha de estilo" composta por “camadas” e utilizada para definir a apresentação (aparência) em páginas da internet que adotam para o seu desenvolvimento linguagens de marcação (como XML, HTML e XHTML)"</em></p>
51-
52-
</details>
53-
54-
<h2>Encontre-me</h2>
55-
<a href="https://instagram.com/m4rcos.dev" target="_blank"> <img src="imagens/instagram.svg"></a>
56-
57-
<a href="https://twitch.tv/novatogamertv" target="_blank"><img src="imagens/twitch.svg"></a>
58-
59-
<a href="#" target="_blank"><img src="imagens/discord.svg"></a>
60-
61-
<a href="https://[email protected]" target="_blank"><img src="imagens/email.svg"></a>
62-
63-
<a href="https://www.linkedin.com/in/dev-marcospaulo" target="_blank"><img src="imagens/linkden.svg"></a>
64-
11+
<header id="header">
12+
<h1>Marcos</h1>
13+
<nav id="nav">
14+
<h3>Inicio</h3>
15+
<h3>Sobre Mim</h3>
16+
<h3>Projetos</h3>
17+
<h3>Contato</h3>
18+
</nav>
19+
</header>
20+
21+
<section id="home">
22+
<h1 id="title">Olá, me chamo Marcos Paulo</h1>
23+
<h2 id="caption">Eu sou ....</h2>
24+
<p id="description">Apaixonado por tecnologia desde os 14 anos, desenvolvedor web junior, com muita vontade e disposição de aprender acrescentar e evoluir. Cursando desenvolvineto Web fullStack na Trybe. </p>
25+
<img id="avatar" src="imagens/avatar2.png" alt="avatar">
26+
<button id="download">Download Currículo</button>
27+
</section>
6528

6629
</body>
67-
6830
</html>

‎style.css‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
* {
2+
padding: 0;
3+
margin: 0;
4+
border: 0
5+
}
6+
7+
main {
8+
display: flex;
9+
padding: 0px 0px 0px 21%;
10+
height: 100vh;
11+
background-color: #121112;
12+
}
13+
14+
.font-standart {
15+
color: white;
16+
font-family: 'Fredoka One', cursive;
17+
}
18+
19+
.font-contrast {
20+
color: #f43f33;
21+
font-family: 'Fredoka One', cursive;
22+
}
23+
24+
.title-contrast {
25+
font-family: 'Tangerine', cursive;
26+
font-size: 50px;
27+
}
28+
29+
.title-content {
30+
padding: 6% 0px 0px 0px;
31+
}
32+
33+
#aside-left {
34+
display: flex;
35+
flex-direction: column;
36+
justify-content: center;
37+
align-items: center;
38+
width: 20%;
39+
height: 100vh;
40+
position: fixed;
41+
background-color: #1d1b1d;
42+
border-right: #363537 2px solid;
43+
}
44+
45+
#title-aside-left {
46+
display: flex;
47+
border: 0px;
48+
padding: 0px;
49+
}
50+
51+
#subtitle-aside-left {
52+
display: flex;
53+
border: 0px;
54+
padding-right: 90px;
55+
}
56+
57+
.paddin-ico {
58+
padding: 10px 0px 0px 80px;
59+
font-size: 50px;
60+
align-self: start;
61+
}
62+
63+
.nav-content {
64+
display: flex;
65+
flex-direction: column;
66+
}
67+
68+
#home {
69+
width: 80%;
70+
}

0 commit comments

Comments
 (0)