Fixes skeleton height on view modes that does not display image.
This commit is contained in:
parent
c26340bc25
commit
654300743a
|
@ -399,7 +399,7 @@
|
|||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 12px;
|
||||
min-height: 54px;
|
||||
min-height: 24px;
|
||||
min-width: 22%;
|
||||
width: 22%; }
|
||||
.wp-block-tainacan-facets-list ul.facets-list.facets-layout-list li.facet-list-item a,
|
||||
|
|
|
@ -43,8 +43,8 @@
|
|||
v-for="facet in Number(maxFacetsNumber)"
|
||||
class="facet-list-item skeleton"
|
||||
:style="{
|
||||
marginBottom: layout == 'grid' ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
|
||||
height: layout == 'grid' ? '230px' : '54px'
|
||||
marginBottom: layout == 'grid' && ((metadatumType == 'Relationship' || metadatumType == 'Taxonomy') && showImage) ? (showName ? gridMargin + 12 : gridMargin) + 'px' : '',
|
||||
height: getSkeletonHeight()
|
||||
}" />
|
||||
</ul>
|
||||
<div v-else>
|
||||
|
@ -257,6 +257,21 @@ export default {
|
|||
this.isLoading = false;
|
||||
// console.log(error);
|
||||
});
|
||||
},
|
||||
getSkeletonHeight() {
|
||||
switch(this.layout) {
|
||||
case 'grid':
|
||||
if ((this.metadatumType == 'Relationship' || this.metadatumType == 'Taxonomy') && this.showImage)
|
||||
return '230px';
|
||||
else
|
||||
return '24px'
|
||||
case 'list':
|
||||
if ((this.metadatumType == 'Relationship' || this.metadatumType == 'Taxonomy') && this.showImage)
|
||||
return '54px';
|
||||
else
|
||||
return '24px'
|
||||
default: return '54px';
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
|
@ -319,7 +319,7 @@
|
|||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 12px;
|
||||
min-height: 54px;
|
||||
min-height: 24px;
|
||||
min-width: 22%;
|
||||
width: 22%;
|
||||
|
||||
|
|
Loading…
Reference in New Issue