Add social links block to footer and style social links

polimediaupv · Jan 17, 2024 · c1864d9 · c1864d9
1 parent 0493c08
commit c1864d9
Show file tree

Hide file tree

Showing 2 changed files with 73 additions and 3 deletions.
diff --git a/src/main/resources/static/css/cas.css b/src/main/resources/static/css/cas.css
@@ -760,7 +760,7 @@ hr {
 footer {
     --primary-dark: #D73333;
     --primary: #E5554F;
-
+    display: block;
 }
 .footer-cols {
     padding: 64px 0;
@@ -783,6 +783,35 @@ footer .apps-links a:hover {
     color: #D73333;
 }
 
+:is(.social-links) :is(a,button) {
+    font-size: 0.75rem;
+    color: #D73333;
+    text-decoration: none
+}
+
+:is(.social-links) :is(a,button):hover {
+    color: #A40E0E;
+}
+.social-links {
+    margin-top: 128px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 1.5rem;
+    vertical-align: baseline;
+}
+
+.social-links a {
+    height: 23px;
+    display: flex;
+    align-items: center
+}
+
+.social-links svg {
+    max-height: 23px;
+    width: auto
+}
+
 @media(max-width: 1030px) {
     body {
         --h1-font-size: 2.625rem;
@@ -837,4 +866,7 @@ footer .apps-links a:hover {
     footer .apps-links a:hover {
         color: #D73333;
     }
+    .social-links {
+        margin: 65px 0 50px
+    }
 }
diff --git a/src/main/resources/templates/fragments/footer.html b/src/main/resources/templates/fragments/footer.html
@@ -1,4 +1,4 @@
-<footer class="bg-dark py-3 d-flex justify-content-center align-items-center">
+<footer class="bg-dark py-3  justify-content-center align-items-center">
     <div class="container footer-cols">
         <div class="text-center">
           <img src="images/logo-UPV-light.svg" alt="">
@@ -71,7 +71,45 @@
                   </div>
                 </div>
         </div> 
-      </div>
+    </div>
+    <div class="social-links text-center">
+        <a href="http://www.facebook.com/UPV" title="Mira el nostre Facebook" target="_blank">
+            <svg width="11" height="23" viewBox="0 0 11 23" fill="currentColor">
+            <path fill-rule="evenodd" clip-rule="evenodd" d="M2.21769 11.4108V21.9054C2.21934 21.978 2.24935 22.0471 2.30131 22.0979C2.35327 22.1486 2.42304 22.177 2.49569 22.177H6.38769C6.46034 22.177 6.53011 22.1486 6.58207 22.0979C6.63402 22.0471 6.66404 21.978 6.66569 21.9054V11.2402H9.48992C9.5578 11.2405 9.62333 11.2155 9.67361 11.1699C9.72389 11.1243 9.75528 11.0614 9.76159 10.9939L10.0333 7.77785C10.0358 7.74031 10.0308 7.70262 10.0183 7.6671C10.0059 7.63157 9.98643 7.59907 9.96102 7.57131C9.93562 7.54354 9.90486 7.52111 9.87057 7.50559C9.83629 7.49007 9.79922 7.48168 9.76159 7.48091H6.66569V5.20646C6.66485 5.07928 6.68927 4.95315 6.73755 4.83548C6.78584 4.71782 6.85702 4.6109 6.94695 4.52096C7.03688 4.43103 7.14377 4.35993 7.26143 4.31164C7.37909 4.26336 7.50519 4.23892 7.63237 4.23976H9.80583C9.87846 4.23811 9.94754 4.20804 9.99831 4.15608C10.0491 4.10412 10.0775 4.03437 10.0775 3.96172V0.733141C10.0775 0.661087 10.0489 0.59197 9.99793 0.54102C9.94698 0.49007 9.87788 0.461426 9.80583 0.461426H6.12864C5.09249 0.461424 4.09867 0.872665 3.3654 1.60474C2.63214 2.33682 2.21936 3.32994 2.21769 4.36609V7.46194H0.271677C0.199047 7.46359 0.129966 7.49374 0.0791893 7.5457C0.028413 7.59766 -1.87556e-05 7.66741 9.28265e-09 7.74006V10.9496C9.28273e-09 11.0216 0.0286248 11.0908 0.079575 11.1418C0.130525 11.1927 0.199623 11.2214 0.271677 11.2214H2.21769V11.4108Z"></path>
+        </svg>
+        </a>
+        <a href="http://twitter.com/UPV" title="Mira les nostres publicacions en twitter" target="_blank">
+            <svg width="22" height="19" viewBox="0 0 22 19" fill="currentColor">
+            <path d="M21.1153 2.67662C20.4327 2.97585 19.7153 3.18812 18.9798 3.30844C19.3273 3.25157 19.8327 2.62601 20.0349 2.37328C20.3477 1.99997 20.5877 1.57136 20.7425 1.10965C20.7425 1.07174 20.7741 1.02755 20.7425 0.995962C20.7251 0.986561 20.7055 0.981617 20.6857 0.981617C20.6658 0.981617 20.6463 0.986561 20.6288 0.995962C19.8295 1.42115 18.9806 1.74586 18.1016 1.96266C18.0708 1.97205 18.0381 1.97284 18.007 1.96505C17.9758 1.95726 17.9473 1.94113 17.9246 1.91839C17.8591 1.83502 17.785 1.75879 17.7035 1.69095C17.3387 1.37514 16.9246 1.1212 16.4778 0.93912C15.8775 0.69444 15.229 0.590626 14.5823 0.635783C13.9572 0.675753 13.3478 0.84807 12.7943 1.14127C12.2395 1.43145 11.7494 1.83125 11.3537 2.31644C10.9469 2.82072 10.6538 3.40692 10.4945 4.03497C10.3629 4.63303 10.3479 5.25093 10.4502 5.85468C10.4502 5.95577 10.4502 5.96835 10.3618 5.95572C6.88679 5.43763 4.0057 4.19295 1.66166 1.53299C1.56057 1.41926 1.5037 1.41926 1.42157 1.53299C0.398021 3.06831 0.897159 5.5324 2.17343 6.74549C2.34402 6.90344 2.52091 7.06771 2.71046 7.21303C2.12476 7.1703 1.55346 7.01137 1.02984 6.74549C0.928751 6.68231 0.878205 6.71383 0.871887 6.83388C0.853474 6.99975 0.853474 7.16717 0.871887 7.33304C0.971323 8.11635 1.27864 8.85875 1.76194 9.48316C2.24525 10.1076 2.88691 10.5913 3.62028 10.8839C3.79855 10.9617 3.98508 11.0189 4.17628 11.0545C3.63549 11.1641 3.08005 11.181 2.53355 11.105C2.41351 11.105 2.36928 11.1429 2.41351 11.2629C3.1401 13.2342 4.70069 13.7902 5.86955 14.1567C6.0275 14.1567 6.18546 14.1568 6.34341 14.2199C6.34341 14.2199 6.34341 14.2198 6.34341 14.2514C5.95169 14.839 4.60592 15.2813 3.98042 15.515C2.83101 15.9238 1.60675 16.0792 0.3917 15.9701C0.195836 15.9701 0.157932 15.9701 0.101069 15.9701C0.0442052 15.9701 0.101066 16.0522 0.15793 16.1027C0.404339 16.2607 0.65075 16.406 0.909795 16.545C1.67142 16.9497 2.47418 17.2716 3.30437 17.5054C7.61337 18.6932 12.472 17.8212 15.707 14.6053C18.2342 12.078 19.1377 8.59668 19.1377 5.128C19.1377 4.99532 19.302 4.91953 19.3968 4.84371C20.041 4.34483 20.6074 3.75284 21.0774 3.08724C21.1494 2.99096 21.1852 2.87246 21.1785 2.75243C21.1911 2.61975 21.1975 2.63871 21.1153 2.67662Z"></path>
+        </svg>
+        </a>
+        <a href="https://www.instagram.com/instaUPV" title="Segueix-nos en Instragram" target="_blank">
+            <svg width="23" height="23" viewBox="0 0 23 23" fill="currentColor">
+            <path d="M17.4663 4.15733C17.2912 4.15733 17.1179 4.19184 16.9561 4.25883C16.7944 4.32583 16.6474 4.42403 16.5236 4.54782C16.3998 4.67162 16.3016 4.81853 16.2346 4.98027C16.1676 5.14201 16.1331 5.31547 16.1331 5.49054C16.1348 5.84301 16.276 6.18036 16.5258 6.42901C16.7757 6.67766 17.1138 6.81727 17.4663 6.81726C17.8188 6.81727 18.1569 6.67766 18.4067 6.42901C18.6566 6.18036 18.7978 5.84301 18.7994 5.49054C18.7994 5.13697 18.659 4.79783 18.409 4.54782C18.1589 4.29781 17.8199 4.15733 17.4663 4.15733ZM11.5525 5.86321C10.07 5.86488 8.64873 6.4545 7.60046 7.50276C6.5522 8.55102 5.96255 9.97239 5.96088 11.4549C5.96255 12.9373 6.5522 14.3585 7.60046 15.4068C8.64873 16.4551 10.07 17.0447 11.5525 17.0464C13.0344 17.0447 14.455 16.4549 15.5022 15.4065C16.5495 14.3581 17.1377 12.9367 17.1377 11.4549C17.1377 9.97407 16.5504 8.55365 15.5045 7.50538C14.4586 6.45712 13.0396 5.86656 11.5588 5.86321H11.5525ZM11.5525 15.0372C10.6024 15.0372 9.69115 14.6598 9.01932 13.988C8.34748 13.3162 7.97006 12.405 7.97006 11.4549C7.97006 10.5047 8.34748 9.59356 9.01932 8.92173C9.69115 8.2499 10.6024 7.87235 11.5525 7.87235C12.5015 7.87402 13.4111 8.25224 14.0815 8.92389C14.752 9.59554 15.1286 10.5058 15.1286 11.4549C15.131 11.9258 15.0406 12.3926 14.8625 12.8286C14.6844 13.2646 14.422 13.6612 14.0905 13.9957C13.7589 14.3302 13.3646 14.5961 12.9302 14.7781C12.4958 14.96 12.0298 15.0545 11.5588 15.0562L11.5525 15.0372ZM22.8304 6.82359C22.8304 5.01494 22.1124 3.28031 20.834 2.00081C19.5557 0.72131 17.8217 0.00167467 16.0131 0H7.0097C6.11201 -3.46326e-06 5.22314 0.177115 4.39402 0.521219C3.5649 0.865323 2.81182 1.36964 2.17794 2.00528C1.54406 2.64092 1.04183 3.39537 0.700031 4.22544C0.358227 5.05551 0.183568 5.94487 0.186061 6.84256V15.8396C0.191082 17.6455 0.912412 19.3756 2.19173 20.6502C3.47105 21.9247 5.20382 22.6397 7.0097 22.638H16.0131C17.8212 22.638 19.5552 21.9197 20.8337 20.6412C22.1122 19.3627 22.8304 17.6287 22.8304 15.8207V6.82359ZM20.6949 15.8207C20.6949 17.0623 20.2016 18.2532 19.3236 19.1312C18.4456 20.0092 17.2548 20.5025 16.0131 20.5025H7.0097C5.76801 20.5025 4.57718 20.0092 3.69918 19.1312C2.82118 18.2532 2.32792 17.0623 2.32792 15.8207V6.84256C2.32792 5.60029 2.82098 4.40884 3.6988 3.52983C4.57662 2.65083 5.76743 2.15612 7.0097 2.15444H16.0131C17.2554 2.15612 18.4462 2.65083 19.324 3.52983C20.2018 4.40884 20.6949 5.60029 20.6949 6.84256V15.8207Z"></path>
+        </svg>
+        </a>
+        <a href="https://www.linkedin.com/school/upv" title="Coneix el nostre perfil de Linkedin" target="_blank">
+            <svg width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
+            <path d="M5.07139 19.8188V7.13804H1.1272V19.8188H5.07139ZM3.07809 5.44162C4.35041 5.44162 5.36827 4.38135 5.36827 3.10903C5.36827 1.87912 4.35041 0.818848 3.07809 0.818848C1.84818 0.818848 0.830322 1.87912 0.830322 3.10903C0.830322 4.38135 1.84818 5.44162 3.07809 5.44162ZM19.8303 19.8188V12.8635C19.8303 9.47063 19.0669 6.84117 15.0803 6.84117C13.1718 6.84117 11.8995 7.90144 11.3482 8.87688H11.3058V7.13804H7.53122V19.8188H11.4754V13.5421C11.4754 11.888 11.7723 10.3188 13.8504 10.3188C15.8437 10.3188 15.8861 12.1849 15.8861 13.6693V19.8188H19.8303Z"></path>
+        </svg>
+        </a>
+        <a href="http://www.youtube.com/valenciaupv" title="Tots els nostres vídeos en Youtube" target="_blank">
+            <svg width="24" height="17" viewBox="0 0 24 17" fill="currentColor">
+            <path d="M23.3258 2.86051C23.0735 1.86051 22.2746 1.06885 21.3075 0.818848C19.4994 0.318848 12.3513 0.318848 12.3513 0.318848C12.3513 0.318848 5.16122 0.318848 3.35317 0.818848C2.38608 1.06885 1.58718 1.86051 1.33489 2.86051C0.830322 4.61051 0.830322 8.36051 0.830322 8.36051C0.830322 8.36051 0.830322 12.0688 1.33489 13.8605C1.58718 14.8605 2.38608 15.6105 3.35317 15.8605C5.16122 16.3188 12.3513 16.3188 12.3513 16.3188C12.3513 16.3188 19.4994 16.3188 21.3075 15.8605C22.2746 15.6105 23.0735 14.8605 23.3258 13.8605C23.8303 12.0688 23.8303 8.36051 23.8303 8.36051C23.8303 8.36051 23.8303 4.61051 23.3258 2.86051ZM9.99668 11.7355V4.98551L15.9674 8.36051L9.99668 11.7355Z"></path>
+        </svg>
+        </a>
+        <a href="https://tiktok.com/@upv" title="La UPV, en el format més curt" target="_blank">
+            <svg width="49" height="51" viewBox="0 0 448 512" fill="currentColor">
+            <path d="M448,209.91a210.06,210.06,0,0,1-122.77-39.25V349.38A162.55,162.55,0,1,1,185,188.31V278.2a74.62,74.62,0,1,0,52.23,71.18V0l88,0a121.18,121.18,0,0,0,1.86,22.17h0A122.18,122.18,0,0,0,381,102.39a121.43,121.43,0,0,0,67,20.14Z"></path>
+        </svg>
+        </a>
+        <a href="https://tiktok.com/@upv" title="Escriu-nos per telegram" target="_blank">
+            <svg width="22" height="17" viewBox="0 0 22 17" fill="currentColor">
+            <path d="M2.11786 7.40856C2.11786 7.40856 11.4061 3.6756 14.6259 2.35797C15.8668 1.83367 20.0489 0.150795 20.0489 0.150795C20.0489 0.150795 21.9815 -0.587548 21.8211 1.20333C21.767 1.93971 21.338 4.51606 20.9089 7.30252C20.2634 11.2476 19.5657 15.55 19.5657 15.55C19.5657 15.55 19.4594 16.7596 18.5453 16.9697C17.6311 17.1798 16.1395 16.2353 15.8608 16.0232C15.6463 15.8661 11.8352 13.4999 10.4478 12.3433C10.0709 12.0271 9.64591 11.3968 10.502 10.6604C12.4346 8.92452 14.7421 6.77036 16.1375 5.40168C16.783 4.77133 17.4266 3.29857 14.7341 5.08749C10.925 7.66383 7.16396 10.0831 7.16396 10.0831C7.16396 10.0831 6.3059 10.6074 4.69604 10.1341C3.08618 9.6609 1.20567 9.03448 1.20567 9.03448C1.20567 9.03448 -0.0834197 8.24901 2.11786 7.40463V7.40856Z"></path>
+        </svg>
+        </a>
+    </div>
+
     <!-- <span id="copyright" th:utext="#{copyright}" class="me-2 d-inline-block">Copyright Date Apereo, Inc</span>
     <span class="px-3 d-inline-block">Powered by <a href="https://github.com/apereo/cas">Apereo CAS</a></span>
     <code class="version" th:text="${T(org.apereo.cas.util.CasVersion).getVersion() + ' ' + T(org.apereo.cas.util.CasVersion).getDateTime()}"></code> -->