From 4b669ff030c4c3aa713d639e03ceda185f6b9db6 Mon Sep 17 00:00:00 2001
From: YetAnotherZephyruso <sunsetnotice@proton.me>
Date: Tue, 23 Jul 2024 20:58:03 +0800
Subject: [PATCH] fix: respect system ui font & better looking (maybe) for
 proxy card (#844)

---
 auto-imports.d.ts                |  1 +
 src/components/Latency.tsx       |  6 ++++--
 src/components/ProxyNodeCard.tsx | 12 +++++++-----
 tailwind.config.ts               |  4 ++--
 4 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/auto-imports.d.ts b/auto-imports.d.ts
index 6e09658..12bdb7e 100644
--- a/auto-imports.d.ts
+++ b/auto-imports.d.ts
@@ -135,6 +135,7 @@ declare global {
   const useMatch: (typeof import('@solidjs/router'))['useMatch']
   const useNavigate: (typeof import('@solidjs/router'))['useNavigate']
   const useParams: (typeof import('@solidjs/router'))['useParams']
+  const usePreloadRoute: (typeof import('@solidjs/router'))['usePreloadRoute']
   const useResolvedPath: (typeof import('@solidjs/router'))['useResolvedPath']
   const useRouteData: (typeof import('@solidjs/router'))['useRouteData']
   const useRoutes: (typeof import('@solidjs/router'))['useRoutes']
diff --git a/src/components/Latency.tsx b/src/components/Latency.tsx
index 7ecf51c..55bffab 100644
--- a/src/components/Latency.tsx
+++ b/src/components/Latency.tsx
@@ -2,7 +2,7 @@ import { LATENCY_QUALITY_MAP_HTTP } from '~/constants'
 import { useI18n } from '~/i18n'
 import { latencyQualityMap, useProxies } from '~/signals'
 
-export const Latency = (props: { name?: string }) => {
+export const Latency = (props: { name?: string; class?: string }) => {
   const [t] = useI18n()
   const { latencyMap } = useProxies()
   const [textClassName, setTextClassName] = createSignal('')
@@ -25,7 +25,9 @@ export const Latency = (props: { name?: string }) => {
         latency() !== LATENCY_QUALITY_MAP_HTTP.NOT_CONNECTED
       }
     >
-      <span class={`whitespace-nowrap text-xs ${textClassName()}`}>
+      <span
+        class={`whitespace-nowrap text-xs ${textClassName()} ${props.class}`}
+      >
         {latency()}
         {t('ms')}
       </span>
diff --git a/src/components/ProxyNodeCard.tsx b/src/components/ProxyNodeCard.tsx
index 294dc8a..7122063 100644
--- a/src/components/ProxyNodeCard.tsx
+++ b/src/components/ProxyNodeCard.tsx
@@ -26,7 +26,8 @@ export const ProxyNodeCard = (props: {
     <div
       class={twMerge(
         'border-neutral-focus card card-bordered tooltip-bottom flex flex-col justify-between gap-1 bg-neutral p-2 text-neutral-content',
-        isSelected && 'border-primary bg-primary-content text-primary',
+        isSelected &&
+          'bg-gradient-to-br from-primary to-secondary text-primary-content',
         onClick && 'cursor-pointer',
       )}
       onClick={onClick}
@@ -61,7 +62,7 @@ export const ProxyNodeCard = (props: {
         <div
           class={twMerge(
             'text-xs text-slate-500',
-            isSelected && 'text-primary',
+            isSelected && 'text-primary-content',
           )}
         >
           {formatProxyType(proxyNode()?.type)}
@@ -69,9 +70,10 @@ export const ProxyNodeCard = (props: {
           <Show when={specialType()}>{` :: ${specialType()}`}</Show>
         </div>
 
-        <div class="text-xs">
-          <Latency name={props.proxyName} />
-        </div>
+        <Latency
+          name={props.proxyName}
+          class={twMerge(isSelected && 'badge badge-sm px-1')}
+        />
       </div>
     </div>
   )
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 761138c..5d38df3 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -7,8 +7,8 @@ export default {
   daisyui: { themes: true },
   theme: {
     fontFamily: {
-      twemoji: ['Fira Sans', 'Twemoji Mozilla', 'system-ui', 'monospace'],
-      'no-twemoji': ['Fira Sans', 'system-ui', 'monospace'],
+      twemoji: ['system-ui', 'Twemoji Mozilla', 'Fira Sans', 'monospace'],
+      'no-twemoji': ['system-ui', 'Fira Sans', 'monospace'],
     },
   },
 } as Config