CSS Hilfe benötigt / Farbe für einen spezifischen Bereich ändern

Erazor · Dec 29th 2017

Hallo zusammen,

Ich versuche seit fast 2h die Hintergrundfarbe für den im angehängten Screenshot markierten Bereich zu ändern, finde aber im ACP nirgendwo den entsprechenden Bereich.

Ich vermute deshalb dass dieser per CSS überschrieben wird, wer kann mir sagen wo sich der entsprechende Farbcode für diesen Bereich befindet?

CSS

/* Global Border-Radius --- Globale Abrundung 3px */
$borderRadius:                        3px;

/* Logo-Width --- Logo-Breite 250px */
$logoWidth:                            200px;

/* Mainmenu Height --- Höhe Menü 80px */
$mainMenuHeight:                    200px;

/* Header Height --- Header Höhe 80px */
$mainHeaderHeight:                    20px;

/* Width Messagesidebar / Requiered min. width: 180px */
$messageSidebarWidth:                158px;

/* Layout */

@media (min-width: 1025px) {

    .pageHeaderPanel {
        position: relative;
    }

    #pageHeaderPanel {
        position: absolute;
        background-color: rgba(0,0,0,0);
        height: $mainMenuHeight;
        z-index: 301;
    }

    #pageHeaderPanel > .layoutBoundary {
        align-items: center;
        height: $mainMenuHeight;
    }

    #pageHeaderFacade {
        height: $mainHeaderHeight;
    }

    .pageHeaderLogo {
        margin-right: 20px;
        min-width: $logoWidth;
        flex: 1 1 auto;
        overflow: hidden;
    }
    
    .pageHeaderLogo > a {
        display: inline-block;
    }

    .mainMenu {
        height: 40px;
        flex: 0 1 auto;
    }

    
    .headerContentMessage {
        flex: 1 1 auto;
        height:50px;
    }
    
    .pageHeaderContainer {
        padding-top: $mainMenuHeight;
    }
    
    html, 
    body {
        height: inherit;
    }

    .pageFooterCopyright {
        padding: 20px 0 50px;
    }    
    
    .pageHeaderPanel:not(.fixed) .mainMenu {
    margin-bottom: 120px;
    }
}    

#main {
    background-color: $wcfContentBackground;
}

/* Tabularbox */

.wbbBoardList .wbbCollapsibleCategory h2 {
    flex-direction: row-reverse;
}

.wbbBoardList .wbbCollapsibleCategory h2 + small {
    margin-left: 0;
}

.tabularBoxTitle > header {
    border-bottom: 1px solid $wcfContentBorder;
    position: relative;
}

.tabularBoxTitle > header::before {
    background: $wcfSidebarText;
    content: " ";
    display: block;
    height: 2px;
    position: absolute;
    width: 50px;
    bottom: -1px;
}

.tabularBoxTitle > header .icon {
    color: $wcfContentBackground;
}

.tabularBoxTitle > header:hover .icon {
    color: $wcfContentLink;
}


/* Images */


body,
#pageHeaderContainer {
    background-image: url('#{$style_image_path}background.jpg');
    background-attachment: fixed;
    background-size: cover;
}

@media only screen and (max-width: 1024px) {

    #pageHeaderPanel {
        background-color: $wcfContentBackground;
        box-shadow: 
            0 0 25px rgba(0, 0, 0, 0.15), 
            0 1px 0 rgba(0, 0, 0, 0.05);
    }

    #pageHeaderPanel > .layoutBoundary {
        flex-direction: row-reverse;
    }

    .mainMenu::before, 
    .userPanel:not(.userPanelLoggedIn)::before {
        color: $wcfContentLink;
    }

    .mainMenu:hover::before, 
    .userPanel:hover:not(.userPanelLoggedIn)::before {
        color: $wcfContentText;
    }

    #pageHeaderLogo {
        flex: 1 1 auto;
        margin-right: 60px;
        text-align: center;        
    }

    #pageHeaderFacade {
        display: none;
    }

    .pageHeaderContainer a {
        display: inline-block;
    }
    
    .mainMenu {
        margin-right: 20px !important;
    }
    
    #pageHeaderUserPanel {
        background-image: none !important;
        background-color: $wcfContentBackground;
    }

    .mainMenu.pageMenuMobileButtonHasContent::after, 
    .userPanel.pageMenuMobileButtonHasContent::after {
            border: 2px solid $wcfContentBackground;
    }        

}

