I did the Breadcrumb mod myself. It is not that hard
in the navbar template find:
Code:
<div id="breadcrumb" class="breadcrumb">
<ul class="floatcontainer">
<li class="navbithome"><a href="index.php{vb:raw session.sessionurl_q}" accesskey="1"><img src="{vb:stylevar imgdir_misc}/navbit-home.png" alt="{vb:rawphrase home}" /></a></li>
{vb:raw navbits.breadcrumb}
{vb:raw navbits.lastelement}
</ul>
<hr />
</div>
and replace it with:
Code:
<div class="breadBoxTop">
<fieldset class="breadcrumb">
<ul class="crumbs">
{vb:raw navbits.breadcrumb}
{vb:raw navbits.lastelement}
</fieldset>
<br />
</div>
in the navbar_link template find:
Code:
<vb:if condition="$show['breadcrumb']">
<li class="navbit"><a href="{vb:raw nav_url}">{vb:raw nav_title}</a></li>
<vb:else />
<li class="navbit lastnavbit"><span>{vb:raw nav_title}</span></li>
</vb:if>
and replace it with:
Code:
<vb:if condition="$show['breadcrumb']">
<li class="crust">
<a href="{vb:raw nav_url}" class="crumb"><span>{vb:raw nav_title}</span></a>
<span class="arrow"><span>></span></span></li>
<vb:else />
<li class="crust">
<p class="crumb">{vb:raw nav_title}</p>
<span class="arrow"><span>></span></span></li>
</ul>
</vb:if>
in additional.css add:
Code:
/*------------------------------------------------------------------------------
| #> Breadcrumb Xenforo Style by AdSenseExperts.com
+-----------------------------------------------------------------------------*/
.breadBoxTop { }
.breadBoxTop .topCtrl { margin-left: 5px; float: right; line-height: 24px; }
.breadcrumb { font-size: 11px; background: #F2F6F8 url('images/gradients/category-23px-light.png') repeat-x top; border: 1px solid #A5CAE4; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; overflow: hidden; zoom: 1; }
.breadcrumb .crust { display: block; float: left; position: relative; zoom: 1; }
.breadcrumb .crust a.crumb { text-decoration: none; background-color: #F2F6F8; padding: 0 10px 0 18px; margin-bottom: -1px; border-bottom: 1px solid #A5CAE4; outline: 0 none; -moz-outline-style: 0 none; display: block; line-height: 24px; _border-bottom: none; }
.breadcrumb .crust p.crumb { text-decoration: none; background-color: #F2F6F8; padding: 0 10px 0 18px; margin-bottom: -1px; border-bottom: 1px solid #A5CAE4; outline: 0 none; -moz-outline-style: 0 none; display: block; line-height: 24px; _border-bottom: none; }
.breadcrumb .crust:first-child a.crumb { padding-left: 10px; border-top-left-radius: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; -khtml-border-top-left-radius: 4px; border-bottom-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -khtml-border-bottom-left-radius: 4px; }
.breadcrumb .crust:last-child a.crumb { font-weight: normal; -moz-border-radius-bottomleft:4px; -moz-border-radius-topleft:4px; padding-left:20px; pointer-events: none; cursor: default; background-color: #F7F9FA; color: #333333; }
.breadcrumb .crust:last-child p.crumb { font-weight: normal; -moz-border-radius-bottomleft:4px; -moz-border-radius-topleft:4px; padding-left:20px; pointer-events: none; cursor: default; background-color: #F7F9FA; color: #333333; }
.breadcrumb .crust .arrow { border: 12px solid transparent; border-right: 1px none black; border-left-color: #A5CAE4; display: block; position: absolute; right: -12px; top: 0px; z-index: 50; width: 0px; height: 0px; }
.breadcrumb .crust .arrow span { border: 12px solid transparent; border-right: 1px none black; border-left-color: #F2F6F8; display: block; position: absolute; left: -13px; top: -12px; z-index: 51; white-space: nowrap; overflow: hidden; text-indent: 9999px; width: 0px; height: 0px; }
.breadcrumb .crust:hover:last-child a.crumb { background-color: #F7F9FA; }
.breadcrumb .crust:hover a.crumb { background-color: #d7edfc; }
.breadcrumb .crust:hover:last-child .arrow span { border-left-color: #F7F9FA; }
.breadcrumb .crust:hover .arrow span { border-left-color: #d7edfc; }
.breadcrumb .crust .arrow { /* hide from IE6 */ _display: none; }
E Voila