Improve details placeholders

This commit is contained in:
grandeljay 2022-12-11 13:00:04 +01:00
parent 093e825edd
commit 4ecb912233
2 changed files with 20 additions and 2 deletions

View file

@ -7,10 +7,28 @@
max-width: 100%; max-width: 100%;
max-height: 40vh; max-height: 40vh;
} }
@media (min-width: 768px) { @media (min-width: 768px) {
.ui.modal.wish-details .wish-image { .ui.modal.wish-details .wish-image {
max-width: 40%; max-width: 40%;
max-height: 100%; max-height: 100%;
} }
} }
.ui.modal.wish-details .wish-image:has(.ui.placeholder) {
height: 40vh;
}
@media (min-width: 768px) {
.ui.modal.wish-details .wish-image:has(.ui.placeholder) {
width: 40%;
}
}
/** Placeholder */
.ui.modal.wish-details .wish-image .ui.placeholder {
height: 100%;
}
/** Description */
.ui.modal.wish-details .wish-image:has(.ui.placeholder) + .description {
padding-left: 2em;
}

View file

@ -227,7 +227,7 @@ namespace wishthis;
<div class="scrolling image content"> <div class="scrolling image content">
<div class="wish-image"> <div class="wish-image">
<div class="ui placeholder"> <div class="ui fluid placeholder">
<div class="image"></div> <div class="image"></div>
</div> </div>
</div> </div>