make images look better

This commit is contained in:
Triston Armstrong 2024-10-05 13:11:53 -04:00
parent edd4719654
commit 32cd89a4d1

View File

@ -21,7 +21,6 @@ export function ImageCard({ key: itemKey, data: item }: ImageCard.ImageCardProps
function updateLocalStorage(time?: number) { function updateLocalStorage(time?: number) {
debounce(() => { debounce(() => {
console.log(itemKey, "updated storage")
localStorage.setItem("images", JSON.stringify(images.images.value)) localStorage.setItem("images", JSON.stringify(images.images.value))
}, time) }, time)
} }
@ -61,23 +60,20 @@ export function ImageCard({ key: itemKey, data: item }: ImageCard.ImageCardProps
className="select-none transition flex flex-col justify-stretch shadow-lg rounded border border-[#3c3c3c] absolute" className="select-none transition flex flex-col justify-stretch shadow-lg rounded border border-[#3c3c3c] absolute"
style={{ style={{
zIndex: `${focusedItem.value == itemKey ? LayerEnum.CARD_ELEVATED : LayerEnum.CARD}`, zIndex: `${focusedItem.value == itemKey ? LayerEnum.CARD_ELEVATED : LayerEnum.CARD}`,
width: `${item.dimensions.w}px`,
height: `${item.dimensions.h}px`,
top: `${item.position.y}px`, top: `${item.position.y}px`,
left: `${item.position.x}px`, left: `${item.position.x}px`,
maxWidth: '300px',
backgroundColor: '#181818' backgroundColor: '#181818'
}} }}
> >
<button className="text-md" onclick={(_e: Event) => { <button className="flex justify-center items-center hover:bg-blue-500 w-5 h-5 text-white text-md absolute right-0 top-0" onclick={(_e: Event) => {
ImagesSignal.default.removeImage(item.id) ImagesSignal.default.removeImage(item.id)
ImagesSignal.default.images.notify() ImagesSignal.default.images.notify()
updateLocalStorage() updateLocalStorage()
}}>x</button> }}>x</button>
<img <img
src={item.contents} src={item.contents}
width={'100%'}
height={'100%'}
alt={item.title} alt={item.title}
/> />
</div > </div >