SOS-1054 Embedding Breadcrumb Portlet in SO Theme

mhan810 · May 4, 2012 · 2990aaf · 2990aaf
1 parent b3f06e6
commit 2990aaf
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 12 deletions.
diff --git a/themes/so-theme/docroot/_diffs/css/custom.css b/themes/so-theme/docroot/_diffs/css/custom.css
@@ -30,7 +30,7 @@ a:hover {
 	position: static;
 }
 
-#skip-to-content, #navigation h1, .opens-new-window-accessible, #toggleFluid span {
+#skip-to-content, #navigation h1, .opens-new-window-accessible, #toggleFluid span, .site-breadcrumbs h1 {
 	clip: rect(0 0 0 0);
 	position: absolute;
 	text-indent: -9999em;
@@ -826,21 +826,53 @@ input[type=submit], input[type=button], input[type=reset], .aui-state-hover, .co
 
 /* Breadcrumbs */
 
-.breadcrumbs .last {
+.site-breadcrumbs {
+	margin: 0 0 5px;
+	padding-top: 5px;
+	width: auto;
+}
+
+.site-breadcrumbs ul {
+	background-color: #FFF;
+}
+
+.site-breadcrumbs li {
 	background-image: none;
+	margin-right: 0;
+	padding-left: 0.75em;
+	padding-right: 0;
 }
 
-.breadcrumbs-horizontal {
-	li {
-		background: transparent url(../images/arrows/05_right.png) no-repeat scroll 100% 50%;
-		margin-right: 5px;
-		max-width: 50%;
-		padding-right: 15px;
-	}
+.site-breadcrumbs li span {
+	background: url(@theme_image_path@/common/breadcrumbs.png) no-repeat 100% 50%;
+	margin-right: 5px;
+	max-width: 50%;
+	padding-right: 15px;
+}
 
-	.last {
-		margin-top: 0.2em;
-	}
+.site-breadcrumbs li span a {
+	text-decoration: none;
+}
+
+.site-breadcrumbs li.first a {
+	color: #369;
+	font-weight: bold;
+}
+
+.site-breadcrumbs li.last a {
+	color: #4B5567;
+	font-size: 1.3em;
+}
+
+.site-breadcrumbs .last {
+	font-size: 1em;
+	margin-top: 0.2em;
+	padding-right: 0;
+}
+
+.site-breadcrumbs .last span {
+	background-image: none;
+	padding: 0;
 }
 
 /* Calendar */

diff --git a/themes/so-theme/docroot/_diffs/templates/portal_normal.vm b/themes/so-theme/docroot/_diffs/templates/portal_normal.vm
@@ -84,6 +84,14 @@ $theme.include($body_top_include)
 	</header>
 
 	<div id="content">
+		<nav class="site-breadcrumbs" id="breadcrumbs">
+			<h1>
+				<span>#language("breadcrumbs")</span>
+			</h1>
+
+			#breadcrumbs()
+		</nav>
+
 		<div id="so-sidebar">
 			#if ($page_group.isUser())
 				<div class="$user_detail_class">