.boxesFooter,
#pageHeaderUserPanel,
#pageHeaderSearch {
    background-image: url('#{$style_image_path}backgroundBlur.jpg');
    background-attachment: fixed;
    background-size: cover;
}

#pageHeaderUserPanel {
    box-shadow: 
        0 1px 0 rgba(255,255,255,0.1) inset, 
        0 500px 0 rgba(255,255,255,0.1) inset;    
}

.boxesFooter {
    box-shadow: 
        0 -1px 0 rgba(255,255,255,0.05) inset, 
        0 500px 0 rgba(255,255,255,0.1) inset;    
}    
    



/* Userpanel */

#userMenu > a::after {
    background-color: rgba(0, 0, 0, 0);
    color: $wcfHeaderText;
    font-family: FontAwesome;
    font-size: 24px;
    line-height: 32px;
    padding: 5px 2px;
}

#userMenu > a::after {
    content: "\f2be";
}

#userMenu > a > img,
.userPanelAvatarCustom {
    display: none !important;
}

.userPanel > ul > li > a {
    background: rgba(0, 0, 0, 0);
    padding: 0 10px;    
}

.userPanel > ul > li.dropdownOpen > a, 
.userPanel > ul > li.open > a, 
.userPanel > ul > li:hover > a {
    background: rgba(255, 255, 255, 0.1);
}

.userPanel > ul > li > a > .icon {
    font-size: 24px;
}

.interactiveDropdown {
    position: absolute;
    top: $mainHeaderHeight + $mainMenuHeight + 50 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12), 0 3px 16px rgba(0, 0, 0, 0.1);
}

/* Headercontent */

#pageHeaderUserPanel > .layoutBoundary {
    align-items: center;
    position: relative;
}

.userHeaderDataEntry p {
    font-size: 12px;
    color: transparentize($wcfHeaderMenuLink, 0.25);
}

.userHeaderDataEntry h3 {
    font-size: 16px;
}

.headerContentUserData {
    height: 50px;
}

.headerContentUserData > li {
    margin-top: 5px;
    margin-bottom: 5px;
    height: 40px;
}

.headerContentUserData > li:not(:first-child) {
    border-left: 1px dotted rgba(255,255,255,0.3);
}

.userHeaderDataAvatar > a {
    position: absolute;
    bottom: 1px;
    left: 0px;
}

.userHeaderDataAvatar img {
    padding: 2px;
    width: 70px !important;
    height: 70px !important;
    border-radius: 0;
}

.userHeaderDataAvatar {
    width: 74px;
    position: relative;
}

@media only screen and (max-width: 1024px) {

    .headerContentMessage {
        display: none !important;
    }

}

/* Killing Padding */

.wbbBoardList .wbbBoard > .icon,
.wbbBoardList .wbbCategory .wbbDepth2.wbbBoardContainer > .wbbBoard > .icon {
    margin-left: 0;
}
    
.wbbBoardList .wbbCategory .wbbDepth3.wbbBoardContainer > .wbbBoard > .icon {
    margin-left: 25px;
}        

/* Icons Boardlist */

.wbbBoardList .icon32 {
    border-radius: $borderRadius;
    color: $wcfContentBackground;
}

.wbbBoardList .icon32:not(.fa-folder-open-o) {
    background-color: $wcfHeaderMenuLinkBackgroundActive;
}

