[ui] Remove main identity star icon

Removes the star icon that marked an identity as the
main one and replaces it with a darker background for
the uuid chip.

Signed-off-by: Eva Millán <evamillan@bitergia.com>

releases/unreleased/less-distracting-main-identity-indicator.yml

@@ -0,0 +1,10 @@
+---
+title: Less distracting main identity indicator
+category: added
+author: Eva Millán <evamillan@bitergia.com>
+issue: 920
+notes: >
+  The star icon that marked an individual's main identity
+  was distracting and potentially misleading for users.
+  It has changed to a more subtle indicator since it is not
+  relevant for most users.

ui/src/components/Identity.vue

@@ -1,30 +1,30 @@
 <template>
   <v-row class="d-flex align-center flex-nowrap" no-gutters>
     <v-col class="uuid d-flex align-center">
-      <v-tooltip open-delay="100" bottom>
-        <template v-slot:activator="{ props }">
-          <v-chip
-            class="text-center"
-            :class="{ 'mr-6': !isMain }"
-            v-bind="props"
-            variant="outlined"
-            @click="copy(uuid)"
-            @mouseenter="resetCopyText"
-          >
-            <span class="clip">{{ uuid }}</span>
-            <v-icon size="small" end>mdi-content-copy</v-icon>
-          </v-chip>
-        </template>
-        <span>{{ tooltip }}</span>
-      </v-tooltip>
-      <v-tooltip v-if="isMain" bottom>
-        <template v-slot:activator="{ props }">
-          <v-icon v-bind="props" color="secondary" size="small" end>
-            mdi-star
-          </v-icon>
-        </template>
-        <span>Main identity</span>
-      </v-tooltip>
+      <v-chip
+        class="text-center pr-2"
+        :class="{ 'v-chip--border': isMain }"
+        :variant="isMain ? 'tonal' : 'outlined'"
+      >
+        <span class="clip mr-1">{{ uuid }}</span>
+        <span v-if="isMain" class="d-sr-only">
+          Main identity
+        </span>
+        <v-tooltip open-delay="100" location="bottom">
+          <template v-slot:activator="{ props }">
+            <v-btn
+              v-bind="props"
+              density="comfortable"
+              icon="mdi-content-copy"
+              size="small"
+              variant="text"
+              @click="copy(uuid)"
+              @mouseenter="resetCopyText"
+            />
+          </template>
+          <span>{{ tooltip }}</span>
+        </v-tooltip>
+      </v-chip>
     </v-col>
     <v-col class="ma-2" md="2">
       <span>{{ name }}</span>
@@ -118,4 +118,8 @@ export default {
 .v-tooltip__content {
   font-size: 12px;
 }
+
+:deep(.v-chip--variant-tonal) .v-chip__underlay {
+  opacity: 0.04;
+}
 </style>