Adds focused and located state for items list. #693.
This commit is contained in:
parent
33902428a8
commit
3a6199f975
|
@ -1406,7 +1406,11 @@
|
|||
:data-tainacan-item-id="item.id"
|
||||
v-for="(item, index) of items">
|
||||
<div
|
||||
:class="{ 'selected-record': getSelectedItemChecked(item.id) == true }"
|
||||
:class="{
|
||||
'selected-record': getSelectedItemChecked(item.id) == true,
|
||||
'non-located-item': !itemsLocations.some(anItemLocation => anItemLocation.item.id == item.id),
|
||||
'non-focused-item': selectedMarkerIndexes.length && selectedMarkerIndexes.findIndex((aSelectedMarkerIndex) => itemsLocations[aSelectedMarkerIndex].item.id == item.id) < 0
|
||||
}"
|
||||
class="tainacan-record">
|
||||
<!-- Checkbox -->
|
||||
<!-- TODO: Remove v-if="collectionId" from this element when the bulk edit in repository is done -->
|
||||
|
|
|
@ -26,6 +26,20 @@
|
|||
.tainacan-record {
|
||||
margin-bottom: 0.125rem;
|
||||
max-width: 100%;
|
||||
opacity: 1.0;
|
||||
transition: 1.0;
|
||||
|
||||
&.non-located-item {
|
||||
opacity: 0.35;
|
||||
}
|
||||
&.non-focused-item {
|
||||
opacity: 0.5;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
.tainacan-record-item-thumbnail,
|
||||
img {
|
||||
|
|
Loading…
Reference in New Issue