.wbbBoardList .icon32.fa-folder-open-o {
    background-color: $wcfContentBorderInner;
}


.wbbBoardList .icon32 {
    font-size: 16px;
    position: relative;
    top: -1px;
}

.wbbBoardList .icon32.fa-folder-open::before,
.wbbBoardList .icon32.fa-folder-open-o::before {
        content: "\f075";
}

.wbbLastPost {
    border-radius: $borderRadius;
    background-color: $wcfNavigationBackground;
    padding: 5px 10px;
    border-top: 1px solid $wcfContentBorderInner;
    border-bottom: 1px solid $wcfContentBorderInner;
}

/* Boxes*/

@media only screen and (min-width: 1025px) {

    .boxesSidebarLeft .box:not(.boxBorderless), 
    .boxesSidebarRight .box:not(.boxBorderless) {
        padding-left: 0;
        padding-right: 0;
        background-color: $wcfContentBackground;
        border-bottom: 1px solid $wcfContentBorderInner;
    }

    .boxTitle {
        padding-bottom: 10px;
        border-bottom: 1px solid $wcfContentBorderInner;
        position: relative;
    }

    .boxTitle::before {
        background: $wcfSidebarText;
        content: " ";
        display: block;
        height: 2px;
        position: absolute;
        width: 50px;
        bottom: -1px;
    }

    .sidebar .sidebarItemList > li:not(:last-child), 
    .sidebar .sidebarBoxList > li:not(:last-child) {
        margin-bottom: 5px;
        border-bottom: 1px dotted $wcfContentBorder;
        padding-bottom: 5px;
    }

    .boxesSidebarLeft .box .boxMenu li.active > .boxMenuLink, 
    .boxesSidebarRight .box .boxMenu li.active > .boxMenuLink {
        background-color: transparentize($wcfContentBorderInner, 0.5);
    }

    .boxesSidebarLeft .box .boxMenu li.active > .boxMenuLink {
        padding: 5px 20px;
    }

    .boxesSidebarRight .box .boxMenu li.active > .boxMenuLink {
        padding: 5px 10px 5px 30px;
    }
    

}

/* Badges */

.badgeOnline::before {
    background-image: linear-gradient(rgb(0,167,0), rgb(0,132,0));
}

.badge {
    box-shadow:0 1px 0 rgba(0, 0, 0, 0.02);
}

.badge,
a.badge {
    background-image: linear-gradient($wcfContentText, darken($wcfContentText,5%));
    
    &.badgeUpdate {
        background-image: linear-gradient(rgb(205,41,0), rgb(170,40,0));
    }
        
    &.green {
        background-image: linear-gradient(rgb(0,167,0), rgb(0,132,0));
    }
    
    &.red {
        background-image: linear-gradient(rgb(205,41,0), rgb(170,40,0));
    }
    
    &.black {
        background-image: linear-gradient(rgb(66,66,66), rgb(0,0,0));
    }
    
    &.brown {
        background-image: linear-gradient(rgb(231,113,47), rgb(141,69,19));
    }
    
    &.orange {
        background-image: linear-gradient(rgb(255,174,59), rgb(226,136,0));
    }
    
    &.yellow {
        background-image: linear-gradient(rgb(255,255,0), rgb(171, 171, 0));
    }
    
    &.blue {
        background-image: linear-gradient(rgb(54,118,181), rgb(36,81,130));
    }
    
    &.purple {
        background-image: linear-gradient(rgb(215,65,255), rgb(157,0,194));
    }
    
    &.pink {
        background-image: linear-gradient(rgb(255,45,212), rgb(206,0,168));
    }
}

