Files
5chan/src/components/catalog-row/catalog-row.module.css
T

142 lines
2.4 KiB
CSS

.row {
display: flex;
flex-direction: row;
justify-content: center;
text-align: center;
padding-top: 20px;
}
.post {
width: 180px;
position: relative;
max-height: 320px;
padding: 10px 0 3px 0;
vertical-align: top;
display: inline-block;
overflow: hidden;
}
.hidden {
opacity: 0.5;
}
.blackThumbnail {
width: 150px;
height: 150px;
background-color: black;
display: inline-block;
}
.mediaPaddingWrapper {
padding-bottom: 5px;
display: inline-flex;
position: relative;
}
.threadIcons {
position: absolute;
top: 2px;
right: 2px;
}
.threadIcons span {
width: 16px;
height: 16px;
display: inline-block;
border: none;
background-repeat: no-repeat;
background-position: center;
image-rendering: pixelated;
}
.threadIcons .stickyIcon {
background-image: url("/public/assets/icons/sticky.gif");
}
.threadIcons .closedIcon {
background-image: url("/public/assets/icons/closed.gif");
}
.mediaWrapper {
background-color: var(--media-thumbnail-background-color);
width: var(--width);
height: var(--height);
display: inline-flex;
justify-content: center;
align-items: center;
}
.post img, .post video, .post audio {
box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
max-width: 150px;
max-height: 150px;
}
.meta {
font-size: 11px;
line-height: 8px;
padding: 2px 0 1px 0;
}
.teaser {
display: block;
padding: 0 15px;
overflow: hidden;
word-wrap: break-word;
}
.post a {
color: unset;
text-decoration: none;
}
.post .postMenu {
visibility: hidden;
}
.postMenuVisible {
visibility: visible !important;
}
.loadingSkeleton {
width: 150px;
height: 150px;
display: inline-block;
}
.fileDeleted {
image-rendering: pixelated;
}
.postPreview {
background-color: var(--catalog-post-preview-background-color);
border-radius: 3px;
padding: 5px 8px 4px;
z-index: 100000;
word-wrap: break-word;
white-space: pre-line;
max-width: 500px;
color: var(--catalog-post-preview-color);
font-family: arial, helvetica, sans-serif;
font-size: 10pt;
}
.postPreview .postSubject {
font-weight: 700;
color: var(--catalog-post-preview-subject-color);
}
.postPreview .postAuthor {
color: var(--catalog-post-preview-author-color);
font-weight: 700;
}
.postPreview .postLast {
color: var(--catalog-post-preview-last-color);
font-size: 90%;
margin-top: 3px;
}
.postPreview .capcode {
color: var(--catalog-post-preview-author-capcode-color);
}