78 lines
1.3 KiB
CSS
78 lines
1.3 KiB
CSS
#stickers ul.list > li > img.sticker {
|
|
padding: 0.25rem;
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#stickers {
|
|
padding: 1rem;
|
|
}
|
|
|
|
#stickers ul.list > li:hover {
|
|
cursor: pointer;
|
|
}
|
|
|
|
#stickers ul.list > li.block:not(.large) {
|
|
transition: all 100ms ease-in;
|
|
transform: scale(1);
|
|
padding: 0;
|
|
}
|
|
|
|
#stickers ul.list > li.block.zoomed {
|
|
transform: scale(1.3);
|
|
z-index: 2;
|
|
}
|
|
|
|
#gifs + div ul.tabs,
|
|
#stickers + div ul.tabs {
|
|
height: 6rem;
|
|
border-bottom: none;
|
|
}
|
|
|
|
#gifs {
|
|
height: calc(100% - 7.5rem);
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
#gifs .masonry {
|
|
width: calc(50% - 1.75rem);
|
|
float: left;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
#gifs .masonry.first {
|
|
margin-left: 1rem;
|
|
margin-right: 0.75rem;
|
|
}
|
|
|
|
#gifs .masonry.second {
|
|
margin-right: 1rem;
|
|
margin-left: 0.75rem;
|
|
}
|
|
|
|
#gifs .masonry.first:not(:empty) + .masonry.second:not(:empty) + .placeholder {
|
|
display: none;
|
|
}
|
|
|
|
#gifs .masonry .brick {
|
|
width: 100%;
|
|
max-height: 40rem;
|
|
display: inline-block;
|
|
object-fit: cover;
|
|
border-radius: 1rem;
|
|
margin-bottom: 1rem;
|
|
background-color: rgb(var(--movim-background));
|
|
transition: box-shadow 0.3s ease-in-out;
|
|
}
|
|
|
|
#gifs .masonry .brick.clicked {
|
|
opacity: 0.5;
|
|
pointer-events: none;
|
|
box-shadow: var(--elevation-0);
|
|
}
|
|
|
|
#gifs .masonry .brick:hover {
|
|
cursor: pointer;
|
|
box-shadow: var(--elevation-1);
|
|
}
|