a.badge:hover {
    background-image: linear-gradient($wcfContentText, $wcfContentText);
    color: #FFF;
    
    &.badgeUpdate {
        background-image: linear-gradient(rgb(170,40,0), rgb(170,40,0));
    }
        
    &.green {
        background-image: linear-gradient(rgb(0,132,0), rgb(0,132,0));
    }
    
    &.red {
        background-image: linear-gradient(rgb(170,40,0), rgb(170,40,0));
    }
    
    &.black {
        background-image: linear-gradient(rgb(0,0,0), rgb(0,0,0));
    }
    
    &.brown {
        background-image: linear-gradient(rgb(141,69,19), rgb(141,69,19));
    }
    
    &.orange {
        background-image: linear-gradient(rgb(226,136,0), rgb(226,136,0));
    }
    
    &.yellow {
        background-image: linear-gradient(rgb(171, 171, 0), rgb(171, 171, 0));
    }
    
    &.blue {
        background-image: linear-gradient(rgb(36,81,130), rgb(36,81,130));
    }
    
    &.purple {
        background-image: linear-gradient(rgb(157,0,194), rgb(157,0,194));
    }
    
    &.pink {
        background-image: linear-gradient(rgb(206,0,168), rgb(206,0,168));
    }
}

/* Likesystem */

.wcfLikeCounter.likeCounterLiked {
    color: #008400 !important;
}

.wcfLikeCounter.likeCounterDisliked {
    color: #cd2900 !important;
}

.messageGroupList .columnSubject > .statusDisplay {
    opacity: 1.0;
}

.userAvatarImage {
    border-radius: 0;
}

/* Messages */

@media (max-width: 768px) {
    
    .wbbAnnouncementIcon, 
    .wbbStickyIcon, 
    .wbbMovedIcon {
        border-radius: 0;
    }
    
}

