Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #10045436
    umbrellamanagement
    Participant

    Hello,

    I noticed that the tabs in the dark version have a problem.
    First of all, the active tab opened when you enter a page doesn’t have the same color of the tab content (the tab pane).

    Then, the active pan has the top border color green (in my page), but if you select the second tab, the active tab starts to have a grey color border.

    And I want to kindly ask you again to teach me how to change the tab background color but together with the tab name (so the nav-item background color and the pane background color). As you see, I have a tab inside a tab and I need different colors. I almost finished the site.

    Thank you!


    #10045437
    Support
    Keymaster

    Hello,

    You need to add these classes in the HTML:

    Add this:

    html.dark .tabs .nav-tabs li.active a,
    html.dark .tabs .nav-tabs li.active a:hover,
    html.dark .tabs .nav-tabs li.active a:focus {
    	color: var(--primary) !important;
    	border-top-color: var(--primary) !important;
    }

    Customizations are not included on support, my suggestion is to add a custom class for that ineer tabs and customize it with css.

    Example:

    <div class="tabs tabs-secondary tabs-2">

    CSS:

    html.dark .tabs-2 .tab-content {
        background: #FFF !important;
    }

    #10045438
    umbrellamanagement
    Participant

    Thanks, the exemple for the custom css is ok and is working. But I need for the nav-items too.
    Now the big pane is white, but he nav-items still dark 🙁


Viewing 3 posts - 1 through 3 (of 3 total)

This topic is marked as "RESOLVED" and can not rceive new replies.