Beiträge von Tom

/* WoltLab Blog Artikel Box */
#content {    
    .boxContent .blogEntryList {
        display: flex;
        @include screen-lg {
            .contentItemSingleColumn {
                flex-basis: calc(100% / 3 - 20px);
            }
        }
        @include screen-sm-md {
            .contentItemSingleColumn {
                flex-basis: calc(50% - 20px);
            }        
        }
        @include screen-xs {
            .contentItemSingleColumn {
                flex-basis: calc(100% - 20px);
            }        
        }        
        .contentItemLink {
            position: relative;
            .contentItemContent {
                position: absolute;
                bottom: 0;
                right: 0;
                left: 0;
                top: initial;
                background-color: rgba(0,0,0,0.5);
                backdrop-filter: blur(5px);
                -webkit-backdrop-filter: blur(5px);
                .contentItemTitle {
                    font-size: 14px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 2;
                }
                .contentItemCategory {
                    color: rgba(255,255,255,0.7);
                }
                .contentItemTitle {
                    color: #fff;
                }
                .contentItemDescription {
                    color: rgba(255,255,255,0.7);
                    white-space: nowrap;
                    font-size: 12px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 1;
                    text-align: left;
                    /* display: none; */ /* Optional um die Vorschau komplett auszublenden */
                    > p:first-child {
                        display: none;
                    }
                    > p:last-child {
                        display: none;
                    }
                }
            }
            .contentItemImageLarge {
                min-height: 175px; /* Höhe des Bildes ändern / Standard 150px */
            }
        }
        .contentItemOptions {
            display: none;
        }
    }
}

/* Modern Shoutbox - Alpha und Nexus */
.styleAlpha,
.styleNexus {
    .shoutbox {
        .shoutboxEntry {
            color: var(--wcfContentText);
        }
        .containerHeadline span {
            color: var(--wcfContentLink);
        }
        .containerHeadline small {
            color: var(--wcfContentDimmedText);
        }
        .shoutbox .shoutboxOptionDropdown button {
            background: var(--wcfButtonBackgroundActive);
        }
    }
}