From ae93e8bf72114173667cc73c72e3ec4940a1ba91 Mon Sep 17 00:00:00 2001
From: James Dinh <jamesdinh77@gmail.com>
Date: Sun, 20 Nov 2022 22:30:34 -0800
Subject: [PATCH] Added footer

---
 about.html       | 25 ++++++++++++++++++++++---
 contact.html     | 25 ++++++++++++++++++++++---
 css/general.css  | 34 ++++++++++++++++++++++++++++++++--
 gallery.html     | 25 ++++++++++++++++++++++---
 htdocs/.htaccess |  4 ++++
 index.html       | 24 +++++++++++++++++++++---
 6 files changed, 123 insertions(+), 14 deletions(-)
 create mode 100644 htdocs/.htaccess

diff --git a/about.html b/about.html
index 202c29a..9e345c2 100644
--- a/about.html
+++ b/about.html
@@ -24,6 +24,7 @@
             position: relative;
             background-color: #f2f1ef;
             color: #0d1117;
+            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
         }
     </style>
     <!--For icons, go here: https://iconsvg.xyz/ or https://icomoon.io/app/#/select-->
@@ -40,9 +41,9 @@
             </div>
             <div id="nav-links-container">
                 <ul id="navList">
-                    <li><a class="navlink" onclick="uncheck('check')" href="./gallery.html">Gallery</a></li>
-                    <li><a class="navlink current" onclick="uncheck('check')" href="./about.html">About</a></li>
-                    <li><a class="navlink" onclick="uncheck('check')" href="./contact.html">Contact</a></li>
+                    <li><a class="navlink" href="./gallery.html" title="gallery">Gallery</a></li>
+                    <li><a class="navlink current" href="./about.html" title="about">About</a></li>
+                    <li><a class="navlink" href="./contact.html" title="contact">Contact</a></li>
                 </ul>
             </div>
         </nav>
@@ -60,5 +61,23 @@
 
         </div>
     </main>
+    <footer>
+        <div class="footer-container">
+            <div class="footer-copyright">
+                ©️ 2022 Nancy Pannikkat
+            </div>
+            <div class="socials">
+                <div class="socials-icon">
+                    <a href="#" title="Facebook"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4 7.28V4.5h-2.29c-2.1 0-3.42 1.6-3.42 3.89v1.67H8v2.77h2.29v6.67h2.85v-6.67h2.29l.57-2.77h-2.86V8.94c0-1.1.58-1.66 1.72-1.66H16z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Instagram"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4.89 4.5H8.9C6.33 4.5 4.6 6.15 4.5 8.66V15.09c0 1.3.42 2.41 1.27 3.23a4.34 4.34 0 0 0 2.88 1.17l.27.01h6.16c1.3 0 2.4-.42 3.18-1.18a4.25 4.25 0 0 0 1.23-2.95l.01-.26V8.9c0-1.28-.42-2.36-1.21-3.15a4.24 4.24 0 0 0-2.92-1.23l-.26-.01zm-6.2 1.4h6.24c.9 0 1.66.26 2.2.8.47.5.77 1.18.81 1.97V15.1c0 .94-.32 1.7-.87 2.21-.5.47-1.17.74-1.98.78H8.92c-.91 0-1.67-.26-2.21-.78-.5-.5-.77-1.17-.81-2V8.88c0-.9.26-1.66.8-2.2a2.98 2.98 0 0 1 2-.78h6.45-6.23zM12 8.1a3.88 3.88 0 0 0 0 7.74 3.88 3.88 0 0 0 0-7.74zm0 1.39a2.5 2.5 0 0 1 2.48 2.48A2.5 2.5 0 0 1 12 14.45a2.5 2.5 0 0 1-2.48-2.48A2.5 2.5 0 0 1 12 9.49zm4.02-2.36a.88.88 0 1 0 0 1.76.88.88 0 0 0 0-1.76z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Email"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg></a>
+                </div>
+            </div>
+        </div>
+    </footer>
 </body>
 </html>
\ No newline at end of file
diff --git a/contact.html b/contact.html
index 34f3cd6..a6612b5 100644
--- a/contact.html
+++ b/contact.html
@@ -25,6 +25,7 @@
             position: relative;
             background-color: #f2f1ef;
             color: #0d1117;
+            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
         }
     </style>
     <!--For icons, go here: https://iconsvg.xyz/ or https://icomoon.io/app/#/select-->
@@ -41,9 +42,9 @@
             </div>
             <div id="nav-links-container">
                 <ul id="navList">
-                    <li><a class="navlink" onclick="uncheck('check')" href="./gallery.html">Gallery</a></li>
-                    <li><a class="navlink" onclick="uncheck('check')" href="./about.html">About</a></li>
-                    <li><a class="navlink current" onclick="uncheck('check')" href="./contact.html">Contact</a></li>
+                    <li><a class="navlink" href="./gallery.html" title="gallery">Gallery</a></li>
+                    <li><a class="navlink" href="./about.html" title="about">About</a></li>
+                    <li><a class="navlink current" href="./contact.html" title="contact">Contact</a></li>
                 </ul>
             </div>
         </nav>
