blur no menu top e icon discord e wpp

Fabio Brasileiro · Fabio Brasileiro · commit 9db9ce26739a · 2024-03-27T18:42:25.000-04:00
diff --git a/angular.json b/angular.json
@@ -25,6 +25,7 @@
               "src/assets"
             ],
             "styles": [
+              "@angular/material/prebuilt-themes/indigo-pink.css",
               "src/styles.css"
             ],
             "scripts": []
@@ -84,6 +85,7 @@
               "src/assets"
             ],
             "styles": [
+              "@angular/material/prebuilt-themes/indigo-pink.css",
               "src/styles.css"
             ],
             "scripts": []
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,13 +11,17 @@
   "private": true,
   "dependencies": {
     "@angular/animations": "^17.3.0",
+    "@angular/cdk": "^17.3.1",
     "@angular/common": "^17.3.0",
     "@angular/compiler": "^17.3.0",
     "@angular/core": "^17.3.0",
     "@angular/forms": "^17.3.0",
+    "@angular/material": "^17.3.1",
     "@angular/platform-browser": "^17.3.0",
     "@angular/platform-browser-dynamic": "^17.3.0",
     "@angular/router": "^17.3.0",
+    "@fortawesome/angular-fontawesome": "^0.14.1",
+    "angular-font-awesome": "^3.1.2",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.14.3"
@@ -38,4 +42,4 @@
     "tailwindcss": "^3.4.1",
     "typescript": "~5.4.2"
   }
-}
+}
diff --git a/src/app/app.config.ts b/src/app/app.config.ts
@@ -2,7 +2,8 @@ import { ApplicationConfig } from '@angular/core';
 import { provideRouter } from '@angular/router';
 
 import { routes } from './app.routes';
+import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
 
 export const appConfig: ApplicationConfig = {
-  providers: [provideRouter(routes)]
+  providers: [provideRouter(routes), provideAnimationsAsync()]
 };
diff --git a/src/app/not-found/not-found.component.html b/src/app/not-found/not-found.component.html
@@ -1,9 +1,9 @@
 <app-header-landing-page></app-header-landing-page>
-<div class="bg-gray-50 dark:bg-gray-900" style="">
+<div class="bg-gray-50 dark:bg-gray-900" >
 
   <div class="m-auto pt-52 pb-60" style="width: 100% !important;">
 
-    <a target="_blank" href="https://codepen.io/uiswarup/pen/XWGGyWQ">
+    <a target="_blank" href="#">
       <div class="">
         <div class="">
           <div class="">
diff --git a/src/app/page/header-landing-page/header-landing-page.component.css b/src/app/page/header-landing-page/header-landing-page.component.css
@@ -0,0 +1,5 @@
+@media screen and (min-width: 1024px) {
+  .disabled-logo {
+    display: none;
+  }
+}
diff --git a/src/app/page/header-landing-page/header-landing-page.component.html b/src/app/page/header-landing-page/header-landing-page.component.html
@@ -1,14 +1,13 @@
-<header class="fixed w-full">
-  <nav class="bg-white border-gray-200 py-2.5 dark:bg-gray-900">
+<header class="fixed w-full backdrop-blur">
+  <nav class="bg-white opacity-85 border-gray-200 py-2.5 dark:bg-gray-900">
     <div class="flex flex-wrap items-center justify-between max-w-screen-xl px-4 mx-auto">
       <a href="#" class="flex items-center">
-        <img src="../assets/logo-java-jugle.png" class="h-6 mr-3 sm:h-9" alt="Java juble Logo" />
-        <!-- <span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">Java Jungle</span> -->
+        <img src="../assets/logo-java-jugle.png" class="h-6 mr-3 sm:h-9 disabled-logo" alt="Java juble Logo" />
       </a>
       <div class="flex items-center lg:order-2">
         <div class="hidden mt-2 mr-4 sm:inline-block">
-          <a class="github-button" href="https://github.com/JavaAmazonas/java-jungle"
-            data-size="large" data-icon="octicon-star" data-show-count="true"
+          <a class="github-button" href="https://github.com/JavaAmazonas/java-jungle" data-size="large"
+            data-icon="octicon-star" data-show-count="true"
             aria-label="Star JavaAmazonas/java-jungle on GitHub">Star</a>
         </div>
         <!-- <a href="#" class="text-gray-800 dark:text-white hover:bg-gray-50 focus:ring-4 focus:ring-gray-300 font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 sm:mr-2 dark:hover:bg-gray-700 focus:outline-none dark:focus:ring-gray-800">Log in</a> -->
