Browse Source

Maintenance: Desktop view - See more and article actions without distance

Benjamin Scharf 2 weeks ago
parent
commit
d279f7393e

+ 1 - 1
app/frontend/apps/desktop/pages/ticket/components/TicketDetailView/ArticleBubble/ArticleBubble.vue

@@ -149,7 +149,7 @@ const { showPreview } = useFilePreviewViewer(
       <ArticleBubbleBody
         tabindex="0"
         :data-test-id="`article-bubble-body-${article.internalId}`"
-        class="last:rounded-b-xl focus:outline-hidden focus-visible:-outline-offset-2 focus-visible:outline-blue-800"
+        class="last:rounded-b-xl focus:outline-hidden focus-visible:outline focus-visible:-outline-offset-1 focus-visible:outline-blue-800"
         :class="[
           bodyClasses,
           {

+ 2 - 2
app/frontend/apps/desktop/pages/ticket/components/TicketDetailView/ArticleBubble/ArticleBubbleActionList.vue

@@ -137,12 +137,12 @@ const actions = computed(() => {
       class="order-1 flex items-center"
       :class="{
         '-order-1!': position === 'right',
-        'opacity-0 transition-opacity group-hover/article:opacity-100':
+        'opacity-0 transition-opacity group-hover/article:opacity-100 focus-within:opacity-100':
           !isTouchDevice,
       }"
     >
       <CommonButton
-        class="px-1 py-0.5! text-xs!"
+        class="px-1 py-0.5! text-xs! focus-visible:outline-offset-0! focus-visible:outline-blue-800!"
         :class="[buttonVariantClassExtension]"
         :prefix-icon="action.icon"
         size="large"

+ 5 - 5
app/frontend/apps/desktop/pages/ticket/components/TicketDetailView/ArticleBubble/ArticleBubbleBody.vue

@@ -10,8 +10,6 @@ import { type ImageViewerFile } from '#shared/composables/useImageViewer.ts'
 import type { TicketArticle } from '#shared/entities/ticket/types.ts'
 import { textToHtml } from '#shared/utils/helpers.ts'
 
-import CommonButton from '#desktop/components/CommonButton/CommonButton.vue'
-
 interface Props {
   article: TicketArticle
   showMetaInformation: boolean
@@ -119,15 +117,17 @@ onMounted(() => {
         BubbleGradient: hasShowMore && !shownMore,
       }"
     />
-    <CommonButton
+    <CommonLink
       v-if="hasShowMore"
-      class="p-0! outline-transparent!"
+      class="mb-1 inline-block! outline-transparent! hover:no-underline! focus-visible:outline-blue-800!"
+      role="button"
+      link="#"
       size="medium"
       @click.prevent="toggleShowMore"
       @keydown.enter.prevent="toggleShowMore"
     >
       {{ shownMore ? $t('See less') : $t('See more') }}
-    </CommonButton>
+    </CommonLink>
   </div>
 </template>
 

+ 1 - 1
i18n/zammad.pot

@@ -1987,7 +1987,7 @@ msgstr ""
 msgid "Author"
 msgstr ""
 
-#: app/frontend/apps/desktop/pages/ticket/components/TicketDetailView/ArticleBubble/ArticleBubbleBody.vue:94
+#: app/frontend/apps/desktop/pages/ticket/components/TicketDetailView/ArticleBubble/ArticleBubbleBody.vue:92
 msgid "Author name and article creation date"
 msgstr ""