Show the alt text on the thumbnail and drop the file-size badge

lang/ar/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'تحرير النص البديل',
             'placeholder' => 'صف هذه الصورة للأشخاص الذين يستخدمون برامج قراءة الشاشة',
             'hint' => 'يُنشر على المنصات التي تدعم أوصاف الصور.',
-            'badge' => 'ALT',
             'save' => 'حفظ',
         ],
 

lang/de/posts.php

@@ -385,7 +385,6 @@
             'edit' => 'Alternativtext bearbeiten',
             'placeholder' => 'Beschreibe dieses Bild für Menschen, die Screenreader verwenden',
             'hint' => 'Wird auf Plattformen veröffentlicht, die Bildbeschreibungen unterstützen.',
-            'badge' => 'ALT',
             'save' => 'Speichern',
         ],
 

lang/el/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Επεξεργασία εναλλακτικού κειμένου',
             'placeholder' => 'Περιγράψτε αυτήν την εικόνα για άτομα που χρησιμοποιούν προγράμματα ανάγνωσης οθόνης',
             'hint' => 'Δημοσιεύεται σε πλατφόρμες που υποστηρίζουν περιγραφές εικόνων.',
-            'badge' => 'ALT',
             'save' => 'Αποθήκευση',
         ],
 

lang/en/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Edit alt text',
             'placeholder' => 'Describe this image for people using screen readers',
             'hint' => 'Published to platforms that support image descriptions.',
-            'badge' => 'ALT',
             'save' => 'Save',
         ],
 

lang/es/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Editar texto alternativo',
             'placeholder' => 'Describe esta imagen para las personas que usan lectores de pantalla',
             'hint' => 'Se publica en las plataformas que admiten descripciones de imágenes.',
-            'badge' => 'ALT',
             'save' => 'Guardar',
         ],
 

lang/fr/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Modifier le texte alternatif',
             'placeholder' => 'Décrivez cette image pour les personnes utilisant un lecteur d\'écran',
             'hint' => 'Publié sur les plateformes qui prennent en charge les descriptions d\'images.',
-            'badge' => 'ALT',
             'save' => 'Enregistrer',
         ],
 

lang/it/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Modifica testo alternativo',
             'placeholder' => 'Descrivi questa immagine per le persone che usano screen reader',
             'hint' => 'Pubblicato sulle piattaforme che supportano le descrizioni delle immagini.',
-            'badge' => 'ALT',
             'save' => 'Salva',
         ],
 

lang/ja/posts.php

@@ -383,7 +383,6 @@
             'edit' => '代替テキストを編集',
             'placeholder' => 'スクリーンリーダーを使用する人のためにこの画像を説明してください',
             'hint' => '画像の説明に対応しているプラットフォームに公開されます。',
-            'badge' => 'ALT',
             'save' => '保存',
         ],
 

lang/ko/posts.php

@@ -383,7 +383,6 @@
             'edit' => '대체 텍스트 편집',
             'placeholder' => '화면 낭독 프로그램을 사용하는 사람들을 위해 이 이미지를 설명하세요',
             'hint' => '이미지 설명을 지원하는 플랫폼에 게시됩니다.',
-            'badge' => 'ALT',
             'save' => '저장',
         ],
 

lang/nl/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Alt-tekst bewerken',
             'placeholder' => 'Beschrijf deze afbeelding voor mensen die schermlezers gebruiken',
             'hint' => 'Wordt gepubliceerd op platforms die afbeeldingsbeschrijvingen ondersteunen.',
-            'badge' => 'ALT',
             'save' => 'Opslaan',
         ],
 

lang/pl/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Edytuj tekst alternatywny',
             'placeholder' => 'Opisz ten obraz dla osób korzystających z czytników ekranu',
             'hint' => 'Publikowany na platformach obsługujących opisy obrazów.',
-            'badge' => 'ALT',
             'save' => 'Zapisz',
         ],
 

