Umbraco Razor Syntax for Breadcrumb

Recently Umbraco team released new version 4.6.1 for Umbraco CMS engine and one of the great feature they added was the support for Razor syntax.  Yes, Umbraco now supports Razor syntax. And for those guys, including me, who dislike XSLTs, this is a great alternate for them.  Now we can write the logic in C# rather then in XSLT. Thanks Umbraco Team!!!.

Below is the code snipped for generating Breadcrumb from current page to Home page with node level=1

@using System
@using umbraco
@{ var currentPg = Model; }
@{ var crumText = string.Empty; }
@while(currentPg.Level > 1)   
{
  @if (currentPg.Level == Model.Level) 
      crumText = string.Format("<li>{0}</li>", currentPg.Name) + crumText;
  else 
      crumText = string.Format("<li><a href=\"{0}\">{1}</a></li>", currentPg.Url, currentPg.Name) + crumText;
  currentPg = currentPg.Parent;
}
@{ crumText = string.Format("<li><a href=\"{0}\">{1}</a></li>", currentPg.Url, currentPg.Name) + crumText; }
<ul id="breadcrumbs" >@crumText</ul>

And this can be butified with following sample CSS:

ul, li 

{

    list-style-type: none;

    margin: 0;

    padding: 0;

}

#breadcrumbs 

{

    background-color: #FFFFFF;

    font-size: 11px;

    font-weight: bold;

    line-height: 20px;

    margin-bottom: 15px;

    overflow: auto;

}

#breadcrumbs li 

{

    color: #FF9900;

}

#breadcrumbs li 

{

    float: left;

    padding-left: 8px;

}

#breadcrumbs li a:link, #breadcrumbs li a:visited 

{

    color: #003366;

    text-decoration: none;

}

#breadcrumbs li a 

{

    background: url("../images/rambling/blue_arrow.png") no-repeat scroll right center transparent;

    padding: 0 24px 2px 0;

}