From 02caaacf4036d41e4f8e9cec6db682d2d27d75e9 Mon Sep 17 00:00:00 2001 From: Stone-Red-Code <56473591+StoneRed5@users.noreply.github.com> Date: Mon, 4 Jan 2021 17:29:09 +0100 Subject: [PATCH] Improved home page --- index.html | 73 +++++++++++++++++++----------------------------------- nav.html | 15 ----------- style.css | 46 +++++++++++++++++++++++----------- 3 files changed, 57 insertions(+), 77 deletions(-) diff --git a/index.html b/index.html index 32a6ddb..7d6c52d 100644 --- a/index.html +++ b/index.html @@ -29,8 +29,10 @@ $("#nav-placeholder").replaceWith(data); }); - + + +
@@ -48,21 +50,16 @@ Keep in mind, some things here are just placeholders and will be replaced or removed. On this page I will post all my current projects and updates.

-

Icons:

-
+ -
-
- + diff --git a/nav.html b/nav.html index faa7357..47f9522 100644 --- a/nav.html +++ b/nav.html @@ -15,21 +15,6 @@
  • Projects
    • -
  • - Link -
    • - - -
  • - - Dropdown link - -
    - Link 1 - Link 2 - Link 3 -
    -
    • diff --git a/style.css b/style.css index f14c764..165a44b 100644 --- a/style.css +++ b/style.css @@ -1,9 +1,28 @@ - -:root -{ +:root { --fg-theme: gray; } +html { + position: relative; + min-height: 100%; +} + +body { + /* Margin bottom by footer height */ + margin-bottom: 257px; + overflow-x: hidden; + background-color: #40444B; +} + +footer { + position: absolute; + bottom: 0; + width: 100%; + padding-right: 1.9rem; + /* Set the fixed height of the footer here */ + height: 255px; +} + .header { background: url("Images/code.png"); height: 100px; @@ -15,10 +34,6 @@ background-color: var(--fg-theme); } -body { - background-color: #40444B; -} - h1 { color: white; font-family: Verdana, Geneva, Tahoma, sans-serif; @@ -44,33 +59,37 @@ h3 { color: black; } - - a:link { color: gray; text-decoration: underline; } /* visited link */ + a:visited { color: gray; } /* mouse over link */ + a:hover { color: rgb(0, 0, 0); } /* selected link */ + a:active { color: rgb(180, 180, 180); } -.nav-link -{ +.nav-link { text-decoration: var(--fg-theme); } +.toolIcon img{ + width: 100; +} + @media screen and (max-width: 768px) { h2 { font-size: 20px; @@ -83,9 +102,8 @@ a:active { } } -@media screen and (max-width: 360px) -{ - h1{ +@media screen and (max-width: 360px) { + h1 { font-size: 30px; } .mostUsedLangs {