Problem with Skin

Moderator: crythias

Post Reply
spinaldf
Znuny newbie
Posts: 48
Joined: 29 Apr 2019, 16:29
Znuny Version: 6community
Real Name: Luiz Guilherme

Problem with Skin

Post by spinaldf »

Dears,
I have a custom skin, but I can't find the problem in my code. Does somebody know help-me?

Show my problem in Image. How can I overlap this menu?

/**
* This file containts the CSS Styles for the header
* with it's toolbar, the userbar and the whole main navigation
*
* @project OTRS (http://www.otrs.org) - Agent Frontend
* @copyright xxx
* @license AGPL (http://www.gnu.org/licenses/agpl.txt)
*/

/**
* @package Skin "Default"
* @section Header
*/

@media screen,projection,tv,handheld {

/**
* @subsection Header
*/
#Header {
height: 80px;
padding: 10px 0 12px;
background: url(../img/bg_topo.png) no-repeat right 4px, url(../img/logo-camara-transp.png) 50px 18px no-repeat, linear-gradient(135deg, #128EB6 0%,#242B33 33%); /* #333; */
color: #FFF;
position: relative;
z-index: 10;
}

#Application {
display: none;
}

/**
* @subsection Logo
*/
#Logo {
top: -4px;
right: 38px;
width: 244px;
height: 100%;
background: url(../img/logo_bg.png) no-repeat;
background-size: contain;
position: absolute;
display: none;
}

.RTL #Header #Logo {
right: auto;
left: 38px;
}


/**
* @subsection Toolbar
*/
#ToolBar {
left: 240px;
top: 10px;
position: absolute;
z-index: 20;
}

#ToolBar:last-child {
margin-left: 0px;
}

.RTL #ToolBar {
left: auto;
right: 10px;
}

#ToolBar li {
width: 24px;
height: 34px;
margin: 0 5px;
float: left;
position: relative;
}

.RTL #ToolBar li {
float: right;
}

#ToolBar li.Extended {
width: auto;
}

#ToolBar li.Extended form * {
float: left;
}

#ToolBar li.Extended form select {
margin-top: 1px;
}

#ToolBar a {
height: 20px;
width: 24px;
text-indent: -9999px;
position: relative;
display: block;
}

#ToolBar a i {
display: block !important;
font-size: 18px;
font-style: normal;
font-weight: normal !important;
padding: 0;
text-align: center;
text-indent: 0;
text-shadow: 1px 1px 0 #000000;
width: 24px;
position: relative;
top: -9px;
}

#ToolBar a i.icon-small {
font-size: 12px !important;
position: absolute;
right: -7px;
text-align: center;
top: -3px;
width: 15px;
display: none !important;
}

#ToolBar .New .icon-small.icon-show-new {
display: block !important;
}

#ToolBar .Reached .icon-small.icon-show-reached {
display: block !important;
}

#ToolBar a span.Counter {
bottom: -14px;
color: #FFFFFF;
display: block;
font-size: 11px;
left: 50%;
margin-left: -12px;
position: absolute;
text-align: center;
text-indent: 0 !important;
width: 24px;
}

/**
* @subsection Navigation Level-0
*/

#NavigationContainer {
position: absolute;
top: 68px;
left: 10px;
z-index: 20;
width: 98%;
height: 35px;
overflow: hidden;
}

#NavigationContainer #Navigation {
left: 0px;
position: absolute;
}

.RTL #NavigationContainer {
left: auto;
right: 10px;
}

#NavigationContainer > a {
background: #f3960d;
color: #FFFFFF;
font-weight: bold;
font-size: 13px;
height: 34px;
line-height: 28px;
position: absolute;
text-align: center;
width: 20px;
z-index: 100;
}

#NavigationContainer > a.NavigationBarNavigateRight {
right: 0px;
}

#NavigationContainer > a.NavigationBarNavigateLeft {
left: 0px;
}

#NavigationContainer > a:hover {
padding-top: 1px;
padding-left: 1px;
width: 19px;
height: 33px;
}

#NavigationContainer > a i {
margin-top: 10px;
display: block;
}

#NavigationContainer > .fa-check {
position: absolute;
font-size: 15px;
top: 8px;
color: #777;
display: none;
}

/**
* @subsection Main hover effect
*/
#Navigation > li {
float: left;
position: relative;
background: #000000;
margin-right: 1px;
border-bottom: 5px solid #000;
}

#Navigation > li > a {
display: block;
height: 21px;
padding: 8px 15px 0px 7px;
font-size: 12px;
line-height: 12px;
color: #DDD;
}

#Navigation > li > a#GlobalSearchNav {
padding-right: 21px;
}

#Navigation > li > a#GlobalSearchNav i {
font-size: 15px;
margin-top: 5px;
}

.RTL #Navigation > li {
float: right;
}

.RTL #Navigation > li > a {
padding: 4px 4px 3px 15px;
}

.RTL #Navigation > li > a#GlobalSearchNav {
padding-right: 4px;
padding-left: 26px;
}

#Navigation > li:hover {
cursor: pointer;
border-color: #FF9922;
}

#Navigation > li:hover > a,
#Navigation > li:active > a {
color: #FFF;
}

#Navigation > .Selected {
border-color: #FF9922;
z-index: 90;
}

#Navigation > .Selected > a {
color: #FFF;
}

/**
* @subsection Search icon
*/
#Navigation .Search {
width: 16px;
}

#Navigation a i {
top: 2px;
left: 15px;
font-size: 20px;
position: absolute;
}

/**
* @subsection Navigation Second level
*/

#Navigation > li > ul {
display: none;
}

#Navigation > .Active > ul {
position: absolute;
top: 35px;
left: 0px;
display: block;
min-width: 240px;
z-index: 99;
background: #000;
}

.RTL #Navigation > .Active > ul {
left: auto;
right: -9px;
}

#Navigation > .Active > ul > li {
font-size: 11px;
line-height: 11px;
margin-top: -1px;
position: relative;
}

#Navigation > .Active > ul > li:hover {
background: #FF9922;
}

#Navigation > .Active > ul > li:hover > a {
color: #000;
}

#Navigation > .Active > ul > li > a {
display: block;
position: relative;
color: #DDD;
padding: 6px 10px 7px 8px;
border-bottom: 1px solid #555;
}

#Navigation > .Active > ul > li:last-child > a {
border-bottom: none;
}

} /* end @media */

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

/* Verde: linear-gradient(to right, #173010 0%,#507c3f 45%) */

#Header {
height: 80px;
padding: 10px 0 12px;
background: url(../img/bg_topo.png) no-repeat right 4px, url(../img/logo-camara-transp.png) 10px 10px no-repeat, linear-gradient(135deg, #128EB6 0%,#242B33 33%);
color: #FFF;
position: relative;
z-index: 10;
}

#Application {
top: 38px;
right: 5px;
position: absolute;
display: block !important;
}

#Application a {
color: white;

}

#ApplicationAbbr {
font-size: 2em;
font-weight: bold;
padding-right: 5px;
white-space: nowrap;
}

#ApplicationName {
padding-left: 5px;
font-size: 1.8em;
border-left: 2px solid #128EB6;
}
}
You do not have the required permissions to view the files attached to this post.
spinaldf
Znuny newbie
Posts: 48
Joined: 29 Apr 2019, 16:29
Znuny Version: 6community
Real Name: Luiz Guilherme

Re: Problem with Skin

Post by spinaldf »

Solved, I need remove this option --> z-index
Post Reply