queen0f_heartsqueen0f_hearts MemberComments: 5 Received thanks: 0 Member since: December 2018 edited December 2018

Hallo,

ich habe ein Problem mit meiner Navigation. Mein Ziel ist es die Hintergrundfarbe des Headers zu ändern, nur hat meine Navigation oben und unten dicke weisse Ränder, die ich nicht weg bekomme.

Ich habe die Navigation standardmäßig über 

< nav class=“navigation-main” >

eingebunden. Darin befindet sich dann ein neuer Container, in dem meine main-navigation.tpl eingebunden wird.

Kann mir jemand weiterhelfen?

Answers

  • ChrisWeChrisWe MemberComments: 15 Received thanks: 1 Member since: June 2016

    Da musst du schon genauer werden. Wie ist die Struktur? Hast du vom Responsive Theme abgeleitet? CSS für den header?

  • queen0f_heartsqueen0f_hearts MemberComments: 5 Received thanks: 0 edited December 2018 Member since: December 2018

    Da musst du schon genauer werden. Wie ist die Struktur? Hast du vom Responsive Theme abgeleitet? CSS für den header?

    Hier ist der Code aus dem tpl

    {* Shop header *}
    {block name='frontend_index_navigation'}
        
            {block name='frontend_index_top_bar_container'}
                {include file="frontend/index/topbar-navigation.tpl"}
            {/block}
    
    
            {block name='frontend_index_header_navigation'}
                
    
                {* Logo container *}
                {block name='frontend_index_logo_container'}
                    {include file="frontend/index/logo-container.tpl"}
                {/block}
    
                {* Shop navigation *}
                {block name='frontend_index_shop_navigation'}
                    {include file="frontend/index/shop-navigation.tpl"}
                {/block}
    
                {block name='frontend_index_container_ajax_cart'}
                    
                {/block}
                
            {/block}
            {* WENN ICH MICH NICHT IRRE, GEHT ES UM FOLGENDEN BLOG: *}
            {block name='frontend_index_navigation_categories_top'}
                
                    
                        {block name="frontend_index_navigation_categories_top_include"}
                            {include file='frontend/index/main-navigation.tpl'}
                        {/block}
                    
                
            {/block}
        
    {/block}

     Hier der Code des inkludierten Files frontend/index/main-navigation.tpl

    {block name='frontend_index_navigation_categories'}
        
            {block name='frontend_index_navigation_categories_navigation_list'}
                
                    {strip}
                        {block name='frontend_index_navigation_categories_top_home'}
                            
                                {block name='frontend_index_navigation_categories_top_link_home'}
                                    
                                        {s name='IndexLinkHome' namespace="frontend/index/categories_top"}{/s}
                                    
                                {/block}
                            
                        {/block}
    
                        {block name='frontend_index_navigation_categories_top_before'}{/block}
    
                        {foreach $sMainCategories as $sCategory}
                            {block name='frontend_index_navigation_categories_top_entry'}
                                {if !$sCategory.hideTop}
                                    
                                        {block name='frontend_index_navigation_categories_top_link'}
                                            
                                                {$sCategory.description}
                                            
                                        {/block}
                                    
                                {/if}
                            {/block}
                        {/foreach}
                        {block name='frontend_index_navigation_categories_top_after'}{/block}
                    {/strip}
                
            {/block}
        
    {/block}
    

    Hier ist die css

    .navigation-main {
        background: #fff;
        display: none;
    }
    
    @media screen and (min-width: @tabletViewportWidth) {
        .navigation-main {
            border-bottom: 1px solid @brand-primary;
            display: block;
            position: relative;
    
            .navigation--list {
                .clearfix();
                .unitize-padding(0, 10);
                margin: 0;
                position: relative;
                white-space: nowrap;
            }
    
            .navigation--entry {
                display: inline-block;
                -ms-touch-action: none;
            }
    
            .navigation--link {
                .transition(none);
                .unitize-padding(8, 14);
                .unitize(font-size, 16);
                .border-radius-multi(3px, 3px, 0, 0);
                margin: 0;
                display: block;
                cursor: pointer;
                color: #fff;
    
                &:hover { color: @brand-primary; }
            }
    
            .is--active .navigation--link {
                .primary-gradient();
                font-weight: @font-bold-weight;
                color: #fff;
    
                &:hover { color: #fff; }
            }
        }
    }
    
    @media screen and (min-width: @desktopViewportWidth) {
        .navigation-main {
            .navigation--list {
                padding: 0;
            }
        }
    }
    
Sign In or Register to comment.