Added terms of use and privacy policy to footer

Author: NiharikaHari

_includes/footer.html

@@ -3,10 +3,21 @@
     <hr class="custom-hr" />
 </div>
 <footer>
-    <p class=" trademark">
-        "Fields of View" and "FoV" are trademarks of Fields of View Society © <span>2022</span>. Fields of View. <br>All Rights
-        Reserved.
-    </p>
+    <div>
+        <p class=" trademark">
+            "Fields of View" and "FoV" are trademarks of Fields of View Society © <span>2022</span>. Fields of View.
+            <br>All Rights
+            Reserved.<br>
+
+        </p>
+        <div class="links">
+            <a href="{{site.baseurl}}/docs/legal/FieldsofView_Website_TermsofUse_May2022.pdf" target="_blank">Terms of
+                Use</a> |
+            <a href="{{site.baseurl}}/docs/legal/FieldsofView_Website_PrivacyPolicy_May2022.pdf" target="_blank">Privacy
+                Policy</a>
+        </div>
+    </div>
+
     <p class="address">
         #1915, 5th Cross, 18th 'A' Main, JP Nagar 2nd Phase,<br /> Bangalore - 560 078
     </p>
@@ -61,17 +72,26 @@
         padding: var(--p3-rem) var(--p4-rem) var(--p2-rem) var(--p4-rem);
         margin-bottom: var(--p2-rem);
         justify-content: space-between;
-        align-items: center;
+        align-items: start;
     }
 
-    footer p {
+    footer>*:not(.icons) {
         color: var(--subtitle-color);
         font-size: var(--fs16);
         width: 30rem;
-        height: 2.2rem;
+        /* height: 2.2rem; */
         margin-right: var(--p3-rem);
     }
 
+    footer .links {
+        color: var(--title-color);
+    }
+
+    footer a {
+        text-decoration: underline;
+        text-underline-position: from-font;
+    }
+
     footer .icons {
         /* position: absolute; */
         /* right: 4rem; */
@@ -94,16 +114,17 @@
         footer {
             /* gap: var(--p2-rem); */
             display: grid;
-            grid-template-columns: 1fr 1fr;
-            gap: var(--p2-rem);
+            grid-template-columns: 1fr;
+            /* gap: var(--p1-rem); */
             align-items: center;
             justify-items: center;
+            text-align: center;
         }
 
-        footer p {
+        footer>*:not(.icons) {
             width: 100%;
-            /* height: min-content; */
             margin-bottom: 2rem;
+            margin-right: 0;
         }
 
         footer .icons {
@@ -116,17 +137,17 @@
         }
 
         .contact {
-            text-align: start;
+            text-align: center;
         }
 
         footer .icons>li>a>img {
-            height: clamp(30px, 3rem, 40px);
-            width: clamp(30px, 3rem, 40px);
+            height: clamp(30px, 2rem, 40px);
+            width: clamp(30px, 2rem, 40px);
         }
     }
 </style>
 <script>
-    document.addEventListener('DOMContentLoaded', function() {
+    document.addEventListener('DOMContentLoaded', function () {
         const yearSpan = document.querySelector('footer .trademark span');
         const currentYear = new Date().getFullYear();
         yearSpan.textContent = currentYear;