Merge branch 'main' of https://github.com/unb-mds/LicitaBSB-24.1

frontend/src/components/carrosel/index.jsx

@@ -0,0 +1,3 @@
+import React from 'react';
+import style from '../carrosel/style.module.css'
+

frontend/src/components/header/__snapshots__/header.test.js.snap

@@ -17,39 +17,9 @@ Array [
   >
     <a
       class="headerLink"
-      href="/SobreLicitacao"
-    >
-      Sobre as Licitações
-    </a>
-  </li>,
-  <li
-    class="headerListItem"
-  >
-    <a
-      class="headerLink"
-      href="/sobredispensadelicitacao"
+      href="/artigos"
     >
-      Sobre Dispensas
-    </a>
-  </li>,
-  <li
-    class="headerListItem"
-  >
-    <a
-      class="headerLink"
-      href="/sobrebot"
-    >
-      Sobre o Bot
-    </a>
-  </li>,
-  <li
-    class="headerListItem"
-  >
-    <a
-      class="headerLink"
-      href="/sobrelisitaBSB"
-    >
-      Sobre o Projeto
+      Conheça o Projeto
     </a>
   </li>,
   <li

frontend/src/components/header/header.test.js

@@ -22,7 +22,7 @@ describe('Deve renderizar os links das rotas: ', () => {
       </MemoryRouter>,
     );
     const linkRoute = screen.getAllByText('Sobre as Licitações');
-    expect(linkRoute).toHaveLength(2);
+    expect(linkRoute).toHaveLength(1);
   });
   test('Sobre o Projeto', () => {
     render(
@@ -31,7 +31,7 @@ describe('Deve renderizar os links das rotas: ', () => {
       </MemoryRouter>,
     );
     const linkRoute = screen.getAllByText('Sobre o Projeto');
-    expect(linkRoute).toHaveLength(2);
+    expect(linkRoute).toHaveLength(1);
   });
   test('Sobre Nós', () => {
     render(
@@ -60,7 +60,7 @@ test('Deve renderizar a lista de links presentes no componente', () => {
     </MemoryRouter>,
   );
   const listaDeLinks = screen.getAllByRole('listitem');
-  expect(listaDeLinks).toHaveLength(14);
+  expect(listaDeLinks).toHaveLength(11);
 });
 
 test('Deve renderizar o snapshot da lista de links do componente', () => {

frontend/src/components/layout/custom-input-checkbox/index.jsx

@@ -1,10 +1,22 @@
 import React from 'react';
 import styles from './style.module.css';
 
-export default function CustomInputCheckbox({ name, label, onPress, id }) {
+export default function CustomInputCheckbox({
+  checked,
+  name,
+  label,
+  onPress,
+  id,
+}) {
   return (
-    <label className={styles.checkboxBtn} htmlFor={id} onClick={onPress}>
-      <input type="checkbox" name={name} id={id} />
+    <label className={styles.checkboxBtn} htmlFor={id}>
+      <input
+        defaultChecked={checked}
+        type="checkbox"
+        name={name}
+        id={id}
+        onClick={onPress}
+      />
       <span></span>
       <p>{label}</p>
     </label>

frontend/src/components/newsletter/index.jsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import axios from 'axios';
-import style from '../newsletter/style.module.css';
+import style from '../newsletter/style.module.css'
+import amicoImage from './amico.png';
 
 const SubscribeForm = () => {
   const [email, setEmail] = useState('');
@@ -30,15 +31,25 @@ const SubscribeForm = () => {
   return (
     <form onSubmit={handleSubmit}>
       <div className={style.newsletter}>
-        <h1>Se inscreva para receber atualizações sobre futuras licitações!</h1>
-        <label>Email:</label>
-        <input
-          type="email"
-          value={email}
-          onChange={(e) => setEmail(e.target.value)}
-          required
-        />
-        <button type="submit">Subscribe</button>
+      <div>
+      <div className={style['newsletter-text']}>
+            <h1>Receba as mais recentes licitações diretamente no seu e-mail</h1>
+            <h2>Se você deseja receber no seu melhor email as licitações mais recentes do Distrito Federal, cadastre seu email no LicitaBSB abaixo:</h2>
+        </div>
+        <div className={style['newsletter-form']}>
+            <input
+                placeholder="Digite seu email aqui."
+                type="email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                required
+            />
+            <button type="submit">Enviar</button>
+        </div>
+        </div>
+        <div className={style['newsletter-image']}>
+            <img src={amicoImage}/>
+        </div>
       </div>
       {message && <p>{message}</p>}
     </form>

frontend/src/components/newsletter/style.module.css

@@ -1,31 +1,87 @@
-.newsletter{
+.newsletter {
     display: flex;
+    flex-direction: row;
     align-items: center;
-    justify-content: center;
-    text-align: center;
-    flex-direction: column;
-    gap: 10px;
-    padding-top: 100px;
+    justify-content: space-between;
+    gap: 20px;
+    padding: 30px; 
+    background-color: #F1ECE8; 
+    border-radius: 10px;
+    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
+
 }
 
-.newsletter h1{
-    font-size: 20px;
+.newsletter h1 {
+    font-size: 24px;
     font-weight: bold;
+    margin: 0;
+    color: #333; 
 }
 
-.newsletter button{
-    background-color: transparent;
-    border: 1px solid black;
-    border-radius: 3px;
-    padding: 5px;
-    cursor: pointer;
+.newsletter h2 {
+    font-size: 16px;
+    margin-top: 10px;
+    line-height: 1.5;
+    color: #333; 
+    max-width: 60%; 
+}
+
+.newsletter-form {
+    display: flex;
+    flex-direction: column; 
+    align-items: flex-start; 
+    gap: 10px; 
+    width: 100%; 
 }
 
-.newsletter input{
-    border-top: none;
-    border-left: none;
-    border-right: none;
-    border-bottom: 2px solid black;
-    width: 300px;
+.newsletter input {
+    border: 1px solid #333; 
+    border-radius: 5px;
+    width: 582px; 
+    height: 48px;
     outline: none;
+    padding: 10px;
+    box-sizing: border-box;
+    font-size: 16px;
+}
+
+.newsletter button {
+    background-color: #333;
+    color: white;
+    border: none;
+    border-radius: 5px;
+    padding: 10px 20px;
+    height: 48px; 
+    cursor: pointer;
+    transition: background-color 0.3s ease;
+    font-size: 16px;
+    width: 203px; 
+}
+
+.newsletter button:hover {
+    background-color: #555; 
+}
+
+.newsletter-image {
+    flex: 1;
+    display: flex;
+    justify-content: flex-end; 
+    align-items: center; 
+    padding: 0; 
+}
+
+.newsletter img {
+    width: 351px; 
+    height: 309px; 
+    object-fit: cover;
+    border-radius: 10px;
+}
+
+
+@media(max-width: 1200px){
+
+}
+
+@media(max-width: 800px){
+
 }

frontend/src/pages/about-bot/__snapshots__/about-bot.test.js.snap

@@ -5,7 +5,7 @@ exports[`Na página Sobre o Bot, deve ser renderizado  o snapshot com o conteúd
   class="cardAboutContext"
   data-testid="main-container-text"
 >
-  <span
+  <div
     class="paragraph1Context"
   >
     <div>
@@ -60,7 +60,7 @@ exports[`Na página Sobre o Bot, deve ser renderizado  o snapshot com o conteúd
       class="imagem1"
       src="imagem-bot.png"
     />
-  </span>
+  </div>
   <span>
     <h2
       class="cardAboutSubtitle"

frontend/src/pages/about-licitaBSB/__snapshots__/about-lisitaBSB.test.js.snap

@@ -44,7 +44,7 @@ exports[`A página "Sobre o Projeto" deve o snapshot com o conteúdo do artigo 1
     </div>
     <img
       class="imagem1"
-      src="logo-lisita.jpg"
+      src="logo-licita.jpg"
     />
   </span>
   <span>