feat(proxies): update layout, disable twemoji font by default

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(() => {
+  const latency = createMemo(() => getLatencyByName(props.name || ''))
-    return 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')
     }
   })
 

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">
+        <span
-          <Show when={specialType()}>
+          class={twMerge(
-            <div class="badge badge-secondary badge-sm">{specialType()}</div>
+            'text-start text-xs',
-          </Show>
+            isSelected ? 'text-info-content' : 'text-neutral-content',
-
+          )}
-          <Show when={supportIPv6()}>
+        >
-            <div class="badge badge-accent badge-sm">IPv6</div>
+          {[specialType(), supportIPv6() && 'IPv6'].filter(Boolean).join(' / ')}
-          </Show>
+        </span>
-        </div>
 
         <div class="card-actions items-center justify-end">
           <Latency

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),