@media (min-width: 769px) {

    .messageList:not(.messageReducedList) > li .message {
        padding: 15px 0;
        background-color: $wcfSidebarBackground;
        border-radius: $borderRadius;
    }

    .messageList:not(.messageReducedList) > li:not(:first-child) .message {
        border-top: 1px solid $wcfContentBorder;
    }

    .messageList:not(.messageReducedList) > li:not(.messageListPagination) {
        padding: 0;
        border-radius: $borderRadius;
    }

    .messageList:not(.messageReducedList) {
        border-radius: $borderRadius;
    }

    .messageList:not(.messageReducedList) > li {
        margin-bottom: 15px;
    }

    .messageList:not(.messageReducedList) .messageSidebar {
        flex: 0 0 $messageSidebarWidth;
        border-radius: $borderRadius 0 0 0;
        background-color: rgba(0,0,0,0);
        text-align: left;
        padding: 0 30px 0 0;
    }

    .messageList:not(.messageReducedList) .messageSidebar + .messageContent {
        flex-basis: calc(100% - #{$messageSidebarWidth});
        max-width: calc(100% - #{$messageSidebarWidth});
        margin-left: 0;
    }

    .messageList:not(.messageReducedList) .message:not(.messageReduced) .messageContent {
        padding: 20px;
    }

    .messageList:not(.messageReducedList) .message.messageReduced .messageContent {
        padding:10px;
    }

    .message.messageReduced .messageHeader {
        background-color: $wcfContentBackground;
    }        

    .messageList:not(.messageReducedList) .messageContent {
        border-radius: 0 $borderRadius $borderRadius 0;
        background-color: $wcfNavigationBackground;
        border-top: 1px solid $wcfContentBorder;
        border-bottom: 1px solid $wcfContentBorder;
    }

    .messageList:not(.messageReducedList) > li .message {
        background-color: $wcfContentBackground;
    }

    .messageCollapsed .messageContent,
    .messageReducedList .messageContent {
        border-top: 1px solid $wcfContentBorder;
        border-bottom: 1px solid $wcfContentBorder;
    }

    .messageList .messageListPagination {
        padding: 0px 0 15px !important;
    }

    .messageQuickReplyCollapsed {
        border-bottom: 1px solid $wcfContentBorder !important;
    }
}

@media (max-width: 768px) {

    .messageSidebar {
        background-color: $wcfNavigationBackground;
    }

    .messageList:not(.messageReducedList) .messageSidebar {
        border-bottom: 1px solid $wcfContentBorder;
    }

    .messageFooterGroup {
        margin-top: 10px;
        border-top: 1px dotted $wcfContentBorder;
    }

}

@media (min-width: 769px) {

    .messageReduced .messageBody,
    .messageReduced .messageFooter {
        padding: 0;
    }

    .message.messageReduced {
        background-color: $wcfNavigationBackground;
    }

}

.message.messageReduced > .messageContent {
    padding: 20px;
}

.messageQuickReplyCollapsed:hover .messageQuickReplyContent::before,
.messageQuickReplyCollapsed:hover .messageQuickReplyContent::after {
    color: $wcfContentLink;
}
@media (max-width: 768px) {

    .messageQuickReplyCollapsed .messageQuickReplyContent {
        border-bottom: 1px solid $wcfContentBorder;
        border-top: 1px solid $wcfContentBorder;
    }

}

.messageSignature {
    opacity: 1;
}

/* Mainmenu */

.mainMenu .boxMenu > li:not(:last-child),
.mainMenu .boxMenu > li.active:not(:last-child), 
.mainMenu .boxMenu > li:hover:not(:last-child) {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0);
}

.mainMenu {
    margin-right: 0;
}

.mainMenu .boxMenu > li:not(:last-child) {
    margin-right: 15px;
}

.mainMenu .boxMenu > li > a {
    background: rgba(0, 0, 0, 0);
    padding: 0;
    border-top: 2px solid rgba(255,255,255,0);
    border-bottom: 2px solid rgba(255,255,255,0);
    transition-property: all;
    transition-duration: .3s;
    transition-timing-function: ease;
    height: 40px;
}    

.mainMenu .boxMenu > li:hover > a {
    border-top: 2px solid rgba(214,180,105,1);
    border-bottom: 2px solid rgba(214,180,105,1);
}

.mainMenu .boxMenu > li.active > a {
    border-bottom: 2px solid rgba(222,195,135,1);
}

.mainMenu .boxMenu > li.active > a, 
.mainMenu .boxMenu > li:hover > a {
    background: rgba(0, 0, 0, 0);
    transition-property: all;
    transition-duration: .3s;
    transition-timing-function: ease;
}

.mainMenu .boxMenu .boxMenuDepth1 {
    top: 38px;
}

.mainMenu .mainMenuShowPrevious, 
.mainMenu .mainMenuShowNext {
    z-index: 100;
}

/* Search */

@media (min-width: 1025px) {

    #pageHeaderSearch {
        top: 0 !important;
        left: 20px !important;
        right: 20px !important;
        bottom: 0 !important;
        background-color: $wcfHeaderSearchBoxBackground;
    }

    .pageHeaderSearch {
        position: absolute;
    }

    .pageHeaderSearchInputContainer .pageHeaderSearchType {
        display: flex;
        height: 50px;
    }

    .pageHeaderSearchInputContainer .pageHeaderSearchInput {
        margin-left: 0;
        padding-left: 20px;
        flex-grow: 1;
        background-color: $wcfHeaderSearchBoxBackground;
        height: 50px;
    }

    .pageHeaderSearchInputContainer .pageHeaderSearchType > .button {
        max-width: 240px;
        min-width: 240px;
        padding: 4px 24px 4px 20px;
        width: 240px;
        box-sizing: border-box;
        background-color: $wcfHeaderMenuLinkBackgroundActive;
    }

    .pageHeaderSearchInputContainer .pageHeaderSearchType > .button:hover {
        background-color: $wcfHeaderMenuLinkBackgroundActive;
    }    

    .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
        background-color: $wcfHeaderMenuLinkBackgroundActive;
    }

    .pageHeaderSearchInputButton.button {
        width: 50px;
        height: 50px;
    }

    .pageHeaderSearchInputButton.button > .icon {
        font-size: 18px;
        height: 32px;
        line-height: 32px;
        width: 18px;
        vertical-align: -5px;    
    }

    .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
        padding: 4px 0;
    }
    
    .searchBarOpen .pageHeaderSearch {
        z-index: 101;
    }        

}

.pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchType > .button,
.pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
    background-color: $wcfContentLink;
}

.pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchType > .button:hover,
.pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInputButton:hover {
    background-color: $wcfHeaderSearchBoxBackground;
}

.pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInput {
    border-radius: 0;
}

@media only screen and (min-width: 1025px) {

    .pageHeaderSearchInputContainer .pageHeaderSearchInput,
    .pageHeaderSearchInputContainer .pageHeaderSearchInput:focus, 
    .pageHeaderSearchInputContainer .pageHeaderSearchInput:hover  {
        background-color: rgba(255, 255, 255, 0.0);
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.075) inset;
    }

    .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchType > .button,
    .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInputButton {
        background-color: rgba(255, 255, 255, 0.1);
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    }

    .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchType > .button:hover,
    .pageHeaderSearch .pageHeaderSearchInputContainer .pageHeaderSearchInputButton:hover {
        background-color: rgba(255, 255, 255, 0.1);
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
    }

    #pageHeaderSearch {
        box-shadow: 0 100px 0 rgba(255, 255, 255, 0.1) inset;
    }

}

/* Buttons */

.messageFooterButtons:not(.open) .button {
    background-color: $wcfButtonText;
    color: $wcfContentText;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1) inset;
}

.messageFooterButtons:not(.open) .button:hover {
    background-color: transparentize($wcfButtonText,0.75);
}

@media (min-width: 769px) {

    .filebaseFileList > li,
    .tabularList,
    .containerList,
    .message,
    .wbbBoardList > .wbbCategory,
    .boxesSidebarLeft .box:not(.boxBorderless), 
    .boxesSidebarRight .box:not(.boxBorderless),
    #tpl_wbb_board .wbbBoardList > li:last-child {
        box-shadow: 0 7px 10px -5px rgba(0, 0, 0, 0.03);
    }

}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
a.button { 
    &:not(.inputPrefix) {
        text-transform: none;
    }
}


/* Transitions */

.userPanel > ul > li > a,
.userPanel > ul > li > a:hover,
.wbbBoardList .wbbBoard,
.wbbBoardList .wbbBoard:hover,
.button,
.button:hover,
input[type="submit"],
input[type="submit"]:hover,
button,
button:hover,
.interactiveDropdownItems > li,
.interactiveDropdownItems > li:hover,
.tabularListRow,
.tabularListRow:hover {
    transition-property: background-color;
    transition-duration: .1s;
    transition-timing-function: linear;    
}

/* Mainmenu  Dropdown */

.mainMenu .boxMenu .boxMenuDepth1 {
    box-shadow: 0 5px 10px rgba(0,0,0,0.2);
    min-width: 120px;
    border-radius: 0;
}

.mainMenu .boxMenu .boxMenuDepth1 > li > a, 
.mainMenu .boxMenu .boxMenuDepth1 > li > span {
    padding: 5px 15px;
    font-size: 12px;
}

.mainMenu .boxMenu .boxMenuDepth1 {
    display: none;
}

.mainMenu .boxMenu li.boxMenuHasChildren:hover .boxMenuDepth1 {
    display: block;
}

.mainMenu .boxMenu .boxMenuDepth2 li > a {
    padding: 5px 15px 5px 20px;
    font-size: 12px;
}

/* BB-Code Tables */

.messageTableOverflow table thead tr,
.messageTableOverflow table tr:nth-child(even) {
    background-color: $wcfContentBackground;
}


/* BB-Code Spoiler */

.spoilerBox > .spoilerBoxContent {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .1);
    border-radius: $borderRadius;
}

