Level-specific Macronavigation

Objects appear as list elements; their type is represented by a corresponding bullet image.

 

DTML

The macronavigation is wrapped by a DIV element - furthermore by additional definitionlist elements so that browser-independently outside spacings can be kept homogenous.
The function filteredChildNodes(REQUEST,PAGES) provides a list of all page objects; with the integer function the Boolean values false/true are transformed from the check of the current object into a numeric value (0/1); accordingly the CSS classes for documents (doc0: non-active document, doc1: active document). An equivalent with folder containers is unnecessary because in this case always the sub-objects are listed but not the object itself.

<!-- pageelement_Macronavigation -->
<dtml-call "REQUEST.set('_this',getSelf())">
<dtml-call "REQUEST.set('_this_top',getSelf(['ZMSRubrik','ZMSSysFolder']))">
<div id="Macronavigation">
<dl>
<dd>
<ul>
<dtml-in "REQUEST['_this_top'].filteredChildNodes(REQUEST,PAGES)">
<dtml-unless "isResource(REQUEST)">
<dtml-if "REQUEST['thisObj'].getParentByLevel(1).id in absolute_url().split('/')">
<dtml-let highlightThis="_.int(REQUEST['thisObj'].id==id)">
<dtml-if "isMetaType(['ZMSRubrik','ZMSSysFolder'])"><li 
  class="folder"><dtml-else><li 
  class="doc&dtml-highlightThis;"></dtml-if><a 
  href="<dtml-var "getHref2IndexHtml(REQUEST,deep=1)">"><dtml-var 
 "string_maxlen(getTitlealt(REQUEST),18)"></a></li>
</dtml-let>
</dtml-if>
</dtml-unless>
</dtml-in>
</ul>
</dd>
</dl>
</div>
<!-- /pageelement_Macronavigation -->

CSS

The following CSS intends to display spaces and relative font sizes browser-independently; therefore some known "hacks" are used:

• "font size hack": ensures that the relative (but also absolute) font sizes look identical; the hack makes use of a bug in Internet-Explorer
• "box model hack": the commonly used code for incorrect border/widths behavoiur of IE can here be used for normalising the list indentation. In Firefox the list indentations are deeper than in IE; the adjustment for Firefox makes -8px.

The referencing of bullet images is done via the path variable 'ZMS_COMMON'; here the entity syntax is used instead of the tag call so that the rough code cannot cause errors.

/*-------------------------*/
/*-----Macronavigation-----*/
/*-------------------------*/
div#Macronavigation {
	padding: 0;
	border: 0;
	margin-top: 50px;
	}
#Macronavigation dl,
#Macronavigation dt, 
#Macronavigation dd  {
	margin: 0;
	padding: 0;
	border:0;
	}
#Macronavigation ul li {
	margin: 0;
	padding: 0;
	border: 0;
	margin-top: 5px;
	line-height: 1.25em;
	font-size: small;
	}
/*----- font size hack -----*/
/*/*/a{}
body #Macronavigation ul li {
font-size : x-small;
}
html>head:first-child+body #Macronavigation ul li {
font-size : small;
}
/* */
/*----- /font size hack -----*/

#Macronavigation ul li.folder	{
	list-style: disc url(&dtml-ZMS_COMMON;/iconfolder.gif) inside;
	}	
#Macronavigation ul li.doc0,
#Macronavigation ul li.doc1 {
	list-style: disc url(&dtml-ZMS_COMMON;/icondoc.gif) inside;
	}
#Macronavigation ul li.doc1 {
	font-weight: bold;
	}
#Macronavigation ul li a {
/*-------box model hack-------*/
	margin-left: -8px !important;
	margin-left: 0px;
	margin-left/**/:/**/-0px;
	}