Complete Footer Overhaul and UI Updates

daiquiri/templates/core/banner.html

@@ -15,31 +15,6 @@ <h1 style="color: #fff; font-size: 50px; font-family: 'Arial Rounded MT Bold', A
               <p style="display: block; font-size: 16px; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; unicode-bidi: isolate;">An interface to query LIneA's database and create user-generated tables.</p>
             </div>
           </div>
-           <div class="medias" style="position: absolute; bottom: 5px; right: 20px; display: flex; gap: 12px;">
-            <a href="https://www.youtube.com/@linea_org" target="_blank">
-              <svg xmlns="http://www.w3.org/2000/svg" height="22" width="20" viewBox="0 0 576 512">
-                <path fill="#ffffff" d="M549.7 124.1c-6.3-23.7-24.8-42.3-48.3-48.6C458.8 64 288 64 288 64S117.2 64 74.6 75.5c-23.5 6.3-42 24.9-48.3 48.6-11.4 42.9-11.4 132.3-11.4 132.3s0 89.4 11.4 132.3c6.3 23.7 24.8 41.5 48.3 47.8C117.2 448 288 448 288 448s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zm-317.5 213.5V175.2l142.7 81.2-142.7 81.2z" />
-              </svg>
-            </a>
-
-            <a href="https://x.com/LIneA_org" target="_blank">
-              <svg xmlns="http://www.w3.org/2000/svg" height="20" width="18" viewBox="0 0 448 512">
-                <path fill="#ffffff" d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zm297.1 84L257.3 234.6 379.4 396H283.8L209 298.1 123.3 396H75.8l111-126.9L69.7 116h98l67.7 89.5L313.6 116h47.5zM323.3 367.6L153.4 142.9H125.1L296.9 367.6h26.3z" />
-              </svg>
-            </a>
-
-            <a href="https://www.instagram.com/linea_org" target="_blank">
-              <svg xmlns="http://www.w3.org/2000/svg" height="20" width="18" viewBox="0 0 448 512">
-                <path fill="#ffffff" d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z" />
-              </svg>
-            </a>
-
-            <a href="https://github.com/linea-it/lsp_daiquiri" target="_blank">
-              <svg xmlns="http://www.w3.org/2000/svg" height="20" width="18" viewBox="0 0 496 512">
-                <path fill="#ffffff" 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>
-            </a>
-          </div>
         </div>
       </div>
     </div>

daiquiri/templates/core/base_footer.html

@@ -1,37 +1,93 @@
 {% load static %}
 
-<footer>
-    {% comment %} <div class="content">
-        <div class="container">
-            <div class="row">
-                <div class="col-md-4">
-                    <p>
+<footer style="background-color: #fff; color: #000; font-family: Arial, sans-serif;">
+  <!-- divider horizontal -->
+  <div style="width: 100%; max-width: 1000px; height: 0.5px; background-color: #ccc; margin: 0 auto 30px auto;"></div>
 
-                    </p>
-                </div>
-                <div class="col-md-4">
-                    <p>
+  <div style="display: flex; justify-content: center; align-items: center; flex-wrap: wrap;">
+    <!-- logo-linea, titulo e endereço -->
+    <div style="display: flex;">
+      <a href="https://www.linea.org.br" target="_blank"><img alt="LIneA Logo" loading="lazy" width="140" height="115" decoding="async" src="{% static 'daiquiri/imgs/linea-logo.png' %}" style="left: 70px; position: relative;" /></a>
+      <div>
+        <div style="font-size: 22px; left: 120px; position: relative; line-height: 1.2; top: 20px;">
+          Associação Laboratório<br />Interinstitucional de<br />e-Astronomia LIneA
+        </div>
+        <div style="margin-top: 50px; font-size: 12px; line-height: 1.2;">
+          Av. Pastor Martin Luther King Jr, 126 - Del Castilho<br />
+          Nova América Offices, Torre 3000 / sala 817.<br />
+          CEP: 20765-000 – Rio de Janeiro - RJ, Brasil
+        </div>
+        <div style="margin-top: 10px; background: linear-gradient(120deg, #0989cb, #31297f); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 14px; word-spacing: 15px; right: 60px; position: relative;">#PeloFuturoDaCiência &nbsp; #PeloFuturoDaAstronomia</div>
+      </div>
+    </div>
 
