Jump to content

Modificare Meniuri

Mihai Alexandru

By Mihai Alexandru,
in IP.Board 3.x

 Share
Go to solution Solved by Sebastian C.,

Recommended Posts

  • Solution
Sebastian C. Veteran

Sebastian C.

Posted
  • Solution
Posted (edited)

Instaleaza ProMenu.

 

Ce treaba are ProMenu cu asta? Cauta in css asta :

 

#nav_wrap{
    background: #171717;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    height: 35px;
}

#primary_nav {
height: 46px;
  background: #464b4c;
  background-image: -webkit-linear-gradient(top, #464b4c, #3f4344);
  background-image: -moz-linear-gradient(top, #464b4c, #3f4344);
  background-image: -o-linear-gradient(top, #464b4c, #3f4344);
  background-image: linear-gradient(to bottom, #464b4c, #3f4344);
  border-bottom: 1px solid #000;
text-transform:uppercase;
font: 11px;
}

    #community_app_menu > li { margin: 0px 0px 0 0; position: relative; }

    
    #community_app_menu > li > a {
        display: block;
  padding: 0 20px;
  line-height: 46px;
  color: #ddd;
  text-decoration: none;
  text-shadow: 0 -1px #2e3131;
  border-left: 1px solid #4d5354;
  border-left: 1px solid rgba(255, 255, 255, 0.06);
  border-right: 1px solid #353939;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  cursor: pointer;
    }

        
        #community_app_menu > li > a:hover, #community_app_menu > li > a.menu_active {
            padding: 0 21px;
  line-height: 43px;
  color: #368F99;
  background: #323637;
  border-left: 0;
  border-right: 0;
  border-bottom: 3px solid #56c93d;
  background-image: -webkit-linear-gradient(top, #484e4f, #323637);
  background-image: -moz-linear-gradient(top, #484e4f, #323637);
  background-image: -o-linear-gradient(top, #484e4f, #323637);
  background-image: linear-gradient(to bottom, #484e4f, #323637);
  -webkit-box-shadow: inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2);
        }
    
    
    #community_app_menu > li.active > a {
        padding: 0 21px;
  line-height: 43px;
  color: #368F99;
  background: #323637;
  border-left: 0;
  border-right: 0;
  border-bottom: 3px solid #48a9c0;
  background-image: -webkit-linear-gradient(top, #484e4f, #323637);
  background-image: -moz-linear-gradient(top, #484e4f, #323637);
  background-image: -o-linear-gradient(top, #484e4f, #323637);
  background-image: linear-gradient(to bottom, #484e4f, #323637);
  -webkit-box-shadow: inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2);
    }
    #community_app_menu > li > a.ipbmenu img{ margin-right: -6px; }

#primary_extra_menucontent,
#more_apps_menucontent, .submenu_container {
    background: #202020;
    border: 1px solid #272727;
    border-top: 0;
    font-size: 11px;
    min-width: 140px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -moz-border-radius: 0 0 4px 4px;
    -webkit-border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    border-radius: 0 0 4px 4px;
}

    #primary_extra_menucontent li,
    #more_apps_menucontent li, .submenu_container li {
        padding: 0;
        border: 0;
        background: none transparent;
        float: none !important;
        min-width: 150px;
    }
    
    #primary_extra_menucontent a,
    #more_apps_menucontent a, .submenu_container a {
        display: block;
        padding: 8px 10px;
        color: #fff;
    }
    
    #primary_extra_menucontent a:hover,
    #more_apps_menucontent a:hover, .submenu_container a:hover { background: #242424; color: #fff; }
    
    #primary_extra_menucontent li:last-child a,
    #more_apps_menucontent li:last-child a{
        -moz-border-radius: 0 0 4px 4px;
        -webkit-border-bottom-right-radius: 4px;
        -webkit-border-bottom-left-radius: 4px;
        border-radius: 0 0 4px 4px;
    }

#community_app_menu .submenu_container { width: 260px; }
#community_app_menu .submenu_container li {width: 260px; }

#secondary_navigation{
    background: #202020;
    border: 1px solid rgba(255,255,255,0.15);
    text-shadow: rgba(0,0,0,0.8) 0px -1px 0px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    overflow: hidden;
    line-height: 37px;
    margin-bottom: 15px;
}

#secondary_navigation a{
    color: #368F99;
    line-height: 37px;
    height: 37px;
}