/* BB-Code Code */

.codeBox {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .1);
    border-radius: $borderRadius;
}

/* Polls */

.pollContainer {
    background-color: $wcfContentBackground;
    padding: 20px;
    border-radius: $borderRadius;
}

.pollContainer .pollResultItem .pollMeter > .pollMeterValue {
    background-color: $wcfContentLink;
}

/* New Topics */

.tabularListColumns.wbbThread li.columnSubject {
    padding-left:20px;
}

.messageGroupList .tabularListColumns.new .columnSubject > h3 > .messageGroupLink {
    position: relative;
}

.messageGroupList .tabularListColumns.new .columnSubject > h3 > .messageGroupLink:after {
    content: "";
    position: absolute;
    left: -13px;
    top: 6px;
    width: 8px;
    height: 8px;
    border-radius:10px;
    background: #00b200;
}

/* Quotes */

woltlab-quote, 
.quoteBox {
    box-shadow: 
        5px 0 0 $wcfContentText inset,
        -1px 0 0 $wcfContentBorderInner inset,
        0 1px 0 $wcfContentBorderInner inset,
        0 -1px 0 0 $wcfContentBorderInner inset;
}

/* Tablehead */

@media (min-width: 1025px) {

    .tabularListRowHead > .tabularListColumns > li {
        font-size: 14px;
    }

}

/* Tabs */

.tabMenu > ul > li > a {
    font-size: 16px;
}

/* Fixed Menu */

@media only screen and (min-width: 1025px) {

    #pageHeaderPanel.fixed {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        top: -100px;
        transform: translateY(100px);
        transition: transform .3s ease-in;
        background: $wcfContentBackground;
        box-shadow: 0 0 25px rgba(0,0,0,0.15), 0 1px 0 rgba(0,0,0,0.05);
        z-index: 302;
    }

    #pageHeaderPanel.fixed,
    #pageHeaderPanel.fixed > .layoutBoundary {
        height: 50px;
    }

    #pageHeaderPanel.fixed .pageHeaderLogo .pageHeaderLogoLarge {
        display: none;
    }

    #pageHeaderPanel.fixed .pageHeaderLogo .pageHeaderLogoSmall {
        display: inline-block;
        height: 30px;
    }

    #pageHeaderPanel.fixed .mainMenu .boxMenu > li > a {
        color: $wcfHeaderMenuLinkBackgroundActive;
    }

    #pageHeaderPanel.fixed .mainMenu .boxMenu > li:hover > a {
        border-top: 2px solid $wcfHeaderMenuLinkBackgroundActive;
        border-bottom: 2px solid $wcfHeaderMenuLinkBackgroundActive;
    }

    #pageHeaderPanel.fixed .mainMenu .boxMenu > li.active > a {
        border-bottom: 2px solid $wcfHeaderMenuLinkBackgroundActive;
    }

}

/* Sidebar */

.sidebar.boxesSidebarRight.sidebarRightCollapsed {
    display: none;
}

.layoutBoundary > .content.sidebarRightCollapsed:not(:last-child) {
    flex-basis: calc(100%);
    max-width: calc(100%);
}

@media only screen and (max-width: 1024px) {

    #pageHeaderUserPanel {
        left: inherit;
        width: 60px;
    }

    #pageHeaderUserPanel > .layoutBoundary {
        justify-content: flex-end;
    }

}

/* Forms Borderradius */

input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="text"],
input[type="url"],
select,
textarea,
.inputItemList {
    border-radius: $borderRadius;
    transition-property: all;
    transition-duration: .1s;
    transition-timing-function: linear;
}

/* Breadcrumbs*/

@include screen-md {

    .pageNavigation {
        display: block;
        padding: 10px 0;
        border-radius: 0;
        min-height: 40px;
        background-color: $wcfNavigationBackground;
    }

}

@include screen-md-down {

    .pageNavigationIcons {
        display: none;
    }

}

