From 3d8fa080c351fa155c8c0edc7e4f6fee06438693 Mon Sep 17 00:00:00 2001
From: kunish <kunish.butt@gmail.com>
Date: Fri, 11 Oct 2024 22:29:36 +0800
Subject: [PATCH] feat(proxies): update layout, disable twemoji font by default

---
 src/components/Latency.tsx       |  8 +++-----
 src/components/ProxyNodeCard.tsx | 27 +++++++++++++--------------
 src/signals/config.ts            |  2 +-
 3 files changed, 17 insertions(+), 20 deletions(-)

diff --git a/src/components/Latency.tsx b/src/components/Latency.tsx
index 73b6902..13c48d8 100644
--- a/src/components/Latency.tsx
+++ b/src/components/Latency.tsx
@@ -6,17 +6,15 @@ export const Latency = (props: { name?: string; class?: string }) => {
   const [t] = useI18n()
   const { getLatencyByName } = useProxies()
   const [textClassName, setTextClassName] = createSignal('')
-  const latency = createMemo(() => {
-    return getLatencyByName(props.name || '')
-  })
+  const latency = createMemo(() => getLatencyByName(props.name || ''))
 
   createEffect(() => {
-    setTextClassName('text-success')
-
     if (latency() > latencyQualityMap().HIGH) {
       setTextClassName('text-error')
     } else if (latency() > latencyQualityMap().MEDIUM) {
       setTextClassName('text-warning')
+    } else {
+      setTextClassName('text-success')
     }
   })
 
diff --git a/src/components/ProxyNodeCard.tsx b/src/components/ProxyNodeCard.tsx
index 918c241..219875c 100644
--- a/src/components/ProxyNodeCard.tsx
+++ b/src/components/ProxyNodeCard.tsx
@@ -41,24 +41,23 @@ export const ProxyNodeCard = (props: {
       data-tip={proxyName}
       onClick={onClick}
     >
-      <div class="card-body">
+      <div class="card-body relative">
+        <div class="badge badge-secondary badge-sm absolute bottom-0 left-1/2 -translate-x-1/2 font-bold uppercase">
+          {formatProxyType(proxyNode()?.type)}
+        </div>
+
         <div class="card-title flex items-center justify-between gap-2">
           <span class="line-clamp-1 text-start text-sm">{proxyName}</span>
-
-          <div class="badge badge-primary badge-sm font-bold uppercase">
-            {formatProxyType(proxyNode()?.type)}
-          </div>
         </div>
 
-        <div class="flex flex-wrap items-center gap-2">
-          <Show when={specialType()}>
-            <div class="badge badge-secondary badge-sm">{specialType()}</div>
-          </Show>
-
-          <Show when={supportIPv6()}>
-            <div class="badge badge-accent badge-sm">IPv6</div>
-          </Show>
-        </div>
+        <span
+          class={twMerge(
+            'text-start text-xs',
+            isSelected ? 'text-info-content' : 'text-neutral-content',
+          )}
+        >
+          {[specialType(), supportIPv6() && 'IPv6'].filter(Boolean).join(' / ')}
+        </span>
 
         <div class="card-actions items-center justify-end">
           <Latency
diff --git a/src/signals/config.ts b/src/signals/config.ts
index fd63bc1..8195949 100644
--- a/src/signals/config.ts
+++ b/src/signals/config.ts
@@ -67,7 +67,7 @@ export const [autoCloseConns, setAutoCloseConns] = makePersisted(
   { name: 'autoCloseConns', storage: localStorage },
 )
 
-export const useTwemojiDefault = true
+export const useTwemojiDefault = false
 
 export const [useTwemoji, setUseTwemoji] = makePersisted(
   createSignal(useTwemojiDefault),