From faa04343e9f64afd57a737792b3ec473af87ae35 Mon Sep 17 00:00:00 2001
From: ayoayco <ayo@ayco.io>
Date: Fri, 25 Apr 2025 20:26:47 +0200
Subject: [PATCH] style: spacing and color adjustments

- remove padding on results if has results
- make buttons "pop" ;)
- remove handling of up & down on search results
---
 components/list/Account.vue                     | 1 +
 components/search/SearchWidget.vue              | 2 +-
 pages/[[server]]/list/[list]/index/accounts.vue | 9 ++-------
 3 files changed, 4 insertions(+), 8 deletions(-)

diff --git a/components/list/Account.vue b/components/list/Account.vue
index ff30c8e3..b00b805f 100644
--- a/components/list/Account.vue
+++ b/components/list/Account.vue
@@ -44,6 +44,7 @@ async function edit() {
         <button
           text-sm p2 border-1 transition-colors
           border-dark
+          bg-base
           btn-action-icon
           @click="edit"
         >
diff --git a/components/search/SearchWidget.vue b/components/search/SearchWidget.vue
index 2234e39f..4eadcec2 100644
--- a/components/search/SearchWidget.vue
+++ b/components/search/SearchWidget.vue
@@ -91,7 +91,7 @@ function activate() {
     </div>
     <!-- Results -->
     <div left-0 top-11 absolute w-full z-10 group-focus-within="pointer-events-auto visible" invisible pointer-events-none>
-      <div w-full bg-base border="~ base" rounded-3 max-h-100 overflow-auto py2>
+      <div w-full bg-base border="~ base" rounded-3 max-h-100 overflow-auto :class="results.length === 0 ? 'py2' : null">
         <span v-if="query.trim().length === 0" block text-center text-sm text-secondary>
           {{ t('search.search_desc') }}
         </span>
diff --git a/pages/[[server]]/list/[list]/index/accounts.vue b/pages/[[server]]/list/[list]/index/accounts.vue
index 2750c4c8..7edb499d 100644
--- a/pages/[[server]]/list/[list]/index/accounts.vue
+++ b/pages/[[server]]/list/[list]/index/accounts.vue
@@ -44,10 +44,6 @@ const results = computed(() => {
 // Reset index when results change
 watch([results, focused], () => index.value = -1)
 
-function shift(delta: number) {
-  return index.value = (index.value + delta % results.value.length + results.value.length) % results.value.length
-}
-
 function addAccount(account: mastodon.v1.Account) {
   try {
     mastoListAccounts.create({ accountIds: [account.id] })
@@ -101,8 +97,6 @@ function removeAccount(account: mastodon.v1.Account) {
           w-full
           placeholder-text-secondary
           :placeholder="$t('list.search_following_placeholder')"
-          @keydown.down.prevent="shift(1)"
-          @keydown.up.prevent="shift(-1)"
           @keydown.esc.prevent="inputRef?.blur()"
           @keydown.enter.prevent
         >
@@ -114,7 +108,7 @@ function removeAccount(account: mastodon.v1.Account) {
 
     <!-- Results -->
     <div left-0 top-18 absolute w-full z-10 group-focus-within="pointer-events-auto visible" invisible pointer-events-none>
-      <div w-full bg-base border="~ base" rounded-3 max-h-100 overflow-auto py2>
+      <div w-full bg-base border="~ dark" rounded-3 max-h-100 overflow-auto :class="results.length === 0 ? 'py2' : null">
         <span v-if="query.trim().length === 0" block text-center text-sm text-secondary>
           {{ $t('search.search_desc') }}
         </span>
@@ -137,6 +131,7 @@ function removeAccount(account: mastodon.v1.Account) {
                 text-sm p2 border-1 transition-colors
                 border-dark
                 btn-action-icon
+                bg-base
                 :hover="isInCurrentList(result.id) ? 'text-red' : 'text-green'"
                 @click=" () => isInCurrentList(result.id) ? removeAccount(result.data) : addAccount(result.data) "
               >