Adiciona ícones do Font Awesome e atualiza estilos

dieguesmosken · Mar 14, 2024 · 0b93c67 · 0b93c67
1 parent eaceef3
commit 0b93c67
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/v2/index.html b/v2/index.html
@@ -7,6 +7,8 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Portifolio</title>
     <link rel="stylesheet" href="./styles/style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/js/all.min.js" integrity="sha512-GWzVrcGlo0TxTRvz9ttioyYJ+Wwk9Ck0G81D+eO63BaqHaJ3YZX9wuqjwgfcV/MrB2PhaVX9DkYVhbFpStnqpQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 </head>
 
 <body>
@@ -28,11 +30,11 @@ <h1 class="apresentacao__conteudo__titulo">Transforme suas ideias em realidade!
             <div class="apresentacao__links">
                 <h2 class="apresentacao__links__subtitulo">Acesse minhas redes</h2>
                 <a class="apresentacao__links__navegacao" href="https://github.com/dieguesmosken">
-                    <img src="./assets/github.png">
+                    <i class="apresentacao__icone fa-brands fa-github"></i>
                     Github
                 </a>
                 <a class="apresentacao__links__navegacao" href="https://linkedin.com/in/dieguesmosken">
-                    <img src="./assets/linkedin.png">
+                    <i class="apresentacao__icone fa-brands fa-linkedin-in"></i>
                     linkedin
                 </a>
                 <!-- <a class="apresentacao__links__navegacao" href="https://twitch.tv/teuzinytbr">

diff --git a/v2/styles/style.css b/v2/styles/style.css
@@ -67,6 +67,7 @@ body{
     align-items: center;
     gap: 32px;
 }
+
 .apresentacao__links__subtitulo{
     font-family: var(--fonte-primaria);
     font-weight: 400;
@@ -90,6 +91,11 @@ body{
 .apresentacao__links__navegacao:hover{
     background-color: var(--cor-hover);
 }
+.apresentacao__icone {
+    font-size: 1.5rem;
+    color: var(--cor-terciaria) ;
+}
+
 .apresentacao__imagem{
     width: 50%;
     border-radius: 25px;