From 6ee1c76366ef4908d6e85a7cfa8214521e0e4b92 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Fri, 12 May 2023 22:25:38 +0530
Subject: [PATCH] chore: content list item & tag highlight indicator on mobile

---
 packages/web/src/stylesheets/_items-column.scss | 8 ++++----
 packages/web/src/stylesheets/_navigation.scss   | 8 +++++++-
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/packages/web/src/stylesheets/_items-column.scss b/packages/web/src/stylesheets/_items-column.scss
index b014307e4..4630ac0fa 100644
--- a/packages/web/src/stylesheets/_items-column.scss
+++ b/packages/web/src/stylesheets/_items-column.scss
@@ -111,16 +111,16 @@
   }
 
   .content-list-item {
-    &.selected {
-      background-color: var(--item-cell-selected-background-color);
-    }
-
     @media screen and (hover: hover) {
       &:hover {
         background-color: var(--item-cell-selected-background-color);
       }
     }
 
+    &:active {
+      background-color: var(--item-cell-selected-background-color);
+    }
+
     ul {
       list-style: disc;
     }
diff --git a/packages/web/src/stylesheets/_navigation.scss b/packages/web/src/stylesheets/_navigation.scss
index 4c5c28c90..af4dc6be2 100644
--- a/packages/web/src/stylesheets/_navigation.scss
+++ b/packages/web/src/stylesheets/_navigation.scss
@@ -167,7 +167,13 @@ $content-horizontal-padding: 16px;
       }
     }
 
-    &:hover:not(.selected),
+    @media screen and (hover: hover) {
+      &:hover:not(.selected) {
+        background-color: var(--navigation-item-selected-background-color);
+      }
+    }
+
+    &:active,
     &.selected,
     &.is-drag-over {
       background-color: var(--navigation-item-selected-background-color);