@@ -78,5 +79,23 @@
                 </form>
         </section>
     </main>
+    <footer>
+        <div class="footer-container">
+            <div class="footer-copyright">
+                ©️ 2022 Nancy Pannikkat
+            </div>
+            <div class="socials">
+                <div class="socials-icon">
+                    <a href="#" title="Facebook"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4 7.28V4.5h-2.29c-2.1 0-3.42 1.6-3.42 3.89v1.67H8v2.77h2.29v6.67h2.85v-6.67h2.29l.57-2.77h-2.86V8.94c0-1.1.58-1.66 1.72-1.66H16z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Instagram"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4.89 4.5H8.9C6.33 4.5 4.6 6.15 4.5 8.66V15.09c0 1.3.42 2.41 1.27 3.23a4.34 4.34 0 0 0 2.88 1.17l.27.01h6.16c1.3 0 2.4-.42 3.18-1.18a4.25 4.25 0 0 0 1.23-2.95l.01-.26V8.9c0-1.28-.42-2.36-1.21-3.15a4.24 4.24 0 0 0-2.92-1.23l-.26-.01zm-6.2 1.4h6.24c.9 0 1.66.26 2.2.8.47.5.77 1.18.81 1.97V15.1c0 .94-.32 1.7-.87 2.21-.5.47-1.17.74-1.98.78H8.92c-.91 0-1.67-.26-2.21-.78-.5-.5-.77-1.17-.81-2V8.88c0-.9.26-1.66.8-2.2a2.98 2.98 0 0 1 2-.78h6.45-6.23zM12 8.1a3.88 3.88 0 0 0 0 7.74 3.88 3.88 0 0 0 0-7.74zm0 1.39a2.5 2.5 0 0 1 2.48 2.48A2.5 2.5 0 0 1 12 14.45a2.5 2.5 0 0 1-2.48-2.48A2.5 2.5 0 0 1 12 9.49zm4.02-2.36a.88.88 0 1 0 0 1.76.88.88 0 0 0 0-1.76z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Email"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg></a>
+                </div>
+            </div>
+        </div>
+    </footer>
 </body>
 </html>
\ No newline at end of file
diff --git a/css/general.css b/css/general.css
index a0f901f..29312fd 100644
--- a/css/general.css
+++ b/css/general.css
@@ -219,8 +219,8 @@ header {
 }
 
 .about-img {
-  width: 300px;
-  height: 300px;
+  width: 400px;
+  height: 400px;
   background: linear-gradient(rgba(10, 14, 18, 0.2) 50%, rgba(104, 104, 104, 0.37) 60%, rgb(188, 188, 188) 100%);
 }
 
@@ -347,4 +347,34 @@ main {
 
 .topic {
   font-size: 30px;
+}
+
+/* Footer */
+footer {
+  width: 100%;
+  background-color: #e1e1e1;
+}
+
+.footer-container {
+  display: flex;
+  justify-content: space-between;
+  max-width: 800px;
+  min-width: none;
+  margin: auto;
+}
+
+.footer-copyright {
+  font-size: 18px;
+  padding: 5px 0;
+}
+
+.socials {
+  padding-top: 6px;
+  align-items: center;
+  float: right;
+  display: flex;
+}
+
+.socials-icon {
+  padding: 0 5px;
 }
\ No newline at end of file
diff --git a/gallery.html b/gallery.html
index ec1de1d..f3870cf 100644
--- a/gallery.html
+++ b/gallery.html
@@ -24,6 +24,7 @@
             position: relative;
             background-color: #f2f1ef;
             color: #0d1117;
+            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
         }
     </style>
     <!--For icons, go here: https://iconsvg.xyz/ or https://icomoon.io/app/#/select-->
@@ -40,9 +41,9 @@
             </div>
             <div id="nav-links-container">
                 <ul id="navList">
-                    <li><a class="navlink current" onclick="uncheck('check')" href="./gallery.html">Gallery</a></li>
-                    <li><a class="navlink" onclick="uncheck('check')" href="./about.html">About</a></li>
-                    <li><a class="navlink" onclick="uncheck('check')" href="./contact.html">Contact</a></li>
+                    <li><a class="navlink current" href="./gallery.html" title="gallery">Gallery</a></li>
+                    <li><a class="navlink" href="./about.html" title="about">About</a></li>
+                    <li><a class="navlink" href="./contact.html" title="contact">Contact</a></li>
                 </ul>
             </div>
         </nav>
@@ -107,5 +108,23 @@
             </div>
         </div>
     </main>
