Ruan branch

entrada.html

@@ -21,7 +21,7 @@ <h1 class="logo">ARG Flog</h1>
             <nav class="main-nav" aria-label="Navegação principal">
                 <ul>
                     <li><a href="index.html">Início</a></li>
-                    <li><a href="andre-perfil.html">Perfil</a></li>
+                    <li><a href="perfil.html">Perfil</a></li>
                     <li><a href="cadastro.html">Nova Entrada</a></li>
                     <li><a href="#">Sobre</a></li>
                 </ul>
@@ -52,7 +52,7 @@ <h3 class="entry-author-name"><a href="andre-perfil.html">André</a></h3>
                 </header>
 
                 <div class="entry-featured-image">
-                    <img src="images/interface-dotask.png" alt="Imagem ilustrativa da criação da paleta de cores">
+                    <img src="images/design-ui.jpg" alt="Imagem ilustrativa da criação da paleta de cores">
                 </div>
 
                 <div class="entry-content">
@@ -72,20 +72,36 @@ <h2>Processo de Seleção de Cores</h2>
                     <h2>Cores Primárias e Secundárias</h2>
 
                     <p>A cor primária escolhida foi um tom de azul (#0066cc) que transmite confiança e estabilidade. Para as cores secundárias, optei por tons complementares que criam um bom contraste visual.</p>
-                        <div class="color-item" style="background-color: #f5f5f5">
-                            <span class="color-name">Cinza Claro</span>
-                            <span class="color-hex">#f5f5f5</span>
-                        </div>                    
+
+                    <div class="color-palette">
+                        <div class="color-item" style="background-color: #0066cc">
+                            <span class="color-name">Azul Primário</span>
+                            <span class="color-hex">#0066cc</span>
+                        </div>
+                        <div class="color-item" style="background-color: #004080">
+                            <span class="color-name">Azul Escuro</span>
+                            <span class="color-hex">#004080</span>
+                        </div>
+                        <div class="color-item" style="background-color: #e5f1ff">
+                            <span class="color-name">Azul Claro</span>
+                            <span class="color-hex">#e5f1ff</span>
+                        </div>
                         <div class="color-item" style="background-color: #333333">
                             <span class="color-name">Cinza Escuro</span>
                             <span class="color-hex">#333333</span>
                         </div>
-                        <div class="color-item" style="background-color: #426b1f">
-                            <span class="color-name">Fronde de samambaia</span>
-                            <span class="color-hex">#004080</span>
+                        <div class="color-item" style="background-color: #f5f5f5">
+                            <span class="color-name">Cinza Claro</span>
+                            <span class="color-hex">#f5f5f5</span>
                         </div>
                     </div>
 
+                    <h2>Aplicação na Interface</h2>
+
+                    <p>Implementei a paleta em diferentes componentes da interface, garantindo consistência visual e hierarquia adequada. Os botões primários utilizam o azul principal, enquanto elementos secundários usam tons mais suaves.</p>
+
+                    <p>Também defini regras para o uso de cada cor, documentando-as no nosso sistema de design para garantir que todos os membros da equipe sigam o mesmo padrão.</p>
+
                     <blockquote>
                         "A cor é um poder que influencia diretamente a alma. A cor é o teclado, os olhos são os martelos, a alma é o piano com muitas cordas. O artista é a mão que toca, tocando uma tecla ou outra propositadamente, para causar vibrações na alma." - Wassily Kandinsky
                     </blockquote>
@@ -145,7 +161,7 @@ <h3 class="comment-author"><a href="ruan-perfil.html">Ruan</a></h3>
 
                     <div class="comment">
                         <a href="#" class="comment-avatar-link">
-                            <img src="https://cdn-icons-png.flaticon.com/512/7606/7606103.png" alt="Avatar de Usuário 1" class="comment-avatar">
+                            <img src="images/user1.png" alt="Avatar de Usuário 1" class="comment-avatar">
                         </a>
                         <div class="comment-content">
                             <h3 class="comment-author"><a href="#">Carla</a></h3>
@@ -156,7 +172,7 @@ <h3 class="comment-author"><a href="#">Carla</a></h3>
 
                     <div class="comment">
                         <a href="#" class="comment-avatar-link">
-                            <img src="https://cdn-icons-png.flaticon.com/512/7606/7606103.png" alt="Avatar de Usuário 2" class="comment-avatar">
+                            <img src="images/user2.png" alt="Avatar de Usuário 2" class="comment-avatar">
                         </a>
                         <div class="comment-content">
                             <h3 class="comment-author"><a href="#">Marcos</a></h3>
@@ -273,7 +289,7 @@ <h3>Nossa Equipe</h3>
             <i class="fas fa-plus-square" aria-hidden="true"></i>
             <span class="sr-only">Nova Entrada</span>
         </a>
-        <a href="andre-perfil.html">
+        <a href="perfil.html">
             <i class="fas fa-user" aria-hidden="true"></i>
             <span class="sr-only">Perfil</span>
         </a>

index.html

@@ -21,7 +21,7 @@ <h1 class="logo">ARG Flog</h1>
             <nav class="main-nav" aria-label="Navegação principal">
                 <ul>
                     <li><a href="index.html" class="active" aria-current="page">Início</a></li>
-                    <li><a href="andre-perfil.html">Perfil</a></li>
+                    <li><a href="perfil.html">Perfil</a></li>
                     <li><a href="cadastro.html">Nova Entrada</a></li>
                     <li><a href="#">Sobre</a></li>
                 </ul>
@@ -65,11 +65,9 @@ <h2>Últimas Entradas</h2>
                     <article class="feed-card">
                         <header class="feed-card-header">
                             <div class="author-info">
-                                <a href="./ruan-perfil.html">
                                 <img href="./ruan-perfil.html" src="images/ruan-avatar.jpg" alt="Avatar de Ruan" class="author-avatar">
-                                </a>
                                 <div>
-                                    <a href="./ruan-perfil.html"><h3 class="author-name">Ruan</h3></a>
+                                    <h3 class="author-name">Ruan</h3>
                                     <span class="post-date">10/03/2025</span>
                                 </div>
                             </div>
@@ -79,7 +77,7 @@ <h2>Últimas Entradas</h2>
                         </header>
 
                         <div class="feed-image-container">
-                            <img src="https://freefrontend.com/assets/img/css-grid-examples/responsive-plants-shopping-uix-using-css-grid-greensocks-flip.png" alt="Implementação do CSS Grid" class="feed-image">
+                            <img src="images/css-grid.jpg" alt="Implementação do CSS Grid" class="feed-image">
                         </div>
 
                         <div class="feed-card-content">
@@ -129,11 +127,9 @@ <h2 class="feed-title">Implementação do CSS Grid</h2>
                     <article class="feed-card">
                         <header class="feed-card-header">
                             <div class="author-info">
-                                <a href="andre-perfil.html">
-                                <img src="images/foto_andre_perfil.jpg" alt="Avatar de André" class="author-avatar">
-                                </a>
+                                <img href="./andre-perfil.html" src="./images/foto_andre_perfil.jpg" alt="Avatar de André" class="author-avatar">
                                 <div>
-                                    <a href="andre-perfil.html"><h3 class="author-name">André</h3></a>
+                                    <h3 class="author-name">André</h3>
                                     <span class="post-date">09/03/2025</span>
                                 </div>
                             </div>
@@ -143,7 +139,7 @@ <h2 class="feed-title">Implementação do CSS Grid</h2>
                         </header>
 
                         <div class="feed-image-container">
-                            <img src="images/interface-dotask.png" alt="Design da Interface" class="feed-image">
+                            <img src="images/design-ui.jpg" alt="Design da Interface" class="feed-image">
                         </div>
 
                         <div class="feed-card-content">
@@ -193,11 +189,9 @@ <h2 class="feed-title">Criação da Paleta de Cores</h2>
                     <article class="feed-card">
                         <header class="feed-card-header">
                             <div class="author-info">
-                                <a href="./igor-perfil.html">
-                                <img src="images/igor-avatar.jpg" alt="Avatar de Igor" class="author-avatar">
-                                </a>
+                                <img href="./igor-perfil.html" src="images/igor-avatar.jpg" alt="Avatar de Igor" class="author-avatar">
                                 <div>
-                                    <a href="./igor-perfil.html"><h3 class="author-name">Igor</h3></a>
+                                    <h3 class="author-name">Igor</h3>
                                     <span class="post-date">08/03/2025</span>
                                 </div>
                             </div>
@@ -207,7 +201,7 @@ <h2 class="feed-title">Criação da Paleta de Cores</h2>
                         </header>
 
                         <div class="feed-image-container">
-                            <img src="https://4.bp.blogspot.com/-H7CN3vflWDE/T2Kijd4egcI/AAAAAAAAA58/AQy7rIE3Q_A/s1600/MODELO_ER_EXTENDIDO.jpg" alt="Modelagem de Banco de Dados" class="feed-image">
+                            <img src="images/database.png" alt="Modelagem de Banco de Dados" class="feed-image">
                         </div>
 
                         <div class="feed-card-content">
@@ -267,12 +261,12 @@ <h2 class="feed-title">Modelagem do Banco de Dados</h2>
             <aside class="sidebar">
                 <!-- Perfil do Usuário -->
                 <div class="sidebar-profile">
-                    <img src="images/foto_andre_perfil.jpg" alt="Seu perfil" class="sidebar-avatar">
+                    <img src="images/seu-avatar.jpg" alt="Seu perfil" class="sidebar-avatar">
                     <div class="sidebar-user-info">
                         <h3>Seu Nome</h3>
                         <p>@seu_usuario</p>
                     </div>
-                    <a href="andre-perfil.html" class="sidebar-link">Ver perfil</a>
+                    <a href="perfil.html" class="sidebar-link">Ver perfil</a>
                 </div>
 
                 <!-- Sugestões -->
@@ -284,7 +278,7 @@ <h3>Sugestões para você</h3>
 
                     <div class="suggestions-list">
                         <div class="suggestion-item">
-                            <img src="https://cdn-icons-png.flaticon.com/512/6997/6997808.png" alt="Usuário 1" class="suggestion-avatar">
+                            <img src="images/user1.jpg" alt="Usuário 1" class="suggestion-avatar">
                             <div class="suggestion-info">
                                 <h4>user1</h4>
                                 <p>Novo no ARG Flog</p>
@@ -293,7 +287,7 @@ <h4>user1</h4>
                         </div>
 
                         <div class="suggestion-item">
-                            <img src="https://cdn-icons-png.flaticon.com/512/7606/7606103.png" alt="Usuário 2" class="suggestion-avatar">
+                            <img src="images/user2.jpg" alt="Usuário 2" class="suggestion-avatar">
                             <div class="suggestion-info">
                                 <h4>user2</h4>
                                 <p>Seguido por Ruan</p>
@@ -302,7 +296,7 @@ <h4>user2</h4>
                         </div>
 
                         <div class="suggestion-item">
-                            <img src="https://cdn-icons-png.flaticon.com/512/6997/6997808.png" alt="Usuário 3" class="suggestion-avatar">
+                            <img src="images/user3.jpg" alt="Usuário 3" class="suggestion-avatar">
                             <div class="suggestion-info">
                                 <h4>user3</h4>
                                 <p>Seguido por André</p>
@@ -347,9 +341,9 @@ <h3>Links Úteis</h3>
                 <div class="footer-section team">
                     <h3>Nossa Equipe</h3>
                     <ul>
-                        <li><a href="./ruan-perfil.html">Ruan</a></li>
-                        <li><a href="andre-perfil.html">André</a></li>
-                        <li><a href="./igor-perfil.html">Igor</a></li>
+                        <li><a href="perfil.html?user=ruan">Ruan</a></li>
+                        <li><a href="perfil.html?user=andre">André</a></li>
+                        <li><a href="perfil.html?user=igor">Igor</a></li>
                     </ul>
                 </div>
             </div>
@@ -374,7 +368,7 @@ <h3>Nossa Equipe</h3>
             <i class="fas fa-plus-square" aria-hidden="true"></i>
             <span class="sr-only">Nova Entrada</span>
         </a>
-        <a href="andre-perfil.html">
+        <a href="perfil.html">
             <i class="fas fa-user" aria-hidden="true"></i>
             <span class="sr-only">Perfil</span>
         </a>