Add CCSummary to single image view (when exporting)

src/assets/css/chat.scss

@@ -467,6 +467,10 @@ body {
     position: relative;
     max-width: 70%;
 
+    .bubble-inset {
+      padding: 8px 8px;
+    }
+
     @media #{map.get($display-breakpoints, 'sm-and-down')} {
       min-height: $min-touch-target;
     }
@@ -561,6 +565,10 @@ body {
     position: relative;
     max-width: 70%;
 
+    .bubble-inset {
+      padding: 8px 8px;
+    }
+
     @media #{map.get($display-breakpoints, 'sm-and-down')} {
       min-height: $min-touch-target;
     }

src/components/messages/composition/MessageImage.vue

@@ -5,6 +5,10 @@
     v-bind="{ ...$props, ...$attrs }"
     >
     <div class="bubble image-bubble" ref="imageRef">
+      <div class="bubble-inset" v-if="attachment?.proofHintFlags">
+        <CCSummary :multiple="false" :flags="attachment.proofHintFlags ? [attachment.proofHintFlags] : []" />
+      </div>
+
       <ImageWithProgress v-if="attachment"
         :aspect-ratio="16 / 9"
         ref="image"
@@ -32,6 +36,7 @@ import { MessageProps, useMessage } from "./useMessage";
 import { EventAttachment } from "../../../models/eventAttachment";
 import { useDisplay } from "vuetify";
 import Hammer from "hammerjs";
+import CCSummary from "../../content-credentials/CCSummary.vue";
 
 const { t } = useI18n()
 const $matrix: any = inject('globalMatrix');

src/components/messages/composition/MessageThread.vue

@@ -260,10 +260,6 @@ const layoutedItems = computed(() => {
   overflow: hidden;
 }
 
-.bubble-inset {
-  padding: 8px 8px;
-}
-
 .imageCollection {
   width: unset;
   max-width: unset;