Merge pull request 'Theming & Page Changes' (#1) from feature/theming into master

Reviewed-on: https://git.indrajith.dev/indrajith/indrajith.dev/pulls/1

3 files changed, 23 insertions, 21 deletions

diff --git a/src/_includes/partials/footer.njk b/src/_includes/partials/footer.njk
index b34ef59..8a1a660 100644
--- a/src/_includes/partials/footer.njk
+++ b/src/_includes/partials/footer.njk
@@ -1,15 +1,16 @@
-<footer class="items-center px-6 py-2 mt-auto bg-black text-white">
+<footer class="items-center px-6 py-2 mt-auto bg-main-dark-brown-2 text-main-cream-white-2">
     <ul class="w-full flex md:hidden gap-5 font-supply-regular ml-auto justify-center mt-5 md:mt-0">
-        <li class="hover:text-white inline-block"><a title="Twitter" target="_blank" href="https://twitter.com/indrajithKLIS" class="links">{% feather "twitter" %}</a></li>
-        <li class="hover:text-white inline-block"><a title="Github" target="_blank" href="https://github.com/cooljith91112" class="links">{% feather "github" %}</a></li>
-        <li class="hover:text-white inline-block"><a title="GIT - Personal" target="_blank" href="https://git.indrajith.dev/" class="links">{% feather "git-branch" %}</a></li>
-        <li class="hover:text-white inline-block"><a title="LinkedIn" target="_blank" href="https://www.linkedin.com/in/indrajithklis/" class="links">{% feather "linkedin" %}</a></li>
-        <li class="hover:text-white inline-block"><a title="Ko-Fi" target="_blank" href="https://ko-fi.com/indrajith" class="links">{% feather "coffee" %}</a></li>
-        <li class="hover:text-white inline-block"><a title="RSS" target="_blank" href="/feed.xml" class="links">{% feather "rss" %}</a></li>
+        <li class="hover:text-lightish-50 inline-block"><a title="Twitter" target="_blank" href="https://twitter.com/indrajithKLIS" class="links">{% feather "twitter" %}</a></li>
+        <li class="hover:text-lightish-50 inline-block"><a title="Github" target="_blank" href="https://github.com/cooljith91112" class="links">{% feather "github" %}</a></li>
+        <li class="hover:text-lightish-50 inline-block"><a title="Sourcehut" target="_blank" href="https://sr.ht/~cooljith91112/" class="links">{% feather "circle" %}</a></li>
+        <li class="hover:text-lightish-50 inline-block"><a title="LinkedIn" target="_blank" href="https://www.linkedin.com/in/indrajithklis/" class="links">{% feather "linkedin" %}</a></li>
+        <li class="hover:text-lightish-50 inline-block"><a title="Ko-Fi" target="_blank" href="https://ko-fi.com/indrajith" class="links">{% feather "coffee" %}</a></li>
+        <li class="hover:text-lightish-50 inline-block"><a title="RSS" target="_blank" href="/feed.xml" class="links">{% feather "rss" %}</a></li>
     </ul>
     <ul class="flex w-full gap-10 font-supply-regular justify-center mt-5 md:mt-auto">
         <li class="mt-1">
             <p>&copy; 2022 Indrajith K L </p>
         </li>
     </ul>
+    <div id="wcb" class="carbonbadge wcb-d"></div>
 </footer>
\ No newline at end of file
diff --git a/src/_includes/partials/head.njk b/src/_includes/partials/head.njk
index ed4e5ec..97690fb 100644
--- a/src/_includes/partials/head.njk
+++ b/src/_includes/partials/head.njk
@@ -17,4 +17,5 @@
 <meta property="og:image" content="https://indrajith.dev/images/me.png">
 <link rel="stylesheet" href="/global.css">
 {% favicon './favicon.svg' %}
-<title>{{title}} | { indrajith.dev } </title>
\ No newline at end of file
+<title>{{title}} | { indrajith.dev } </title>
+<script src="https://unpkg.com/website-carbon-badges@1.1.3/b.min.js" defer></script>
\ No newline at end of file
diff --git a/src/_includes/partials/header.njk b/src/_includes/partials/header.njk
index 30fdc77..ed5aac2 100644
--- a/src/_includes/partials/header.njk
+++ b/src/_includes/partials/header.njk
@@ -1,20 +1,20 @@
-<header class="w-full bg-black text-yellow-500 flex flex-row md:flex-col justify-between items-center px-6 py-4">
+<header class="w-full bg-main-normal-brown text-main-cream-white-1 font-bold flex flex-row md:flex-col justify-between items-center px-6 py-4">
     <nav class="w-full">
         <ul class="flex flex-col md:flex-row gap-3 md:gap-10 font-supply-regular w-full items-center text-lg md:text-xl">
             <li>
-                <a href="/" class="text-lg md:text-3xl">{ indrajith.dev } </a>
+                <a href="/" class="text-lg md:text-3xl text-main-red">{ indrajith.dev } </a>
             </li>
-            <li class="hover:text-white"><a href="/about" id="about" class="links">About</a></li>
-            <li class="hover:text-white"><a href="/posts" id="posts" class="links">Posts</a></li>
-            <li class="hover:text-white"><a href="/cv" id="cv" class="links">CV</a></li>
+            <li class="hover:text-lightish-50"><a href="/about" id="about" class="links">About</a></li>
+            <li class="hover:text-lightish-50"><a href="/posts" id="posts" class="links">Posts</a></li>
+            <li class="hover:text-lightish-50"><a href="/cv" id="cv" class="links">CV</a></li>
         </ul>
-        <ul class="hidden md:flex flex-row gap-3 font-supply-regular right-0 -my-8 mx-6 absolute">
-            <li class="hover:text-white"><a title="Twitter" target="_blank" href="https://twitter.com/indrajithKLIS" class="links">{% feather "twitter" %}</a></li>
-            <li class="hover:text-white"><a title="Github" target="_blank" href="https://github.com/cooljith91112" class="links">{% feather "github" %}</a></li>
-            <li class="hover:text-white"><a title="GIT - Personal" target="_blank" href="https://git.indrajith.dev/" class="links">{% feather "git-branch" %}</a></li>
-            <li class="hover:text-white"><a title="LinkedIn" target="_blank" href="https://www.linkedin.com/in/indrajithklis/" class="links">{% feather "linkedin" %}</a></li>
-            <li class="hover:text-white"><a title="Ko-Fi" target="_blank" href="https://ko-fi.com/indrajith" class="links">{% feather "coffee" %}</a></li>
-            <li class="hover:text-white"><a title="RSS" target="_blank" href="/feed.xml" class="links">{% feather "rss" %}</a></li>
+        <ul class="hidden md:flex flex-row gap-2 font-supply-regular font-bold right-0 -my-8 mx-6 absolute">
+            <li class="hover:text-lightish-50"><a title="Twitter" target="_blank" href="https://twitter.com/indrajithKLIS" class="links">{% feather "twitter" %}</a></li>
+            <li class="hover:text-lightish-50"><a title="Github" target="_blank" href="https://github.com/cooljith91112" class="links">{% feather "github" %}</a></li>
+            <li class="hover:text-lightish-50"><a title="Sourcehut" target="_blank" href="https://sr.ht/~cooljith91112/" class="links">{% feather "circle" %}</a></li>
+            <li class="hover:text-lightish-50"><a title="LinkedIn" target="_blank" href="https://www.linkedin.com/in/indrajithklis/" class="links">{% feather "linkedin" %}</a></li>
+            <li class="hover:text-lightish-50"><a title="Ko-Fi" target="_blank" href="https://ko-fi.com/indrajith" class="links">{% feather "coffee" %}</a></li>
+            <li class="hover:text-lightish-50"><a title="RSS" target="_blank" href="/feed.xml" class="links">{% feather "rss" %}</a></li>
         </ul>
     </nav>
 </header>
@@ -25,7 +25,7 @@
     const navs = ["about","posts","cv"];
     const currentNav = navs.find(nav=>currentLocation.includes(nav));
     if (currentNav) {
-        document.getElementById(currentNav).parentElement.classList.add("text-white");
+        document.getElementById(currentNav).parentElement.classList.add("text-lightish-50");
     }
 })();
 </script>
\ No newline at end of file