fix: modify styling for footer and remove image from the footer

developer-friendly · May 17, 2024 · a6cfd06 · a6cfd06
1 parent 140be69
commit a6cfd06
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/frontend/assets/styles.css b/frontend/assets/styles.css
@@ -11,7 +11,14 @@
   box-sizing: border-box;
 }
 
+html,
 body {
+  height: 100%;
+}
+
+body {
+  display: flex;
+  flex-direction: column;
   font-family: Arial, sans-serif;
   line-height: 1.6;
   background-color: var(--light-color);
@@ -47,8 +54,8 @@ header nav ul li a:hover {
 }
 
 main {
+  flex: 1;
   padding: 2rem;
-  min-height: 80vh;
   text-align: center;
 }
 
@@ -57,7 +64,8 @@ h1 {
   color: var(--primary-color);
 }
 
-form, table {
+form,
+table {
   max-width: 400px;
   margin: 0 auto;
   padding: 2rem;
@@ -126,7 +134,7 @@ footer {
   color: var(--light-color);
   text-align: center;
   padding: 1rem 0;
-  position: absolute;
+  position: fixed;
   width: 100%;
   bottom: 0;
 }
@@ -162,7 +170,6 @@ i {
   margin-right: 0.3rem;
 }
 
-
 footer img {
   margin-right: 0.3rem;
 }
diff --git a/frontend/index.html b/frontend/index.html
@@ -36,7 +36,7 @@
     <main id="app"></main>
 
     <footer>
-      <p>&copy; <img width="18" src="/assets/favicon.ico" /><a href="https://developer-friendly.blog" target="_blank">Developer Friendly</a>. All rights reserved.</p>
+      <p>&copy; <a href="https://developer-friendly.blog" target="_blank">Developer Friendly</a>. All rights reserved.</p>
       <span><i class="fa-brands fa-github"></i><a href="https://github.com/developer-friendly/ory-example" target="_blank">Source Code</span></a>
     </footer>
   </body>