fix: button style in ComplexKey (#1406)

Signed-off-by: Hristiyan <[email protected]> Co-authored-by: John Bair <[email protected]>
hashgraph · Jan 2, 2025 · 2f66f45 · 2f66f45
1 parent 3fbacb0
commit 2f66f45
Showing 1 changed file with 16 additions and 13 deletions.
diff --git a/front-end/src/renderer/components/ComplexKey/ComplexKeyAddPublicKeyModal.vue b/front-end/src/renderer/components/ComplexKey/ComplexKeyAddPublicKeyModal.vue
@@ -154,19 +154,22 @@ function filterKeyList(keyList: { publicKey: string; nickname: string | null }[]
         <hr class="separator my-5" />
 
         <template v-if="isLoggedInOrganization(user.selectedOrganization)">
-          <div class="btn-group d-flex justify-content-between">
-            <template v-for="kt in KeyTab" :key="kt">
-              <AppButton
-                @click="handleKeyTabChange(kt)"
-                :class="{ active: currentTab === kt }"
-                color="secondary"
-                type="button"
-                data-testid="tab-keys-my"
-                >{{ kt }}</AppButton
-              >
-            </template>
-          </div></template
-        >
+          <div class="btn-group-container" role="group">
+            <div class="btn-group d-flex justify-content-between gap-3">
+              <template v-for="kt in KeyTab" :key="kt">
+                <AppButton
+                  class="rounded-3 text-nowrap"
+                  @click="handleKeyTabChange(kt)"
+                  :class="{ active: currentTab === kt, 'text-body': currentTab !== kt }"
+                  :color="currentTab === kt ? 'primary' : undefined"
+                  type="button"
+                  data-testid="tab-keys-my"
+                  >{{ kt }}</AppButton
+                >
+              </template>
+            </div>
+          </div>
+        </template>
         <div>
           <template v-if="listedKeyList.length > 0">
             <div class="overflow-auto mt-4" :style="{ height: '35vh' }">