lang/pt-BR/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Editar texto alternativo',
             'placeholder' => 'Descreva esta imagem para pessoas que usam leitores de tela',
             'hint' => 'Publicado nas plataformas que oferecem suporte a descrições de imagem.',
-            'badge' => 'ALT',
             'save' => 'Salvar',
         ],
 

lang/ru/posts.php

@@ -383,7 +383,6 @@
             'edit' => 'Изменить альтернативный текст',
             'placeholder' => 'Опишите это изображение для людей, использующих программы чтения с экрана',
             'hint' => 'Публикуется на платформах, поддерживающих описания изображений.',
-            'badge' => 'ALT',
             'save' => 'Сохранить',
         ],
 

lang/tr/posts.php

@@ -385,7 +385,6 @@
             'edit' => 'Alternatif metni düzenle',
             'placeholder' => 'Ekran okuyucu kullanan kişiler için bu görseli açıklayın',
             'hint' => 'Görsel açıklamalarını destekleyen platformlarda yayınlanır.',
-            'badge' => 'ALT',
             'save' => 'Kaydet',
         ],
 

lang/zh/posts.php

@@ -383,7 +383,6 @@
             'edit' => '编辑替代文本',
             'placeholder' => '为使用屏幕阅读器的用户描述此图片',
             'hint' => '发布到支持图片描述的平台。',
-            'badge' => 'ALT',
             'save' => '保存',
         ],
 

resources/js/components/posts/editor/PostEditorComposer.vue

@@ -23,7 +23,6 @@ import MediaPickerDialog from '@/components/posts/MediaPickerDialog.vue';
 import SignaturesModal from '@/components/posts/SignaturesModal.vue';
 import { Popover, PopoverAnchor, PopoverContent } from '@/components/ui/popover';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
-import { formatBytes } from '@/composables/useMedia';
 import { getPlatformLabel, getPlatformLogo } from '@/composables/usePlatformLogo';
 import date from '@/date';
 import { classify, isDocument, isImage, isVideo, MediaType } from '@/lib/mediaType';
@@ -283,7 +282,7 @@ const onAltTextSave = (value: string): void => {
 
                         <div class="pointer-events-none absolute inset-x-0 bottom-0 h-12 bg-gradient-to-t from-black/60 to-transparent opacity-0 transition-opacity group-hover:opacity-100" />
 
-                        <div class="absolute bottom-1.5 left-1.5 flex flex-col items-start gap-1 text-[10px] font-medium text-white">
+                        <div class="pointer-events-none absolute inset-x-1.5 bottom-1.5 flex flex-col items-start gap-1 text-[10px] font-medium text-white">
                             <span
                                 v-if="isVideo(item) && item.meta?.duration"
                                 class="inline-flex items-center gap-0.5 rounded-md bg-black/65 px-1.5 py-0.5 backdrop-blur-sm"
@@ -291,18 +290,13 @@ const onAltTextSave = (value: string): void => {
                                 <IconVideo class="size-2.5" />
                                 {{ date.formatClock(item.meta.duration) }}
                             </span>
-                            <span
-                                v-if="item.size"
-                                class="inline-flex rounded-md bg-black/65 px-1.5 py-0.5 backdrop-blur-sm"
-                            >
-                                {{ formatBytes(item.size) }}
-                            </span>
                             <span
                                 v-if="isImage(item) && item.meta?.alt_text"
-                                class="inline-flex rounded-md bg-black/65 px-1.5 py-0.5 font-bold tracking-wider backdrop-blur-sm"
+                                class="inline-flex max-w-full items-center gap-0.5 rounded-md bg-black/65 px-1.5 py-0.5 backdrop-blur-sm"
                                 data-testid="alt-text-badge"
                             >
-                                {{ $t('posts.edit.alt_text.badge') }}
+                                <IconAlt class="size-2.5 shrink-0" />
+                                <span class="truncate">{{ item.meta.alt_text }}</span>
                             </span>
                         </div>