-                    </p>
-                </div>
-                <div class="col-md-4">
-                    <p>
+    <!-- divider vertical -->
+    <div style="width: 0.5px; height: 90px; background-color: #ccc; margin: 0 30px; position: relative; top: -60px;"></div>
 
-                    </p>
-                </div>
-            </div>
+    <!-- logos dos apoiadores -->
+    <div style="text-align: left;">
+      <div style="margin-bottom: 6px; color: #a3a3a3; font-size: 12px;">Support:</div>
+      <div style="display: flex; justify-content: start; flex-wrap: wrap;">
+        <div style="margin: 8px;">
+          <a href="https://www.linea.org.br/inct#inct" target="_blank" rel="noreferrer"><img alt="INCT" loading="lazy" src="{% static 'daiquiri/imgs/inct-logo.png' %}" style="width: 60px; height: 60px; filter: grayscale(100%); transition: filter 0.3s ease;" onmouseover="this.style.filter='grayscale(0%)';" onmouseout="this.style.filter='grayscale(100%)';" /></a>
+        </div>
+        <div style="margin: 8px;">
+          <a href="https://www.gov.br/capes/pt-br" target="_blank" rel="noreferrer"><img alt="CAPES" loading="lazy" src="{% static 'daiquiri/imgs/capes-logo.png' %}" style="width: 100px; height: 60px; filter: grayscale(100%); transition: filter 0.3s ease;" onmouseover="this.style.filter='grayscale(0%)';" onmouseout="this.style.filter='grayscale(100%)';" /></a>
+        </div>
+        <div style="margin: 8px;">
+          <a href="https://www.gov.br/cnpq/pt-br" target="_blank" rel="noreferrer"><img alt="CNPq" loading="lazy" src="{% static 'daiquiri/imgs/cnpq-logo.png' %}" style="width: 100px; height: 60px; filter: grayscale(100%); transition: filter 0.3s ease;" onmouseover="this.style.filter='grayscale(0%)';" onmouseout="this.style.filter='grayscale(100%)';" /></a>
         </div>
-    </div> {% endcomment %}
+        <div style="margin: 8px;">
+          <a href="https://www.faperj.br" target="_blank" rel="noreferrer"><img alt="FAPERJ" loading="lazy" src="{% static 'daiquiri/imgs/faperj-logo.png' %}" style="width: 100px; height: 60px; filter: grayscale(100%); transition: filter 0.3s ease;" onmouseover="this.style.filter='grayscale(0%)';" onmouseout="this.style.filter='grayscale(100%)';" /></a>
+        </div>
+        <div style="margin: 8px;">
+          <a href="http://www.finep.gov.br" target="_blank" rel="noreferrer"><img alt="FINEP" loading="lazy" src="{% static 'daiquiri/imgs/finep-logo.png' %}" style="width: 100px; height: 60px; filter: grayscale(100%); transition: filter 0.3s ease;" onmouseover="this.style.filter='grayscale(0%)';" onmouseout="this.style.filter='grayscale(100%)';" /></a>
+        </div>
+      </div>
 
-    <div class="bottom">
-        <div class="container">
-            <div class="row">
-                <div class="col-xs-6">
-                </div>
-                <div class="col-xs-6 text-right">
-                    Proudly powered by <a href="https://github.com/django-daiquiri/daiquiri" target="_blank">Daiquiri</a>
-                </div>
-            </div>
+      <!-- Contatos -->
+      <div style="display: flex; justify-content: center; align-items: center; margin-top: 32px;">
+        <div style="margin-right: 12px;">
+          e-mail: <a href="mailto:[email protected]" style="color: #000; text-decoration: none;">[email protected]</a>
+        </div>
+        <div>
+          tel: <a href="tel:+5521969379224" style="color: #000; font-weight: bold; text-decoration: none;">+55 21 96937 9224</a>
         </div>
