User:Haza-w.debug/dynamic-menus.css
- firstHeading {
text-align:center;
}
- p-personal, #mw_portlets .portlet:not(#p-lang) {
height:auto;
position:absolute;
overflow:auto;
top:2em;
z-index:1000;
width:20%; /* ***** $var1 ***** This needs to be customized for each wiki. It is 100% divided on the number of .portlets */
}
/***********************************
The following need to be customized for each wiki.
It contains the IDs of each individual portlet, and their positions. #p-search is placed separately; it should always be to the right.
The first one must have a value the same as $var1, the second one is 2 × $var1, the third one is 3 × $var1 and so on.
- /
- p-navigation {
left:0%;
}
- p-interaction {
left:20%;
}
- p-tb {
left:40%;
}
- p-personal {
left:60%;
}
/***********************************
End of .portlet ID section.
- /
- p-search {
right:0;
}
- p-personal h5, #mw_portlets h5 {
display:block;
background-color:#3c78b5;
cursor:default;
color:white;
font-size:100%;
font-variant:small-caps;
font-weight:bold;
height:1em;
text-transform:lowercase;
text-align:center;
}
.portlet h5 {
border-bottom:none;
padding:0 0 0.4em;
}
- p-personal div.pBody, #mw_portlets div.pBody {
display:none;
background-color:#eee;
border-left:1px solid #036;
border-right:1px solid #036;
border-bottom:5px solid #036;
font-variant:normal;
height:auto;
margin:0;
padding:0;
}
- p-personal ul, #mw_portlets .portlet ul, #searchBody {
background-color:#eee;
height:auto;
line-height:1.5em;
margin:0;
padding:0;
}
- p-personal li, #mw_portlets li {
display:block;
border-bottom:1px solid #ddd;
float:none;
font-weight:normal;
text-transform:none;
margin:0;
height:auto;
}
- p-personal li a, #mw_portlets li a {
color:#036;
width:100%;
padding:0 1em;
}
- searchInput {
width:95%;
}
- mw_contentwrapper, #mw_content {
margin:0;
}
- p-cactions {
margin:0;
}
- p-cactions li {
margin:0;
padding:0;
}
- p-cactions li a {
padding:0 1em;
}
/* The following elements are the ones that make the actual dynamics */
- p-personal:hover h5, #mw_portlets .portlet:hover h5 {
border-top:2px solid #3c78b5;
background-color:#036;
}
- p-personal li a:hover, #mw_portlets li a:hover {
text-decoration:underline;
color:#036;
}
- p-personal li:hover, #mw_portlets li:hover {
background-color:#ddd;
}
- p-personal:hover div.pBody, #mw_portlets .portlet:hover div.pBody {
display:block;
}
- p-personal:hover, #mw_portlets .portlet:hover {
-moz-box-shadow:#aaa 5px 5px 5px -2px;
}
- p-search.portlet:hover {
-moz-box-shadow:#aaa -2px 5px 5px -2px;
}
/****************************
#p-lang module
- /
- p-lang {
position:fixed;
top:6em;
max-height:80%;
left:-200px;
width:200px;
border-right:10px solid orange;
}
- p-lang div.pBody {
display:block;
border-bottom:1px solid #036;
}
- p-lang h5 {
height:1.1em;
}
- p-lang:hover h5 {
height:1em;
}
- p-lang:hover {
position:fixed;
top:6em;
left:0;
border:1px solid #036;
border-bottom:5px solid #036;
overflow:auto;
}
- p-lang:hover .pBody, #p-lang.portlet:hover h5 {
border:0;
}
/* v1.1.4 */