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

Erazor · December 29, 2017 at 12:04 AM

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 · December 29, 2017 at 12:08 AM

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 · December 29, 2017 at 12:11 AM

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 · December 29, 2017 at 12:13 AM

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 · December 29, 2017 at 12:22 AM

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 · January 7, 2018 at 10:50 PM

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 · January 7, 2018 at 10:57 PM

CSS

.redactor-layer {
    background: #xxx;
}

Gruß norse

Erazor · January 7, 2018 at 11:01 PM

Merci norse, kurz und prägnant

Erazor · January 7, 2018 at 11:11 PM

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 · January 7, 2018 at 11:21 PM

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

Code

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

Erazor · January 7, 2018 at 11:28 PM

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!

Users Viewing This Thread