#secondary_navigation a:hover{ color: #fff; }

    #secondary_navigation #breadcrumb li {
        float: left;
    }

    #secondary_navigation #breadcrumb li a {
        padding-left: 12px;
        ;
        background: #202020 url('{style_images_url}/secondary_nav.png');
        display: block;
        outline: none;
        text-decoration: none;
            
    }
    
    #secondary_navigation #breadcrumb li.first a{
        margin-left: 0;
        background: none;
        padding-left: 0px;
    }
    
    #secondary_navigation #breadcrumb li span{
        display: block;
        padding-right: 17px;
        padding-left: 4px;
        background: #202020;
    }
    
    #secondary_navigation #breadcrumb li > span{ padding-left: 4px; background: none transparent; color: #d7d7d7; }
    
    #secondary_navigation #breadcrumb li.first a span{
        padding-left: 12px;
        -webkit-border-top-left-radius: 3px;
        -webkit-border-bottom-left-radius: 3px;
        -moz-border-radius: 3px 0px 0px 3px;
        border-radius: 3px 0px 0px 3px;
    }
    
    #secondary_navigation #breadcrumb li a:hover{
        background-position: 0 -43px;
    }
    
    #secondary_navigation #breadcrumb li a:hover span{
        background-position: 100% -43px;
    }
    
    #secondary_navigation #breadcrumb li a:active{
        background-position: 0 -86px;
    }
    
    #secondary_navigation #breadcrumb li a:active span{
        background-position: 100% -86px;
    }

#secondary_links{ overflow: hidden; }
#secondary_links li{ float: left; margin: 0; border-left: 1px solid rgba(255,255,255,0.15)}

#secondary_links a{
    padding: 0 12px;
    display: block;
}

#secondary_links img {
    vertical-align: top;
    width: 16px;
    height: 16px;
    position: relative;
    opacity: 0.8;
    margin: 10px -4px 0 -4px;
}

#secondary_links a:hover img { opacity: 1; }

.breadcrumb {
    color: #d7d7d7;
    font-size: 11px;
}
    .breadcrumb a { color: #d7d7d7; }
    .breadcrumb li .nav_sep { margin: 0 5px 0 0; }
    .breadcrumb li:first-child{ margin-left: 0; }
    /*.breadcrumb.top { margin-bottom: 10px; }*/
    .breadcrumb.bottom { margin-top: 10px; width: 100%; display: none; }

.ipsHeaderMenu {
    background: #1d1d1d;
    padding: 10px;
    -moz-border-radius: 0 0 6px 6px;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    border-radius: 0 0 6px 6px;
    overflow: hidden;
    width: 340px;
}

.ipsHeaderMenu.boxShadow{
    -webkit-box-shadow: rgba(0,0,0,0.4) 0px 0px 10px;
    -moz-box-shadow: rgba(0,0,0,0.4) 0px 0px 10px;
    box-shadow: rgba(0,0,0,0.4) 0px 0px 10px;
}

    .ipsHeaderMenu .ipsType_sectiontitle { margin-bottom: 8px; }
    
    #user_notifications_link_menucontent.ipsHeaderMenu,
    #user_inbox_link_menucontent.ipsHeaderMenu {
        width: 300px;
    }

 

Inlocuieste cu asta :

 

#nav_wrap{
    background:#171717;
    border-top:1px solid #111111;
    border-bottom:3px solid rgba(255, 255, 255, 0.15);
    height:46px
}

