UX: improve attribution display, add magnifying class

src/UI/Image/LinkableImage.svelte

@@ -14,6 +14,8 @@
   import AttributedImage from "./AttributedImage.svelte"
   import SpecialTranslation from "../Popup/TagRendering/SpecialTranslation.svelte"
   import LoginToggle from "../Base/LoginToggle.svelte"
+  import ImagePreview from "./ImagePreview.svelte"
+  import FloatOver from "../Base/FloatOver.svelte"
 
   export let tags: UIEventSource<OsmTags>
   export let state: SpecialVisualizationState
@@ -31,7 +33,7 @@
     key: undefined,
     provider: AllImageProviders.byName(image.provider),
     date: new Date(image.date),
-    id: Object.values(image.osmTags)[0],
+    id: Object.values(image.osmTags)[0]
   }
 
   async function applyLink(isLinked: boolean) {
@@ -42,7 +44,7 @@
     if (isLinked) {
       const action = new LinkImageAction(currentTags.id, key, url, tags, {
         theme: tags.data._orig_theme ?? state.layout.id,
-        changeType: "link-image",
+        changeType: "link-image"
       })
       await state.changes.applyAction(action)
     } else {
@@ -51,24 +53,26 @@
         if (v === url) {
           const action = new ChangeTagAction(currentTags.id, new Tag(k, ""), currentTags, {
             theme: tags.data._orig_theme ?? state.layout.id,
-            changeType: "remove-image",
+            changeType: "remove-image"
           })
           state.changes.applyAction(action)
         }
       }
     }
   }
+
   isLinked.addCallback((isLinked) => applyLink(isLinked))
+
 </script>
 
-<div class="flex w-fit shrink-0 flex-col">
-  <div class="cursor-zoom-in" on:click={() => state.previewedImage.setData(providedImage)}>
-    <AttributedImage
-      image={providedImage}
-      imgClass="max-h-64 w-auto"
-      previewedImage={state.previewedImage}
-    />
-  </div>
+<div class="flex w-fit shrink-0 flex-col rounded-lg overflow-hidden" class:border-interactive={$isLinked}
+     style="border-width: 2px">
+  <AttributedImage
+    image={providedImage}
+    imgClass="max-h-64 w-auto"
+    previewedImage={state.previewedImage}
+    attributionFormat="minimal"
+  />
   <LoginToggle {state} silentFail={true}>
     {#if linkable}
       <label>