From 787e053f7b1308f63b5f3d5c71f0be9d3d9eafa8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Avijit=20=F0=9F=9A=80?= <526avijit@gmail.com>
Date: Thu, 5 Aug 2021 01:15:10 +0200
Subject: [PATCH] Fix overlapping and tags hover color

---
 themes/gokarna/static/css/dark.css |  6 +++---
 themes/gokarna/static/css/main.css | 23 +++++++++++++++++++----
 2 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/themes/gokarna/static/css/dark.css b/themes/gokarna/static/css/dark.css
index cb9d8ca..a36b4a5 100644
--- a/themes/gokarna/static/css/dark.css
+++ b/themes/gokarna/static/css/dark.css
@@ -1,7 +1,7 @@
 :root {
   --dark-bg-color: 18, 18, 18;
   --dark-text-color: white;
-  --dark-tags-bg-color: #1f1f1f;
+  --dark-tags-bg-color: #444444;
   --dark-header-divider-color: #484848;
 }
 
@@ -29,7 +29,7 @@ a:hover .feather-moon {
 
 .post-tags .post-tag:hover {
   background-color: var(--dark-text-color);
-  color: rgb(--dark-bg-color);
+  color: rgb(var(--dark-bg-color));
 }
 
 .tags-list .post-tags .post-tag a .tag-posts-count {
@@ -38,7 +38,7 @@ a:hover .feather-moon {
 
 .tags-list .post-tags .post-tag:hover a .tag-posts-count {
   background-color: var(--dark-text-color);
-  color: rgb(--dark-bg-color);
+  color: rgb(var(--dark-bg-color));
 }
 
 .footer {
diff --git a/themes/gokarna/static/css/main.css b/themes/gokarna/static/css/main.css
index 9512079..2dd6df8 100644
--- a/themes/gokarna/static/css/main.css
+++ b/themes/gokarna/static/css/main.css
@@ -3,6 +3,7 @@
 
   --light-bg-color: 255, 255, 255;
   --light-text-color: black;
+  --light-tags-bg-color: #dddddd;
   --light-header-divider-color: #dfdfdf;
 }
 
@@ -50,6 +51,7 @@ img {
   top: 0;
   transition: box-shadow 0.3s ease-in-out;
   width: 100%;
+  z-index: 5;
 }
 
 .header a {
@@ -142,6 +144,14 @@ a:hover .feather-sun {
   width: 100%;
   z-index: 5;
 }
+.nav-hamburger-list .nav-item {
+  position: relative;
+  z-index: 5;
+}
+.nav-item a {
+  position: relative;
+  z-index: 5;
+}
 .nav-hamburger-list a:hover {
   text-decoration: underline;
 }
@@ -203,7 +213,7 @@ a:hover .feather-sun {
 }
 .post-tags .post-tag:hover {
   background-color: var(--light-text-color);
-  color: var(--light-bg-color);
+  color: rgb(var(--light-bg-color));
 }
 .post-tag a {
   color: inherit;
@@ -351,7 +361,7 @@ main#content .post {
   margin-top: 50px;
 }
 .tags-list .post-tags .post-tag {
-  margin: 0 5px;
+  margin: 2px 5px;
   padding: 0;
 }
 .tags-list .post-tags .post-tag a {
@@ -365,12 +375,17 @@ main#content .post {
   padding: 5px 8px;
 }
 .tags-list .post-tags .post-tag a .tag-posts-count {
-  background: rgba(0, 0, 0, 0.1);
+  background-color: var(--light-tags-bg-color);
   border-radius: inherit;
+  color: inherit;
   opacity: 0.8;
   padding: 6px;
   position: relative;
-  z-index: -1;
+  z-index: 0;
+}
+.tags-list .post-tags .post-tag:hover a .tag-posts-count {
+  background-color: var(--light-text-color);
+  color: rgb(var(--light-bg-color));
 }
 
 @media only screen and (max-width: 820px) {