vuetify icon indicating copy to clipboard operation
vuetify copied to clipboard

feat(VImg): fit content prop to adjust container size to image

Open eesayas opened this issue 8 months ago • 2 comments

Description

The rounded prop of VImage should apply regardless of container dimensions. A fit-content prop will resize the image container based on the image, eliminating the space and applying the rounded to the image as needed.

Issue Reported: https://discord.com/channels/340160225338195969/954061264865349652/1354127256988946432

Markup:

<template>
  <div class="h-25">
     <v-img
          fit-content
          rounded="lg"
          src="https://cdn.vuetifyjs.com/images/parallax/material.jpg"
       />
  </div>
</template>

eesayas avatar May 14 '25 08:05 eesayas

This doesn't really work if the image is larger than its container, now the rest is just cropped off instead of resizing to fit. It also doesn't respect aspect-ratio.

KaelWD avatar May 15 '25 10:05 KaelWD

This doesn't really work if the image is larger than its container, now the rest is just cropped off instead of resizing to fit. It also doesn't respect aspect-ratio.

I'll check when the image is larger. This doesn't work with aspect-ratio on purpose (is what I was thinking) it follows the image's aspect ratio. lmk

eesayas avatar May 17 '25 00:05 eesayas