CMS Made Simple Forums

Code: Select all

#menu {
width: 100%;
height:140px;
background: url(images/schatten.jpg) no-repeat;
font-family: 'crimson text';
font-size: 150%;
}
#menu ul /* alle listen */
{
padding: 0;
margin: 0 0 0 30px;
list-style:none;
line-height:1;
}

#menu a
{
display: block;
color: #fff;
padding:0 0 7px 20px ;
margin: 5px 0 0 20px;
text-decoration:none;
}

#menu a:hover {
background: url(images/menulist.gif) no-repeat ;
}


#menu a.currentpage {
background: url(images/menulist.gif) no-repeat ;
}

#menu a:activeparent {}

#menu li /* all list items */
{
float:left;
width: 150px;
}

#menu li ul /* second-level lists */
{
position:  absolute;
padding: 0;
background:#C5CFC8;
display:block;
line-height: 80%;
margin: 0 0 0 20px;
width: 180px;
left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
        }

#menu li ul li /* second-level lists */
{
width: 180px;
left:                         -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

#menu li ul a {
display:block;
margin: 0;
border-bottom: 2px solid #fff;
padding:2px 0 2px 20px;
font-size: 90%;
color: #525253;
}


#menu li ul  a:hover {
color: #fff;
background:  #525253;
}


#menu li:hover ul ul, #menu li:hover ul ul ul, #menu li.sfhover ul ul, #menu li.sfhover ul ul ul
        {
        left: -999em;
        }

#menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul, #menu li li li.sfhover ul /* lists nested under hovered list items */
        {
        left: auto;

        }

Code: Select all

{* CSS classes used in this template:
.activeparent - The top level parent when a child is the active/current page
li.active0n h3 - n is the depth/level of the node. To style the active page for each level separately. The active page is not clickable.
.clearfix - Used for the unclickable h3 to use the entire width of the li, just like the anchors. See the Tools stylesheet in the default CMSMS installation.
li.sectionheader h3 - To style section header
li.separator - To style the ruler for the separator *} 

{if $count > 0}
<ul>
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $node->current == true}
<li><a class="currentpage" href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->menutext}</a>

{elseif $node->parent == true}
<li class="activeparent"><a class="activeparent" href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
<li class="sectionheader">{$node->menutext}

{elseif $node->type == 'separator'}
<li class="separator" style="list-style-type: none;"> |


{else}
<li><a href="{$node->url}"{if $node->accesskey != ''} accesskey="{$node->accesskey}"{/if}{if $node->tabindex != ''} tabindex="{$node->tabindex}"{/if}{if $node->titleattribute != ''} title="{$node->titleattribute}"{/if}{if $node->target != ''} target="{$node->target}"{/if}>{$node->menutext}</a>

{/if}

{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}

Code: Select all

#menu li.activeparent ul,
#menu li.activeparent ul li,
#menu li.currentpage ul,
#menu li.currentpage ul li {
    left: auto;
}

#menu li.activeparent ul li ul,
#menu li.activeparent ul li ul li,
#menu li.currentpage ul li ul,
#menu li.currentpage ul li ul li {
    left: -999em;
}