ui fixes

src/components/IssueContent.vue

@@ -30,19 +30,13 @@ const cancel = () => {
 <template>
   <div class="issue-content">
     <template v-if="!editing">
-      <v-hover #default="{ isHovering, props }">
-        <v-sheet
-          v-bind="props"
-          :class="isHovering ? 'px-0' : 'px-0'"
-          class="cursor-pointer d-flex ga-1"
-          @click="startEdit"
-        >
+
+        <v-sheet v-bind="props" border class="cursor-pointer d-flex ga-1 pa-4" @click="startEdit">
           <div class="content-sheet">
             {{ text ?? 'click to add content' }}
           </div>
-          <v-icon v-if="isHovering" icon="mdi-pencil" size="small" />
         </v-sheet>
-      </v-hover>
+
     </template>
 
     <template v-else>
@@ -58,12 +52,8 @@ const cancel = () => {
       />
 
       <div class="d-flex justify-end ga-1">
-        <v-btn density="compact" icon variant="text" @click="cancel">
-          <v-icon icon="mdi-cancel" />
-        </v-btn>
-        <v-btn density="compact" icon color="primary" variant="flat" @click="save">
-          <v-icon icon="mdi-check" />
-        </v-btn>
+        <v-btn density="compact" prepend-icon="mdi-cancel" text="Cancel" variant="text" @click="cancel" />
+        <v-btn density="compact" prepend-icon="mdi-check" color="primary" variant="flat" @click="save" text="Save" />
       </div>
     </template>
   </div>
@@ -75,10 +65,6 @@ const cancel = () => {
   overflow-wrap: anywhere;
 }
 
-//.content-sheet:hover {
-//background-color: rgba(var(--v-theme-on-surface), 0.06);
-//}
-
 .v-sheet {
   transition: padding 0.2s ease-in-out;
 }