vb.org Archive - Miscellaneous Hacks - Alternative Breadcrumbs for your vB4

I've done some changes on it to work with rtl

Note: I've changed also some colors to work with my forum.

Code:

.bread_box {

        margin: 0;

        overflow: hidden;

        clear: both;

}

.breadcrumb {

        position: relative;

        font: 11px Tahoma;

        background: {vb:stylevar sidebar_background};

        border: {vb:stylevar sidebar_border}; /* this is the border color that's around the whole thing */

        -moz-border-radius:{vb:stylevar border_radius};

        -webkit-border-radius: {vb:stylevar border_radius};

        border-radius: {vb:stylevar border_radius};

        overflow: hidden;

}

.breadcrumb .crust {

        display: block;

        float: right;

        position: relative;

}

.breadcrumb .crust:first-child a.crumb {

        padding-right: 13px;

        -moz-border-radius-topleft:{vb:stylevar border_radius};

        -moz-border-radius-bottomleft:{vb:stylevar border_radius};

        -webkit-border-top-left-radius: {vb:stylevar border_radius};

        -webkit-border-bottom-left-radius: {vb:stylevar border_radius};

        border-top-left-radius: {vb:stylevar border_radius};

        border-bottom-left-radius: {vb:stylevar border_radius};

}

.breadcrumb .crust a.crumb, .breadcrumb .crust b.lastcrumb {

        text-decoration: none;

        background-color: {vb:stylevar sidebar_background.backgroundColor}; /* this is the background color of the CRUMBS, ie: the links */

        padding: 0 23px 0 10px;

        border-bottom: {vb:stylevar sidebar_border}; /* this is the same as the border value higher up, this only shows if the last crumb causes it to overflow */

        margin-bottom: -1px;

        outline: 0 none;

        -moz-outline-style: 0 none;

        display: block;

        line-height: 22px;

        _border-bottom: none;

        color:{vb:stylevar link_color}; /* this is the color of the links in the crumbs */

        text-decoration:{vb:stylevar link_textDecoration};

}

.breadcrumb .crust b.lastcrumb {

        background: transparent none;

        color: #02485c; /* this is the color of the last crumb, ie: the final destination */

        font-weight: bold;

}

.breadcrumb .crust a.crumb, .breadcrumb .crust b.lastcrumb {

        line-height: 22px;

}

.breadcrumb .crust .arrow {

        border: 12px solid transparent;

        border-left: 1px none black;

        border-right: {vb:stylevar sidebar_border}; /* this is the _background_ color of the "arrow" */

        border-right-width: 12px !important;

        border-right-style: solid !important;

        display: block;

        position: absolute;

        left: -12px;

        top: -1px;

        z-index: 50;

        width: 0px;

        height: 0px;

}

.breadcrumb .crust .arrow span {

        border: 12px solid transparent;

        border-left: 1px none black;

        border-right-color: {vb:stylevar sidebar_background.backgroundColor}; /* this is the border color of the "arrow" */

        display: block;

        position: absolute;

        right: -13px;

        top: -12px;

        z-index: 51;

        white-space: nowrap;

        overflow: hidden;

        text-indent: 9999px;

        width: 0px;

        height: 0px;

}

.breadcrumb .refresh:hover { background-position: 0px -16px; }

.breadcrumb .crust:last-child a.crumb { font-weight: bold; }

.breadcrumb .crust:hover a.crumb { 

        background-color:#d6e4f7; /* this is the background color of the crumb when it's hovered */

        color:{vb:stylevar linkhover_color}; /* likewise, this is the color of the crumb's link when hovered */

        text-decoration:{vb:stylevar linkhover_textDecoration}; 

}

.breadcrumb .crust:hover .arrow span { 

        border-right-color:#d6e4f7; /* this is the color of the "arrow" when hovered. It should be identical to the `.breadcrumb .crust:hover a.crumb` background value */

}

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01106 seconds Memory Usage 1,741KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (1)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (3)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: