From 17a61bb65f1c03e153c7be932d2cccad764f7428 Mon Sep 17 00:00:00 2001
From: boojack <imrealleonardo@gmail.com>
Date: Mon, 4 Jul 2022 21:45:54 +0800
Subject: [PATCH] choe: update shortcut actived style

---
 web/src/components/ShortcutList.tsx |  4 +---
 web/src/less/shortcut-list.less     | 11 +++--------
 web/src/less/tag-list.less          |  6 ++----
 3 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/web/src/components/ShortcutList.tsx b/web/src/components/ShortcutList.tsx
index 034a10fe..2474692d 100644
--- a/web/src/components/ShortcutList.tsx
+++ b/web/src/components/ShortcutList.tsx
@@ -1,7 +1,6 @@
 import { useEffect } from "react";
 import { locationService, shortcutService } from "../services";
 import { useAppSelector } from "../store";
-import { UNKNOWN_ID } from "../helpers/consts";
 import * as utils from "../helpers/utils";
 import useToggle from "../hooks/useToggle";
 import useLoading from "../hooks/useLoading";
@@ -113,12 +112,11 @@ const ShortcutContainer: React.FC<ShortcutContainerProps> = (props: ShortcutCont
     <>
       <div className={`shortcut-container ${isActive ? "active" : ""}`} onClick={handleShortcutClick}>
         <div className="shortcut-text-container">
-          {/* <span className="icon-text">#</span> */}
           <span className="shortcut-text">{shortcut.title}</span>
         </div>
         <div className="btns-container">
           <span className="action-btn toggle-btn">
-            <img className="icon-img" src={`/icons/more${isActive ? "-white" : ""}.svg`} />
+            <img className="icon-img" src="/icons/more.svg" />
           </span>
           <div className="action-btns-wrapper">
             <div className="action-btns-container">
diff --git a/web/src/less/shortcut-list.less b/web/src/less/shortcut-list.less
index 94c25957..59ea5f04 100644
--- a/web/src/less/shortcut-list.less
+++ b/web/src/less/shortcut-list.less
@@ -36,7 +36,7 @@
     @apply flex flex-col justify-start items-start relative w-full h-auto flex-nowrap mb-2;
 
     > .shortcut-container {
-      @apply flex flex-row justify-between items-center w-full h-10 py-0 px-4 mt-px first:mt-2 rounded-lg text-base cursor-pointer select-none shrink-0 hover:bg-gray-200;
+      @apply flex flex-row justify-between items-center w-full h-10 py-0 px-4 mt-px first:mt-2 rounded-lg text-base cursor-pointer select-none shrink-0 hover:bg-white;
 
       &:hover {
         > .btns-container {
@@ -45,18 +45,13 @@
       }
 
       &.active {
-        @apply bg-green-600;
-
         > .shortcut-text-container {
-          > * {
-            @apply text-white;
-          }
+          @apply text-green-600;
         }
       }
 
       > .shortcut-text-container {
-        @apply flex flex-row justify-start items-center truncate shrink leading-5 mr-1;
-        color: @text-black;
+        @apply flex flex-row justify-start items-center truncate shrink leading-5 mr-1 text-black;
 
         > .icon-text {
           @apply block w-4 shrink-0;
diff --git a/web/src/less/tag-list.less b/web/src/less/tag-list.less
index 953bf21e..2b5faeaf 100644
--- a/web/src/less/tag-list.less
+++ b/web/src/less/tag-list.less
@@ -23,13 +23,11 @@
     }
 
     .tag-item-container {
-      @apply flex flex-row justify-between items-center w-full h-10 py-0 px-4 rounded-lg text-base shrink-0 select-none cursor-pointer hover:bg-gray-200;
+      @apply flex flex-row justify-between items-center w-full h-10 py-0 px-4 rounded-lg text-base shrink-0 select-none cursor-pointer hover:bg-white;
 
       &.active {
         > .tag-text-container {
-          > * {
-            @apply text-green-600;
-          }
+          @apply text-green-600;
         }
       }