Resizing the Image component
Answered
Asiatic Lion posted this in #help-forum
Asiatic LionOP
I have this component right here:
<Image
id='gamp-logo'
width='125'
height='125'
src='/images/logo-black.png'
alt='Our logo'
/>
and I'd love to resize it a bit smaller after the searchStatus is changed. I'm using a click handler to change that so it's all alright. the thing is that the properties width and height, which are mandatory, in a Image component, are static. I can't change it with the className as I wish to do it like this:
className={
Hope I'm not confusing things too much.
<Image
id='gamp-logo'
width='125'
height='125'
src='/images/logo-black.png'
alt='Our logo'
/>
and I'd love to resize it a bit smaller after the searchStatus is changed. I'm using a click handler to change that so it's all alright. the thing is that the properties width and height, which are mandatory, in a Image component, are static. I can't change it with the className as I wish to do it like this:
className={
transition-width ${!searchStatus ? 'w-125' : 'w-100'}}Hope I'm not confusing things too much.
Answered by Asiatic Lion
thanks for the effort @Alligator mississippiensis I’ve found a solution using the img tag inside a picture tag
8 Replies
Alligator mississippiensis
ima try to help
gotta make myself feel better after failing miserably all of yesterday and this morning as well
something like this could work
id try it and if it doesnt dont blame me for wasting your time 🙂
im a python/c++ person
@Asiatic Lion
Asiatic LionOP
thanks for the effort @Alligator mississippiensis I’ve found a solution using the img tag inside a picture tag
Answer