Add files via upload

BrennonMeireles · Mar 6, 2024 · 541a4e4 · 541a4e4
1 parent f28c8df
commit 541a4e4
Show file tree

Hide file tree

Showing 14 changed files with 212 additions and 0 deletions.
diff --git a/css/experiencia.css b/css/experiencia.css
diff --git a/css/footer.css b/css/footer.css
diff --git a/css/formacao.css b/css/formacao.css
diff --git a/css/global.css b/css/global.css
@@ -0,0 +1,37 @@
+body {
+ font-family: "Fira Sans", Arial, sans-serif;
+ margin: 0px;
+ color: #141414;
+ }
+
+ h1, h2, h3, p {
+ margin: 0px;
+ }
+
+ ul {
+ margin: 0px;
+ padding: 0px;
+ list-style: none;
+ }
+
+ img {
+ max-width: 100%;
+ height: auto;
+ display: block;
+ }
+
+ .subtitulo {
+ font-size: 8rem;
+ line-height: 1;
+ text-transform: uppercase;
+ word-break: break-all;
+ max-width: 4ch;
+ }
+
+ @media (max-width: 800px) {
+ .subtitulo {
+ font-size: 3rem;
+ text-transform: capitalize;
+ max-width: initial !important;
+ }
+ }
diff --git a/css/header.css b/css/header.css
@@ -0,0 +1,29 @@
+.header{
+ max-width: 1200px;
+ justify-content:space-between;
+ align-items: center;
+ padding: 40px 20px;
+ margin: auto;
+ display: flex;
+}
+
+#logo{
+ width: 105px;
+ height: 40px
+}
+
+.header-menu{
+ display: flex;
+ justify-content:center;
+ flex-wrap: wrap;
+ gap: 10px;
+}
+
+.header-menu a{
+ font-size: 16px;
+ line-height: 1.3;
+ padding: 10px 20px;
+ text-decoration: none;
+ color: #141414;
+ display: block;
+}
diff --git a/css/introducao.css b/css/introducao.css
@@ -0,0 +1,64 @@
+.introducao{
+ max-width: 1200px;
+ padding: 40px 20px;
+ margin: auto;
+ display: grid;
+ align-items: center;
+ gap: 100px;
+ grid-template-columns: 1fr 2fr; 
+}
+
+.introducao h1{
+ /* font-size: 4.5rem; */
+ font-size: 72px;
+ line-height: 1.2;
+ margin-bottom: 30px;
+ position: relative;
+}
+
+.introducao h1::before{
+ content:"";
+ display: block;
+ width: 130px;
+ height: 100px;
+ background: url("../img/detalhe.svg") no-repeat center;
+ position: absolute;
+ top: -15px;
+ left: -40px;
+ z-index: -1;
+}
+
+.introducao p{
+ font-size: 24px;
+ color: #525252;
+}
+
+@media (max-width: 1000px){
+ .introducao h1{
+ font-size: 48px;
+ }
+}
+
+@media (max-width: 800px){
+ .introducao{
+ grid-template-columns: 1fr 1fr;
+ gap: 80px;
+ }
+ .introducao h1{
+ font-size: 32px;
+ }
+ .introducao h1::before{
+ width: 30px;
+ height: 10px;
+ left: 0px;
+ }
+}
+
+@media (max-width: 400px){
+ .introducao{
+ grid-template-columns: 1fr;
+ }
+ .introducao img {
+ display: none;
+ }
+}
diff --git a/css/style.css b/css/style.css
@@ -0,0 +1,6 @@
+@import './global.css';
+@import './header.css';
+@import './introducao.css';
+@import './experiencia.css';
+@import './formacao.css';
+@import './footer.css';
diff --git a/img/cursos.svg b/img/cursos.svg
diff --git a/img/detalhe.svg b/img/detalhe.svg
diff --git a/img/idiomas.svg b/img/idiomas.svg
diff --git a/img/marca.svg b/img/marca.svg
diff --git a/img/perfil.jpg b/img/perfil.jpg
diff --git a/index.html b/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="pt-br">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="css/style.css">
+ <title>Lobo</title>
+</head>
+<body>
+ <header class="header">
+ <img src="./img/marca.svg" alt="logo" id="logo">
+ <nav>
+ <ul class="header-menu">
+ <li><a href="#experiencia">Experiência</a></li>
+ <li><a href="#formacao">Formação</a></li>
+ <li><a href="#contato">Contato</a></li>
+ </ul>
+ </nav>
+ </header>
+
+ <main class="introducao">
+ <img src="./img/perfil.jpg" alt="Logo do perfil">
+
+ <div>
+ <h1>Desenvolvedor<br>Front End &<br>UX/UI Designer</h1>
+ <p>Localizado no Rio de Janeiro</p>
+ </div>
+ </main>
+
+
+</body>
+</html>
diff --git a/onde paramos.txt b/onde paramos.txt
@@ -0,0 +1 @@
+vamos adicionar a section class = experiencia