diff --git a/src/app/page/header-landing-page/header-landing-page.component.ts b/src/app/page/header-landing-page/header-landing-page.component.ts
@@ -5,7 +5,7 @@ import { Component } from '@angular/core';
   standalone: true,
   imports: [],
   templateUrl: './header-landing-page.component.html',
-  styleUrl: './header-landing-page.component.css'
+  styleUrl: './header-landing-page.component.css',
 })
 export class HeaderLandingPageComponent {
 
diff --git a/src/app/page/landing-page-inicio/landing-page-inicio.component.html b/src/app/page/landing-page-inicio/landing-page-inicio.component.html
@@ -19,6 +19,7 @@
             <path
               d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z" />
           </svg> View on GitHub
+
         </a>
         <a href="https://www.figma.com/file/xRz0DlpnCmCig387Musupw/Comunidade-Java-Amazonas?type=design&node-id=94-7&mode=design&t=IQZIc6jDL7w3j9zp-0"
           class="inline-flex items-center justify-center w-full px-5 py-3 mb-2 mr-2 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-lg sm:w-auto focus:outline-none hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700">
@@ -445,7 +446,7 @@ <h2 class="text-4xl tracking-tight font-bold text-primary-800">Mas por que parti
     <div class="flex flex-col md:flex-row">
       <!-- can help image -->
       <div class="mr-0 md:mr-8 mb-6 md:mb-0">
-        <img class="w-1/2 md:w-52 mx-auto" src="../../../assets/doke-noticia.png" alt="can_help_banner">
+        <img class="w-1/2 md:w-32 mx-auto" src="../../../assets/doke-noticia.png" alt="can_help_banner">
       </div>
       <!-- end can help image -->
 
@@ -489,8 +490,7 @@ <h3 class="text-2xl font-bold text-md mb-6">Compartilhamento</h3>
   <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-24 lg:px-6">
     <div class="max-w-screen-md mx-auto mb-8 text-center lg:mb-12">
       <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Eventos</h2>
-      <p class="mb-5 font-light text-gray-500 sm:text-xl dark:text-gray-400">Here at Landwind we focus on markets where
-        technology, innovation, and capital can unlock long-term value and drive economic growth.</p>
+      <p class="mb-5 font-light text-gray-500 sm:text-xl dark:text-gray-400">Mergulhe em eventos, workshops e aulas cuidadosamente elaborados para expandir seus horizontes e alimentar sua paixão pelo conhecimento.</p>
     </div>
 
     <div class="space-y-8 lg:grid lg:grid-cols- sm:gap-6 xl:gap-10 lg:space-y-0">
@@ -692,13 +692,54 @@ <h3 id="accordion-flush-heading-4">
 <section class="bg-gray-50 dark:bg-gray-800">
   <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-16 lg:px-6">
     <div class="max-w-screen-sm mx-auto text-center">
-      <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Start your
-        free trial today</h2>
-      <p class="mb-6 font-light text-gray-500 dark:text-gray-400 md:text-lg">Try Landwind Platform for 30 days. No
-        credit card required.</p>
-      <a href="#"
+      <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Contato</h2>
+      <p class="mb-6 font-light text-gray-500 dark:text-gray-400 md:text-lg"><strong>Quer ficar por dentro de todas as
+          novidades?</strong> Entre na nossa comunidade do Discord da Java Amazonas para conversar sobre projetos,
+        eventos e afins.</p>
+      <!-- <a href="#"
         class="text-white bg-purple-700 hover:bg-purple-800 focus:ring-4 focus:ring-purple-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-purple-600 dark:hover:bg-purple-700 focus:outline-none dark:focus:ring-purple-800">Free
-        trial for 30 days</a>
+        trial for 30 days</a> -->
+      <div class="items-center justify-center space-y-4 sm:flex sm:space-y-0 sm:space-x-4 rtl:space-x-reverse">
+        <a href="#"
+          class="w-full sm:w-auto bg-gray-800 hover:bg-gray-700 focus:ring-4 focus:outline-none focus:ring-gray-300 text-white rounded-lg inline-flex items-center justify-center px-4 py-2.5 dark:bg-gray-700 dark:hover:bg-gray-600 dark:focus:ring-gray-700">
+          <!-- <svg class="me-3 w-7 h-7" aria-hidden="true" focusable="false" data-prefix="fab" data-icon="apple" role="img"
+            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512">
+            <path fill="currentColor"
+              d="M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z">
+            </path>
+          </svg> -->
+          <!-- <img class="me-3 w-7 h-7" src="../../../assets/discord-icon-svgrepo-com.svg" alt=""> -->
+          <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor"
+            class="me-3 w-7 h-7 bi bi-discord" viewBox="0 0 16 16">
+            <path
+              d="M13.545 2.907a13.2 13.2 0 0 0-3.257-1.011.05.05 0 0 0-.052.025c-.141.25-.297.577-.406.833a12.2 12.2 0 0 0-3.658 0 8 8 0 0 0-.412-.833.05.05 0 0 0-.052-.025c-1.125.194-2.22.534-3.257 1.011a.04.04 0 0 0-.021.018C.356 6.024-.213 9.047.066 12.032q.003.022.021.037a13.3 13.3 0 0 0 3.995 2.02.05.05 0 0 0 .056-.019q.463-.63.818-1.329a.05.05 0 0 0-.01-.059l-.018-.011a9 9 0 0 1-1.248-.595.05.05 0 0 1-.02-.066l.015-.019q.127-.095.248-.195a.05.05 0 0 1 .051-.007c2.619 1.196 5.454 1.196 8.041 0a.05.05 0 0 1 .053.007q.121.1.248.195a.05.05 0 0 1-.004.085 8 8 0 0 1-1.249.594.05.05 0 0 0-.03.03.05.05 0 0 0 .003.041c.24.465.515.909.817 1.329a.05.05 0 0 0 .056.019 13.2 13.2 0 0 0 4.001-2.02.05.05 0 0 0 .021-.037c.334-3.451-.559-6.449-2.366-9.106a.03.03 0 0 0-.02-.019m-8.198 7.307c-.789 0-1.438-.724-1.438-1.612s.637-1.613 1.438-1.613c.807 0 1.45.73 1.438 1.613 0 .888-.637 1.612-1.438 1.612m5.316 0c-.788 0-1.438-.724-1.438-1.612s.637-1.613 1.438-1.613c.807 0 1.451.73 1.438 1.613 0 .888-.631 1.612-1.438 1.612" />
+          </svg>
+          <div class="text-left rtl:text-right">
+            <div class="mb-1 text-xs">Discord da comunidade</div>
+            <div class="-mt-1 font-sans text-sm font-semibold">Java Amazonas</div>
+          </div>
+        </a>
+        <a href="#"
+          class="w-full sm:w-auto bg-gray-800 hover:bg-gray-700 focus:ring-4 focus:outline-none focus:ring-gray-300 text-white rounded-lg inline-flex items-center justify-center px-4 py-2.5 dark:bg-gray-700 dark:hover:bg-gray-600 dark:focus:ring-gray-700">
+          <!-- <svg class="me-3 w-7 h-7" aria-hidden="true" focusable="false" data-prefix="fab" data-icon="google-play"
+            role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+            <path fill="currentColor"
+              d="M325.3 234.3L104.6 13l280.8 161.2-60.1 60.1zM47 0C34 6.8 25.3 19.2 25.3 35.3v441.3c0 16.1 8.7 28.5 21.7 35.3l256.6-256L47 0zm425.2 225.6l-58.9-34.1-65.7 64.5 65.7 64.5 60.1-34.1c18-14.3 18-46.5-1.2-60.8zM104.6 499l280.8-161.2-60.1-60.1L104.6 499z">
+            </path>
+          </svg> -->
+          <!-- <img  class="me-3 w-7 h-7" src="../../../assets/whatsapp-svgrepo-com.svg" alt=""> -->
+          <!-- <fa name="cog" animation="spin"></fa> -->
+          <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor"
+            class="bi bi-whatsapp me-3 w-7 h-7" viewBox="0 0 16 16">
+            <path
+              d="M13.601 2.326A7.85 7.85 0 0 0 7.994 0C3.627 0 .068 3.558.064 7.926c0 1.399.366 2.76 1.057 3.965L0 16l4.204-1.102a7.9 7.9 0 0 0 3.79.965h.004c4.368 0 7.926-3.558 7.93-7.93A7.9 7.9 0 0 0 13.6 2.326zM7.994 14.521a6.6 6.6 0 0 1-3.356-.92l-.24-.144-2.494.654.666-2.433-.156-.251a6.56 6.56 0 0 1-1.007-3.505c0-3.626 2.957-6.584 6.591-6.584a6.56 6.56 0 0 1 4.66 1.931 6.56 6.56 0 0 1 1.928 4.66c-.004 3.639-2.961 6.592-6.592 6.592m3.615-4.934c-.197-.099-1.17-.578-1.353-.646-.182-.065-.315-.099-.445.099-.133.197-.513.646-.627.775-.114.133-.232.148-.43.05-.197-.1-.836-.308-1.592-.985-.59-.525-.985-1.175-1.103-1.372-.114-.198-.011-.304.088-.403.087-.088.197-.232.296-.346.1-.114.133-.198.198-.33.065-.134.034-.248-.015-.347-.05-.099-.445-1.076-.612-1.47-.16-.389-.323-.335-.445-.34-.114-.007-.247-.007-.38-.007a.73.73 0 0 0-.529.247c-.182.198-.691.677-.691 1.654s.71 1.916.81 2.049c.098.133 1.394 2.132 3.383 2.992.47.205.84.326 1.129.418.475.152.904.129 1.246.08.38-.058 1.171-.48 1.338-.943.164-.464.164-.86.114-.943-.049-.084-.182-.133-.38-.232" />
+          </svg>
+          <div class="text-left rtl:text-right">
+            <div class="mb-1 text-xs">WhatsApp da comunidade</div>
+            <div class="-mt-1 font-sans text-sm font-semibold">Java Amazonas</div>
+          </div>
+        </a>
+      </div>
     </div>
   </div>
 </section>
diff --git a/src/app/page/landing-page-inicio/landing-page-inicio.component.ts b/src/app/page/landing-page-inicio/landing-page-inicio.component.ts
@@ -2,14 +2,21 @@ import { Component } from '@angular/core';
 import { HeaderLandingPageComponent } from '../header-landing-page/header-landing-page.component';
 import { FooterComponent } from '../footer/footer.component';
 import { SliderEventComponent } from '../slider-event/slider-event.component';
+import { AngularFontAwesomeModule } from 'angular-font-awesome';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
+
+// import { faCoffee } from '@fortawesome/free-solid-svg-icons';
 
 @Component({
   selector: 'app-landing-page-inicio',
   standalone: true,
-  imports: [HeaderLandingPageComponent, FooterComponent,SliderEventComponent],
+  imports: [
+    HeaderLandingPageComponent,
+    FooterComponent,
+    SliderEventComponent,
+    FontAwesomeModule,
+  ],
   templateUrl: './landing-page-inicio.component.html',
-  styleUrl: './landing-page-inicio.component.css'
+  styleUrl: './landing-page-inicio.component.css',
 })
-export class LandingPageInicioComponent {
-
-}
+export class LandingPageInicioComponent {}
diff --git a/src/app/page/slider-event/slider-event.component.html b/src/app/page/slider-event/slider-event.component.html
@@ -87,18 +87,18 @@
 <div class="">
 
   <div class="mb-5 flex justify-end">
-    <div class="inline-flex">
-      <button class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded-l"
+    <div class="inline-flex ">
+      <button class="bg-gray-400 hover:bg-gray-500 border-r border-gray-300 text-gray-800  font-bold py-2 px-4 rounded-l"
         (click)="onNavigate('prev')" [disabled]="currentIndex === 0">
-        Prev
+        ❮
       </button>
-      <button class="bg-gray-300 hover:bg-gray-400 text-gray-800 font-bold py-2 px-4 rounded-r"
+      <button class="bg-gray-400 hover:bg-gray-500  text-gray-800 font-bold py-2 px-4 rounded-r"
         (click)="onNavigate('next')" [disabled]="currentIndex >= cards.length - 2">
-        Next
+        ❯
       </button>
     </div>
     <!-- <button class="btn btn-circle" (click)="onNavigate('prev')" [disabled]="currentIndex === 0">❮ </button> -->
-    <!-- <button class="btn btn-circle" (click)="onNavigate('next')" [disabled]="currentIndex >= cards.length - 2">❯</button> -->
+    <!-- <button class="btn btn-circle" (click)="onNavigate('next')" [disabled]="currentIndex >= cards.length - 2">❯❯</button> -->
   </div>
   <div class="flex gap-4 max-sm:flex-col">
 
diff --git a/src/assets/discord-icon-svgrepo-com.svg b/src/assets/discord-icon-svgrepo-com.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 -28.5 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <g>
+        <path d="M216.856339,16.5966031 C200.285002,8.84328665 182.566144,3.2084988 164.041564,0 C161.766523,4.11318106 159.108624,9.64549908 157.276099,14.0464379 C137.583995,11.0849896 118.072967,11.0849896 98.7430163,14.0464379 C96.9108417,9.64549908 94.1925838,4.11318106 91.8971895,0 C73.3526068,3.2084988 55.6133949,8.86399117 39.0420583,16.6376612 C5.61752293,67.146514 -3.4433191,116.400813 1.08711069,164.955721 C23.2560196,181.510915 44.7403634,191.567697 65.8621325,198.148576 C71.0772151,190.971126 75.7283628,183.341335 79.7352139,175.300261 C72.104019,172.400575 64.7949724,168.822202 57.8887866,164.667963 C59.7209612,163.310589 61.5131304,161.891452 63.2445898,160.431257 C105.36741,180.133187 151.134928,180.133187 192.754523,160.431257 C194.506336,161.891452 196.298154,163.310589 198.110326,164.667963 C191.183787,168.842556 183.854737,172.420929 176.223542,175.320965 C180.230393,183.341335 184.861538,190.991831 190.096624,198.16893 C211.238746,191.588051 232.743023,181.531619 254.911949,164.955721 C260.227747,108.668201 245.831087,59.8662432 216.856339,16.5966031 Z M85.4738752,135.09489 C72.8290281,135.09489 62.4592217,123.290155 62.4592217,108.914901 C62.4592217,94.5396472 72.607595,82.7145587 85.4738752,82.7145587 C98.3405064,82.7145587 108.709962,94.5189427 108.488529,108.914901 C108.508531,123.290155 98.3405064,135.09489 85.4738752,135.09489 Z M170.525237,135.09489 C157.88039,135.09489 147.510584,123.290155 147.510584,108.914901 C147.510584,94.5396472 157.658606,82.7145587 170.525237,82.7145587 C183.391518,82.7145587 193.761324,94.5189427 193.539891,108.914901 C193.539891,123.290155 183.391518,135.09489 170.525237,135.09489 Z" fill="#5865F2" fill-rule="nonzero">
+</path>
+    </g>
+</svg>
diff --git a/src/assets/whatsapp-svgrepo-com.svg b/src/assets/whatsapp-svgrepo-com.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.014 8.00613C6.12827 7.1024 7.30277 5.87414 8.23488 6.01043L8.23339 6.00894C9.14051 6.18132 9.85859 7.74261 10.2635 8.44465C10.5504 8.95402 10.3641 9.4701 10.0965 9.68787C9.7355 9.97883 9.17099 10.3803 9.28943 10.7834C9.5 11.5 12 14 13.2296 14.7107C13.695 14.9797 14.0325 14.2702 14.3207 13.9067C14.5301 13.6271 15.0466 13.46 15.5548 13.736C16.3138 14.178 17.0288 14.6917 17.69 15.27C18.0202 15.546 18.0977 15.9539 17.8689 16.385C17.4659 17.1443 16.3003 18.1456 15.4542 17.9421C13.9764 17.5868 8 15.27 6.08033 8.55801C5.97237 8.24048 5.99955 8.12044 6.014 8.00613Z" fill="#0F0F0F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 23C10.7764 23 10.0994 22.8687 9 22.5L6.89443 23.5528C5.56462 24.2177 4 23.2507 4 21.7639V19.5C1.84655 17.492 1 15.1767 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23ZM6 18.6303L5.36395 18.0372C3.69087 16.4772 3 14.7331 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C11.0143 21 10.552 20.911 9.63595 20.6038L8.84847 20.3397L6 21.7639V18.6303Z" fill="#0F0F0F"/>
+</svg>
diff --git a/src/index.html b/src/index.html
diff --git a/src/styles.css b/src/styles.css
