Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2024-11-15 12:50:01 +00:00
Code Issues Projects Releases Packages Wiki Activity

web/PickerItem: always show type badge, prevent right click on video

Browse source 
- fixed type badge centering in webkit
- increased border radius of type badge to match icons inside it
This commit is contained in:
wukko 2024-07-22 16:14:26 +06:00
parent c03337fed9
commit b0a69f9944
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
1 changed files with 15 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
web/src/components/dialog/PickerItem.svelte
View file

@ -26,21 +26,20 @@
downloadFile(item.url); downloadFile(item.url);
}} }}
> >
{#if item.type} <div class="picker-type">
<div class="picker-type"> {#if itemType === "video"}
{#if item.type === "video"} <IconMovie />
<IconMovie /> {:else}
{:else if item.type === "photo"} <IconPhoto />
<IconPhoto /> {/if}
{/if} </div>
</div>
{/if}
<img <img
class="picker-image" class="picker-image"
src={item.thumb ? item.thumb : item.url} src={item.thumb ? item.thumb : item.url}
class:loading={!imageLoaded} class:loading={!imageLoaded}
class:video-thumbnail={item.thumb}
on:load={() => (imageLoaded = true)} on:load={() => (imageLoaded = true)}
alt="{$t(`a11y.dialog.picker.item.${itemType}`)} {number}" alt="{$t(`a11y.dialog.picker.item.${itemType}`)} {number}"
@ -77,6 +76,10 @@
opacity: 0.8; opacity: 0.8;
} }
.picker-image.video-thumbnail {
pointer-events: none;
}
@media (hover: hover) { @media (hover: hover) {
.picker-item:hover .picker-image { .picker-item:hover .picker-image {
opacity: 0.8; opacity: 0.8;
@ -99,13 +102,13 @@
top: 6px; top: 6px;
left: 6px; left: 6px;
border-radius: 4px; border-radius: 6px;
pointer-events: none; pointer-events: none;
} }
.picker-type :global(svg) { .picker-type :global(svg) {
width: 21px; width: 22px;
height: 21px; height: 22px;
} }
</style> </style>