+    <footer>
+        <div class="footer-container">
+            <div class="footer-copyright">
+                ©️ 2022 Nancy Pannikkat
+            </div>
+            <div class="socials">
+                <div class="socials-icon">
+                    <a href="#" title="Facebook"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4 7.28V4.5h-2.29c-2.1 0-3.42 1.6-3.42 3.89v1.67H8v2.77h2.29v6.67h2.85v-6.67h2.29l.57-2.77h-2.86V8.94c0-1.1.58-1.66 1.72-1.66H16z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Instagram"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4.89 4.5H8.9C6.33 4.5 4.6 6.15 4.5 8.66V15.09c0 1.3.42 2.41 1.27 3.23a4.34 4.34 0 0 0 2.88 1.17l.27.01h6.16c1.3 0 2.4-.42 3.18-1.18a4.25 4.25 0 0 0 1.23-2.95l.01-.26V8.9c0-1.28-.42-2.36-1.21-3.15a4.24 4.24 0 0 0-2.92-1.23l-.26-.01zm-6.2 1.4h6.24c.9 0 1.66.26 2.2.8.47.5.77 1.18.81 1.97V15.1c0 .94-.32 1.7-.87 2.21-.5.47-1.17.74-1.98.78H8.92c-.91 0-1.67-.26-2.21-.78-.5-.5-.77-1.17-.81-2V8.88c0-.9.26-1.66.8-2.2a2.98 2.98 0 0 1 2-.78h6.45-6.23zM12 8.1a3.88 3.88 0 0 0 0 7.74 3.88 3.88 0 0 0 0-7.74zm0 1.39a2.5 2.5 0 0 1 2.48 2.48A2.5 2.5 0 0 1 12 14.45a2.5 2.5 0 0 1-2.48-2.48A2.5 2.5 0 0 1 12 9.49zm4.02-2.36a.88.88 0 1 0 0 1.76.88.88 0 0 0 0-1.76z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Email"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg></a>
+                </div>
+            </div>
+        </div>
+    </footer>
 </body>
 </html>
\ No newline at end of file
diff --git a/htdocs/.htaccess b/htdocs/.htaccess
new file mode 100644
index 0000000..6c70481
--- /dev/null
+++ b/htdocs/.htaccess
@@ -0,0 +1,4 @@
+RewriteEngine On
+RewriteCond %{REQUEST_FILENAME} !-d
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteRule ^([^\.]+)$ $1.html [NC, L]
\ No newline at end of file
diff --git a/index.html b/index.html
index 6e8935a..175b58b 100644
--- a/index.html
+++ b/index.html
@@ -41,9 +41,9 @@
             </div>
             <div id="nav-links-container">
                 <ul id="navList">
-                    <li><a class="navlink" onclick="uncheck('check')" href="./gallery.html">Gallery</a></li>
-                    <li><a class="navlink" onclick="uncheck('check')" href="./about.html">About</a></li>
-                    <li><a class="navlink" onclick="uncheck('check')" href="./contact.html">Contact</a></li>
+                    <li><a class="navlink" href="./gallery.html" title="gallery">Gallery</a></li>
+                    <li><a class="navlink" href="./about.html" title="about">About</a></li>
+                    <li><a class="navlink" href="./contact.html" title="contact">Contact</a></li>
                 </ul>
             </div>
         </nav>
@@ -64,5 +64,23 @@
     <main>
         
     </main>
+    <footer>
+        <div class="footer-container">
+            <div class="footer-copyright">
+                ©️ 2022 Nancy Pannikkat
+            </div>
+            <div class="socials">
+                <div class="socials-icon">
+                    <a href="#" title="Facebook"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4 7.28V4.5h-2.29c-2.1 0-3.42 1.6-3.42 3.89v1.67H8v2.77h2.29v6.67h2.85v-6.67h2.29l.57-2.77h-2.86V8.94c0-1.1.58-1.66 1.72-1.66H16z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Instagram"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="#000"><path d="M20 0a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4h16zm-4.89 4.5H8.9C6.33 4.5 4.6 6.15 4.5 8.66V15.09c0 1.3.42 2.41 1.27 3.23a4.34 4.34 0 0 0 2.88 1.17l.27.01h6.16c1.3 0 2.4-.42 3.18-1.18a4.25 4.25 0 0 0 1.23-2.95l.01-.26V8.9c0-1.28-.42-2.36-1.21-3.15a4.24 4.24 0 0 0-2.92-1.23l-.26-.01zm-6.2 1.4h6.24c.9 0 1.66.26 2.2.8.47.5.77 1.18.81 1.97V15.1c0 .94-.32 1.7-.87 2.21-.5.47-1.17.74-1.98.78H8.92c-.91 0-1.67-.26-2.21-.78-.5-.5-.77-1.17-.81-2V8.88c0-.9.26-1.66.8-2.2a2.98 2.98 0 0 1 2-.78h6.45-6.23zM12 8.1a3.88 3.88 0 0 0 0 7.74 3.88 3.88 0 0 0 0-7.74zm0 1.39a2.5 2.5 0 0 1 2.48 2.48A2.5 2.5 0 0 1 12 14.45a2.5 2.5 0 0 1-2.48-2.48A2.5 2.5 0 0 1 12 9.49zm4.02-2.36a.88.88 0 1 0 0 1.76.88.88 0 0 0 0-1.76z"/></svg></a>
+                </div>
+                <div class="socials-icon">
+                    <a href="#" title="Email"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="#000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg></a>
+                </div>
+            </div>
+        </div>
+    </footer>
 </body>
 </html>
\ No newline at end of file