@include screen-sm-down {

    .pageNavigation {
        display: none;
    }

}

Display More

Grüsse,

Era

mcburn · Dec 29th 2017

So in der Art?

Dafür habe ich das genutzt

Code

.wbbBoardList .wbbLastPost > div {
    border-radius: 5px;
    margin-right: 7px;
    padding: 5px;
    border: 1px solid #000;
    box-shadow: 6px 6px 10px rgba(73, 54, 73, 0.3) inset;
    background: -moz-linear-gradient(315deg, #fff 0%, #ff7d4d 100%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #fff), color-stop(100%, #ff7d4d));
    background: -webkit-linear-gradient(315deg, #fff 0%, #ff7d4d 100%);
    background: -o-linear-gradient(315deg, #fff 0%, #ff7d4d 100%);
    background: -ms-linear-gradient(315deg, #fff 0%, #ff7d4d 100%);
    background: linear-gradient(135deg, #fff 0%, #ff7d4d 100%);
        background-repeat: repeat;
        background-position-x: 0%;
        background-position-y: 0%;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#FF7D4D',GradientType=1);
    background-position: left top;
    background-repeat: repeat;
}

Display More

Erazor · Dec 29th 2017

Ich möchte lediglich die Hintergrundfarbe von dem markierten Bereich ändern, mit und ohne Mouseover aber finde den entsprechenden Eintrag weder im ACP in der Farbpalette noch im oben geposteten CSS

Dank deinem Beitrag habe ich es nun wohl gefunden, ich vermute es ist der Bereich hier:

Code

.wbbLastPost {
    border-radius: $borderRadius;
    background-color: $wcfNavigationBackground;
    padding: 5px 10px;
    border-top: 1px solid $wcfContentBorderInner;
    border-bottom: 1px solid $wcfContentBorderInner;
}

Korrekt? Wie könnte ich hier zusätzlich noch eine HoverFarbe definieren für den Background?

mcburn · Dec 29th 2017

Dann trage es ein wenn es nicht vorhanden ist.

Teste es doch einfach m,al indem du es an deine CSS ganz unten anfügst.

Erazor · Dec 29th 2017

Sorry mcburn,

Mein Problem war lediglich dass ich nicht wusste wie der markierte Bereich angesprochen wird.

Dank deinem Code-Schnippsel hat es dann "Klick" gemacht dass der entsprechende Bereich im CSS wohl ".wbbLastPost" sein muss, somit hab ich diesen nun gefunden.

Grüsse,

Era

Erazor · Jan 7th 2018

Nochmals eine Frage zu den Farbanpassungen... Wo oder wie kann ich die Hintergrundfarbe vom Redactor Eingabefeld definieren?

Finde dazu in der Farbpalette im ACP leider keinen passenden Bereich und auch in der "Erweiterten Einstellungen" finde ich den passenden Wert von meinem Stil nicht

Besten Dank für euren Support.

Grüsse,

Era

norse · Jan 7th 2018

CSS

.redactor-layer {
    background: #xxx;
}

Gruß norse

Erazor · Jan 7th 2018

Merci norse, kurz und prägnant

Erazor · Jan 7th 2018

Sorry nochmals

Wenn ich für Aktiv & Inaktiv zwei unterschiedliche Farbakzente definieren möchte, wie lautet es dann korrekt?

BackgroundActive: #xxx scheint nicht zu funktionieren in diesem Fall

ReeN · Jan 7th 2018

Falls du mit "aktiv" das meinst was ich denke:

Code

.redactor-layer:focus {
    background: #xxx;
}

Erazor · Jan 7th 2018

So im Nachhinein hätte ich darauf auch selbst kommen können

Habs nun mit :hover implementiert da dies eher meinem Wunschedenken entsprach

Merci auch dir!

CSS Hilfe benötigt / Farbe für einen spezifischen Bereich ändern

Participate now!

Share