enhance farm details UI (#211)

* change stellar field ui * enhance farm details ui
threefoldtech · May 7, 2023 · f8534fa · f8534fa
1 parent d5f00a9
commit f8534fa
Showing 1 changed file with 14 additions and 11 deletions.
diff --git a/packages/dashboard/src/portal/views/Farms.vue b/packages/dashboard/src/portal/views/Farms.vue
@@ -123,16 +123,18 @@
                 <v-flex class="text-left">Stellar Payout Address</v-flex>
               </v-col>
               <v-col v-if="item.v2address">
-                <v-row
-                  class="d-flex align-baseline justify-between"
-                  style="text-overflow: ellipsis; white-space: nowrap; overflow: hidden"
-                >
-                  <v-row style="margin: 0">
-                    <span style="font-size: small">
-                      {{ item.v2address }}
-                    </span>
-                  </v-row>
-                  <v-btn x-small @click="openV2AddressDialog = true">Edit</v-btn>
+                <v-row class="d-flex align-baseline justify-between pl-3">
+                  <v-text-field
+                    outlined
+                    class="pt-1 text-caption"
+                    dense
+                    hide-details
+                    :value="item.v2address"
+                    :readonly="!!item.v2address"
+                    :append-icon="'mdi-pencil'"
+                    @click:append="openV2AddressDialog = true"
+                  >
+                  </v-text-field>
                 </v-row>
               </v-col>
               <v-col v-else>
@@ -175,12 +177,13 @@
               </v-col>
               <v-col>
                 <v-flex>
-                  <v-btn x-small v-bind:href="'https://v3.bootstrap.grid.tf/'" target="blank">view bootstrap</v-btn>
+                  <v-btn small v-bind:href="'https://v3.bootstrap.grid.tf/'" target="blank">view bootstrap</v-btn>
                 </v-flex>
               </v-col>
             </v-row>
 
             <PublicIPTable
+              class="pt-4"
               :ips="item.publicIps"
               :deleteIP="deletePublicIP"
               :loadingDelete="loadingDeleteIP"