47 lines
961 B
CSS
47 lines
961 B
CSS
|
|
.block-preview {
|
|
/*border: black 1px solid;*/
|
|
box-shadow: 0px 0px 2px 0px #000000;
|
|
width: min(25em, calc(100vw - 2em));
|
|
height: 20em;
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.block-preview:hover, .block-preview.toggled {
|
|
box-shadow: 0px 0px 4px 0px #000000;
|
|
}
|
|
|
|
.block-preview .label {
|
|
transition: max-height 0.15s ease-in;
|
|
max-height: 20%;
|
|
overflow: hidden;
|
|
bottom: 0;
|
|
background-color: #FFFFFFDD;
|
|
padding: 0.5em;
|
|
bottom: 0;
|
|
}
|
|
|
|
.block-preview:hover .label, .block-preview.toggled .label {
|
|
max-height: 100%;
|
|
height: calc(100% - 1em);
|
|
}
|
|
|
|
.block-preview .label .show-on-hover {
|
|
display: none;
|
|
transition: opacity 0.15s;
|
|
opacity: 0;
|
|
max-height: 0;
|
|
background: none;
|
|
}
|
|
|
|
.block-preview:hover .label .show-on-hover, .block-preview.toggled .label .show-on-hover {
|
|
display: block;
|
|
opacity: 1;
|
|
max-height: 100%;
|
|
}
|
|
|
|
.padding-container {
|
|
padding: 1em;
|
|
}
|