+      </div>
+
+      <!-- midias sociais -->
+      <div style="margin-top: 12px; display: flex; justify-content: center; gap: 12px;">
+        <a href="https://www.linkedin.com/company/linea-astronomia" target="_blank" style="width: 48px; height: 48px; display: flex; justify-content: center; align-items: center; color: #283664; transition: color 0.3s ease;" onmouseover="this.style.color='#0077B5';" onmouseout="this.style.color='#283664';">
+          <svg xmlns="http://www.w3.org/2000/svg" height="20" width="17.5" viewBox="0 0 448 512">
+            <path fill="currentColor" d="M100.3 448H7.4V148.9h92.9zM53.8 108.1C24.1 108.1 0 83.5 0 53.8a53.8 53.8 0 0 1 107.6 0c0 29.7-24.1 54.3-53.8 54.3zM447.9 448h-92.7V302.4c0-34.7-.7-79.2-48.3-79.2-48.3 0-55.7 37.7-55.7 76.7V448h-92.8V148.9h89.1v40.8h1.3c12.4-23.5 42.7-48.3 87.9-48.3 94 0 111.3 61.9 111.3 142.3V448z" />
+          </svg>
+        </a>
+        <a href="https://x.com/linea_org" target="_blank" style="width: 48px; height: 48px; display: flex; justify-content: center; align-items: center; color: #283664; transition: color 0.3s ease;" onmouseover="this.style.color='#000';" onmouseout="this.style.color='#283664';">
+          <svg xmlns="http://www.w3.org/2000/svg" height="20" width="20" viewBox="0 0 512 512">
+            <path fill="currentColor" d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z" />
+          </svg>
+        </a>
+        <a href="https://www.instagram.com/linea_org" target="_blank" style="width: 48px; height: 48px; display: flex; justify-content: center; align-items: center; color: #283664; transition: color 0.3s ease;" onmouseover="this.style.color='#E1306C';" onmouseout="this.style.color='#283664';">
+          <svg xmlns="http://www.w3.org/2000/svg" height="20" width="17.5" viewBox="0 0 448 512">
+            <path fill="currentColor" d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zm-48.6 224.7c-7.8 19.6-22.9 34.7-42.5 42.5-29.4 11.7-99.4 9-132.4 9s-103.1 2.6-132.4-9c-19.6-7.8-34.7-22.9-42.5-42.5-11.7-29.4-9-99.4-9-132.4s-2.6-103.1 9-132.4c7.8-19.6 22.9-34.7 42.5-42.5 29.4-11.7 99.4-9 132.4-9s103.1-2.6 132.4 9c19.6 7.8 34.7 22.9 42.5 42.5 11.7 29.4 9 99.4 9 132.4s2.7 103.1-9 132.4z" />
+          </svg>
+        </a>
+        <a href="https://www.youtube.com/@linea_org" target="_blank" style="width: 48px; height: 48px; display: flex; justify-content: center; align-items: center; color: #283664; transition: color 0.3s ease;" onmouseover="this.style.color='#FF0000';" onmouseout="this.style.color='#283664';">
+          <svg xmlns="http://www.w3.org/2000/svg" height="20" width="22.5" viewBox="0 0 576 512">
+            <path fill="currentColor" d="M549.7 124.1c-6.3-23.7-24.8-42.3-48.3-48.6C458.8 64 288 64 288 64S117.2 64 74.6 75.5c-23.5 6.3-42 24.9-48.3 48.6-11.4 42.9-11.4 132.3-11.4 132.3s0 89.4 11.4 132.3c6.3 23.7 24.8 41.5 48.3 47.8C117.2 448 288 448 288 448s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zm-317.5 213.5V175.2l142.7 81.2-142.7 81.2z" />
+          </svg>
+        </a>
+        <a href="https://www.facebook.com/linea.org" target="_blank" style="width: 48px; height: 48px; display: flex; justify-content: center; align-items: center; color: #283664; transition: color 0.3s ease;" onmouseover="this.style.color='#1877F2';" onmouseout="this.style.color='#283664';">
+          <svg xmlns="http://www.w3.org/2000/svg" height="20" width="12.5" viewBox="0 0 320 512">
+            <path fill="currentColor" d="M80 299.3V512H196V299.3h86.5l18-97.8H196V166.9c0-51.7 20.3-71.5 72.7-71.5c16.3 0 29.4 .4 37 1.2V7.9C291.4 4 256.4 0 236.2 0C129.3 0 80 50.5 80 159.4v42.1H14v97.8H80z" />
+          </svg>
+        </a>
+      </div>
     </div>
+  </div>
+
+  <!-- Rodapé -->
+  <div style="margin-top: 10px; margin-bottom: 12px; text-align: center; color: #a3a3a3; font-size: 12px;">
+    LIneA - 2024 - All rights reserved | <a href="https://www.linea.org.br/politica-de-privacidade" target="_blank" style="color: #000; text-decoration: none;" onmouseover="this.style.textDecoration='underline';" onmouseout="this.style.textDecoration='none';">Privacy Policy</a>
+  </div>
 </footer>