Add native blog template and add breadcrumbs to navbar

- Replace dummy breadcrumbs with working one
- Remove font setting from reset
- Correct footer title spacing
- Remove margin from page-head

foundation/public/css/reset.css

@@ -15,22 +15,6 @@
 	box-sizing: border-box;
 }
 
-html {
-	font-family: sans-serif;
-	-webkit-text-size-adjust: 100%;
-	-ms-text-size-adjust: 100%;
-	-ms-overflow-style: scrollbar;
-	-webkit-tap-highlight-color: transparent;
-	line-height: 1.62;
-	font-size: 14px;
-}
-
-@media screen and (min-width: 1199px) {
-	html {
-		font-size: 16px;
-	}
-}
-
 @-ms-viewport {
 	width: device-width;
 }
@@ -50,11 +34,6 @@ section {
 }
 
 body {
-	margin: 0;
-	font-weight: 400;
-	text-align: left;
-	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica", "Arial", "Noto", "Oxygen-Sans", "Noto Sans", "Ubuntu", "Cantarell", sans-serif, "Apple Color Emoji", "Noto Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-	color: #36414c;
 	font-feature-settings: "kern" 1;
 	font-kerning: normal;
 	text-rendering: optimizeLegibility;
@@ -78,6 +57,7 @@ h5,
 h6 {
 	margin: 0;
 	font-weight: 500;
+	line-height: 1;
 }
 
 p {

foundation/public/less/erpnext-org-theme.less

@@ -15,9 +15,8 @@
 	fill: var(--dark-grey);
 	height: 1rem;
 	width: 1rem;
-
 	position: absolute;
 	left: 1rem;
-	top:  50%;
+	top: 50%;
 	transform: translateY(-50%);
 }

foundation/templates/base.html

@@ -3,20 +3,13 @@
     {% block meta_block %}{% endblock %}
 
     <link href="/assets/foundation/css/erpnext-org-theme.css" rel="stylesheet">
-
-    {% if path != '' %}
-        <link type="text/css" rel="stylesheet" href="/assets/frappe/css/hljs.css">
-        <link type="text/css" rel="stylesheet" href="/assets/frappe/css/font-awesome.css">
-        <link type="text/css" rel="stylesheet" href="/assets/frappe/css/octicons/octicons.css">
-    {% endif %}
-
     {% if path == 'contact' %}
         <link type="text/css" rel="stylesheet" href="/assets/foundation/css/bootstrap-for-webform.css">
     {% endif %}
 {% endblock %}
 
 {% block body %}
-<body class="container m0auto page-shadow" data-path="{{ path }}">
+<body class="container m0auto page-shadow text-dark-grey" data-path="{{ path }}">
     {%- block navbar -%}{% include "templates/includes/navbar/navbar.html" %}{%- endblock -%}
     {% block content %}
     {{ content }}

foundation/templates/includes/footer/footer.html

@@ -1,7 +1,7 @@
 <footer>
 	<div class="border-top flex space-between p4">
 		<div >
-			<h3>Industries</h3>
+			<h3 class="h3 text-black mb1">Industries</h3>
 			<ul class="list-unstyled">
 				<li>
 					<a  href="/docs/user/manual/en/manufacturing">Manufacturing</a>
@@ -30,7 +30,7 @@
 			</ul>
 		</div>
 		<div >
-			<h3>Foundation</h3>
+			<h3 class="h3 text-black mb1">Foundation</h3>
 			<ul class="list-unstyled">
 				<li>
 					<a  href="/about">About</a>
@@ -59,7 +59,7 @@
 			</ul>
 		</div>
 		<div >
-			<h3>Community</h3>
+			<h3 class="h3 text-black mb1">Community</h3>
 			<ul class="list-unstyled">
 				<li>
 					<a  href="/chapters">Chapters</a>
@@ -88,7 +88,7 @@
 			</ul>
 		</div>
 		<div >
-			<h3>Documentation</h3>
+			<h3 class="h3 text-black mb1">Documentation</h3>
 			<ul class="list-unstyled">
 				<li>
 					<a  href="/docs/user/manual">Manual</a>
@@ -100,10 +100,10 @@
 					<a  href="/docs/current">ERPNext Model & API</a>
 				</li>
 			</ul>
-			<h3>Find Us On</h3>
+			<h3 class="h3 text-black mt2  mb1">Find Us On</h3>
 			<ul class="list-unstyled">
 				<li>
-					<a  href="https://twitter.com/erpnext" target="_blank">Twitter</a>,
+					<a  href="https://twitter.com/erpnext" target="_blank">Twitter</a>
 				</li>
 				<li>
 					<a  href="https://www.facebook.com/ERPNext/" target="_blank">Facebook</a>
@@ -116,7 +116,7 @@
 	</div>
 			<div class="p4 border-top">
 				<div class="bottom-spacer">
-					<span>&copy; <span id="year"></span> ERPNext Open Source Software Foundation. Content licensed under <a  href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank"> CC-BY-SA 3.0</a> | <a href="/terms" >Terms of use</a>.</span>
+					<span>&copy; <span id="year"></span> ERPNext Open Source Software Foundation. Content licensed under <a  href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank"> CC-BY-SA 3.0</a> Read the <a href="/terms" >Terms of use</a>.</span>
 				</div>
 			</div>
 	<script type="text/javascript">

foundation/templates/includes/navbar/navbar.html

@@ -1,20 +1,26 @@
-<nav class="navbar top-sticky bg-light" role="navigation">
+<nav class="navbar top-sticky bg-white" role="navigation">
 	<div class="flex space-between align-item-center border-bottom ph4 pv2">
 		<div class="left flex align-item-center">
-			<a class="logo flex align-item-center p1" href="{{ url_prefix }}{{ home_page or "/"}}">
+			<a class="logo flex align-item-center pr1" href="{{ url_prefix }}{{ home_page or "/"}}">
 				<img class="logo-img" src="/assets/foundation/img/erpnext-logo.svg" alt="Open Source ERP Software">
 			<!-- <span>ERPNext.org</span> -->
 			</a>
-			<ul class="list-unstyled flex">
+			<!-- breadcrumbs -->
-				<li>
+			{% if parents and parents|length > 0 %}
-					<span class="fg-light-grey">&#10095;</span>
+			<ul class="breadcrumb list-unstyled flex" itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
-					<a class="hover:bg-light-grey p1 border-radius" href="">Service Providers</a>
+				<span class="text-dark-grey">&#10093;</span>
-				</li>
+				{% for parent in parents %}
-				<li>
+					<li>
-					<span class="fg-light-grey">&#10095;</span>
+						<a class="hover:bg-light-grey p1 border-radius" href="{{ url_prefix }}{{ parent.route | abs_url }}" itemprop="url">
-					<a class="hover:bg-light-grey p1 border-radius" href="">Cloud8</a>
+						<span itemprop="title">{{ parent.title or parent.label or parent.name or "" }}</span>
-				</li>
+						</a>
+						<span class="text-dark-grey">&#10093;</span>
+					</li>
+				{% endfor %}
+				<li class="pl1 text-black"><span itemprop="title">{{ title or "" }}</span></li>
 			</ul>
+			{% endif %}
+			<!-- breadcrumbs -->
 		</div>
 		<div class="right flex align-item-center">
 			{% include 'foundation/templates/includes/search-box.html' %}

foundation/templates/includes/page-head.html

@@ -1,12 +1,10 @@
-<header class="page-head flex space-between align-item-center mb4">
+<header class="page-head flex space-between align-item-center">
 	<div class="ellipsis">
-		<h1 class="h1 mb0">
+		<h1 class="h1 text-black">
 			{{ title }}
 		</h1>
 	</div>
 	<div class="">
-		<button class="btn">Refresh</button>
-		<button class="btn btn-blue">New</button>
 		{% if self.header_actions() %}
 		<div class="page-header-actions-block">
 			{% block header_actions %}{% endblock %}

foundation/website/doctype/blog_post/templates/blog_post.html

@@ -0,0 +1,37 @@
+{% extends "foundation/templates/web.html" %}
+{% block meta_block %}
+	{% include "templates/includes/meta_block.html" %}
+{% endblock %}
+{% block page_content %}
+<article class="blog-content" itemscope itemtype="http://schema.org/BlogPosting">
+	<div class="blog-info">
+	<p class="post-by">
+		<a href="/blog?blogger={{ blogger }}" class="no-decoration">{{ _("By") }} {{ blogger_info and blogger_info.full_name or full_name }}</a>
+		Posted on {{ frappe.format_date(published_on) }} in <a href="/blog?blog_category={{ blog_category }}" class="no-decoration">{{ category.title }}</a> .{{ comment_text }}
+	</p>
+	</div>
+	<div itemprop="articleBody" class="longform blog-text">
+	{{ content }}
+	</div>
+</article>
+{% if blogger_info %}
+<div class="flex align-item-center mb4">
+	<div class="thumb-medium pr2">
+	<img itemprop="thumbnailUrl" src="{{ blogger_info.avatar or "/assets/frappe/images/default-avatar.png" }}" />
+	</div>
+	<div class="inline-block">
+		<h3 class="h3">
+			<a href="/blog?blogger={{ blogger_info.name }}">{{ blogger_info.full_name }}</a>
+		</h3>
+		<p class="text-light-grey">{%if blogger_info.bio %}{{ blogger_info.bio }}{% endif %}</p>
+	</div>
+</div>
+{% endif %}
+<div class="blog-comments pv4 border-top">
+	{% include 'templates/includes/comments/comments.html' %}
+</div>
+</div>
+<script>
+    frappe.ready(function() { frappe.set_search_path("/blog"); })
+</script>
+{% endblock %}

foundation/website/doctype/blog_post/templates/blog_post_row.html

@@ -0,0 +1,35 @@
+{%- set post = doc -%}
+<div class="web-list-item blog-list-item">
+	<div class="row">
+		<div class="col-xs-12">
+			<h1><a href="/{{ post.route }}">{{ post.title }}</a></h1>
+			{% if post.cover_image %}
+			<p>
+				<img  class="blogpost-cover-img" src="{{ post.cover_image }}" alt="{{post.title}} - Cover Image">
+			</p>
+			{% endif %}
+			<p class="post-description">{{ post.intro }}</p>
+
+			<div>
+				<div class="inline-block" style="vertical-align: top">
+					<div class="avatar">
+						<img itemprop="thumbnailUrl" src="{{ post.avatar or "/assets/frappe/images/default-avatar.png" }}" />
+					</div>
+				</div>
+				<div class="inline-block" style="width: calc(100% - 100px)">
+					<div class='text-muted'>
+						<a href="/blog?blogger={{ post.blogger }}">{{ post.full_name }}</a>
+					</div>
+					<div class="text-muted small">
+						{{ frappe.format_date(post.published_on) }}
+						{% if post.comments %}
+						<span style='display: inline-block; margin-left: 10px;'>
+						<i class='octicon octicon-comment-discussion'></i> {{ post.comments }}
+						</span>
+						{% endif %}
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>