clonegur/frontend/src/app/images/images.component.scss

55 lines
1.0 KiB
SCSS

.images {
display: block;
width: min(100%, 85rem);
margin: auto;
gap: 5rem;
align-items: stretch;
box-sizing: border-box;
padding: 0 1rem;
text-align: center;
.image {
user-select: none;
img {
pointer-events: none;
height: 15rem;
display: block;
}
width: min-content;
border-radius: 1rem;
box-shadow: .25rem .25rem 1rem -.5rem #000;
padding: 1rem;
box-sizing: border-box;
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 1rem;
margin: 1rem;
p, h3, h5 {
padding: 0;
margin: 0;
}
h3, h5 {
text-align: center;
}
p {
text-align: justify;
}
}
}
@media screen and (width < 50rem) {
.images {
display: flex;
flex-direction: column;
gap: 5rem;
align-items: stretch;
.image {
width: 100%;
}
}
}