#primary_nav{
        height:46px;
    background:#2b2b3e;
    background-image:-webkit-linear-gradient(top, #1a1a1a, #1a1a1a);
    background-image:-moz-linear-gradient(top, #1a1a1a, #1a1a1a);
    background-image:-o-linear-gradient(top, #1a1a1a, #1a1a1a);
    background-image:linear-gradient(to bottom, #1a1a1a, #1a1a1a);
    border-bottom:3px solid rgba(255, 255, 255, 0.15);
    text-transform:uppercase;
    font:11px
}

#community_app_menu>li{
    margin:0px
0px 0 0;
    position:relative
}

#community_app_menu>li>a{
    display:block;
    padding:0
20px;
    line-height:46px;
    color:#fff;
    text-decoration:none;
    text-shadow:0 -1px #2e3131;
    border-left:1px solid #4d5354;
    border-left:1px solid rgba(255, 255, 255, 0.06);
    border-right:1px solid #353939;
    border-right:1px solid rgba(0,0,0,0.2);
    cursor:pointer
}

#community_app_menu>li>a:hover,#community_app_menu>li>a.menu_active{
    padding:0
21px;
    line-Sighet:46px;
    color:#fff;
    background:#0B4C5F;
    border-left:0;
    border-right:0;
    border-bottom:3px solid #FACC2E;
    background-image:-webkit-linear-gradient(top, #141414, #141414);
    background-image:-moz-linear-gradient(top, #141414, #141414);
    background-image:-o-linear-gradient(top, #141414, #141414);
    background-image:linear-gradient(to bottom, #141414, #141414);
    -webkit-box-shadow:inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2);
    box-shadow:inset 0 -1px #151717, inset 0 -1px 8px rgba(0,0,0,0.2)
}

#community_app_menu>li.active>a{
    padding:0
21px;
    line-height:46px;
    color:#848484;
    background:#0B4C5F;
    border-left:0;
    border-right:0;
    border-bottom:3px solid orange;
    background-image:-webkit-linear-gradient(top, #2b2b3e, #0081ff);
    background-image:-moz-linear-gradient(top, #141414, #141414);
    background-image:-o-linear-gradient(top, #141414, #141414);
    background-image:linear-gradient(to bottom, #141414, #141414);
    -webkit-box-shadow:inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2);
    box-shadow:inset 0 -1px #151717, inset 0 -1px 8px rgba(0, 0, 0, 0.2)
}

#community_app_menu > li > a.ipbmenu
img{
    margin-right:-6px
}

#primary_extra_menucontent,#more_apps_menucontent,.submenu_container{
    background:#0B4C5F;
    border:1px
solid #272727;
    border-top:0;
    font-size:11px;
    min-width:140px;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    box-shadow:none;
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-bottom-right-radius:4px;
    -webkit-border-bottom-left-radius:4px;
    border-radius:0 0 4px 4px
}

#primary_extra_menucontent li,
#more_apps_menucontent li, .submenu_container
li{
    padding:0;
    border:0;
    background:none transparent;
    float:none !important;
    min-width:150px
}

#primary_extra_menucontent a,
#more_apps_menucontent a, .submenu_container
a{
    display:block;
    padding:8px
10px;
    color:#fff
}

#primary_extra_menucontent a:hover,
#more_apps_menucontent a:hover, .submenu_container a:hover{
    background:#242424;
    color:#fff
}

#primary_extra_menucontent li:last-child a,
#more_apps_menucontent li:last-child
a{
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-bottom-right-radius:4px;
    -webkit-border-bottom-left-radius:4px;
    border-radius:0 0 4px 4px
}

#community_app_menu
.submenu_container{
    width:260px
}

#secondary_navigation{
    background: #202020 url('{style_images_url}/secondary_nav_bg.png') repeat-x 0 0;
    border: 1px solid #2d2d2d;
    text-shadow: rgba(0,0,0,0.8) 0px -1px 0px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    overflow: hidden;
    line-height: 37px;
    margin-bottom: 15px;
}

#secondary_navigation a{
    color: #FFA206;
    line-height: 37px;
    height: 37px;
}

#secondary_navigation a:hover{ color: #FFC206; }

    #secondary_navigation #breadcrumb li {
        float: left;
    }

    #secondary_navigation #breadcrumb li a {
        padding-left: 12px;
        ;
        background: url('{style_images_url}/secondary_nav.png') no-repeat 0 0;
        display: block;
        outline: none;
        text-decoration: none;
    }
    
    #secondary_navigation #breadcrumb li.first a{
        margin-left: 0;
        background: none;
        padding-left: 0px;
    }
    
    #secondary_navigation #breadcrumb li span{
        display: block;
        padding-right: 17px;
        padding-left: 4px;
        background: url('{style_images_url}/secondary_nav.png') no-repeat 100% 0;
    }
    
    #secondary_navigation #breadcrumb li > span{ padding-left: 4px; background: none transparent; color: #d7d7d7; }
    
    #secondary_navigation #breadcrumb li.first a span{
        padding-left: 12px;
        -webkit-border-top-left-radius: 3px;
        -webkit-border-bottom-left-radius: 3px;
        -moz-border-radius: 3px 0px 0px 3px;
        border-radius: 3px 0px 0px 3px;
    }
    
    #secondary_navigation #breadcrumb li a:hover{
        background-position: 0 -43px;
    }
    
    #secondary_navigation #breadcrumb li a:hover span{
        background-position: 100% -43px;
    }
    
    #secondary_navigation #breadcrumb li a:active{
        background-position: 0 -86px;
    }
    
    #secondary_navigation #breadcrumb li a:active span{
        background-position: 100% -86px;
    }

#secondary_links{ overflow: hidden; }
#secondary_links li{ float: left; margin: 0; }

#secondary_links a{
    padding: 0 12px;
    display: block;
}

#secondary_links img {
    vertical-align: top;
    width: 16px;
    height: 16px;
    position: relative;
    opacity: 0.8;
    margin: 10px -4px 0 -4px;
}

#secondary_links a:hover img { opacity: 1; }

.breadcrumb {
    color: #d7d7d7;
    font-size: 11px;
}
    .breadcrumb a { color: #d7d7d7; }
    .breadcrumb li .nav_sep { margin: 0 5px 0 0; }
    .breadcrumb li:first-child{ margin-left: 0; }
    /*.breadcrumb.top { margin-bottom: 10px; }*/
    .breadcrumb.bottom { margin-top: 10px; width: 100%; display: none; }

.ipsHeaderMenu {
    background: #1d1d1d;
    padding: 10px;
    -moz-border-radius: 0 0 6px 6px;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    border-radius: 0 0 6px 6px;
    overflow: hidden;
    width: 340px;
}

.ipsHeaderMenu.boxShadow{
    -webkit-box-shadow: rgba(0,0,0,0.4) 0px 0px 10px;
    -moz-box-shadow: rgba(0,0,0,0.4) 0px 0px 10px;
    box-shadow: rgba(0,0,0,0.4) 0px 0px 10px;
}

    .ipsHeaderMenu .ipsType_sectiontitle { margin-bottom: 8px; }
    
    #user_notifications_link_menucontent.ipsHeaderMenu,
    #user_inbox_link_menucontent.ipsHeaderMenu {
        width: 300px;
    }

Edited by Sebastian C.
  • Upvote 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.

  I accept