Add edit button

README.md

@@ -1,5 +1,7 @@
 # Hugo Docs
 
+<https://hugodocsconcept.netlify.com>
+
 **Currently In Development.** This Hugo Docs concept is an attempt at implementing the new docs source organization found here:
 
 <https://discuss.gohugo.io/t/proposed-source-organization-for-hugo-docs-concept/4506>

config.toml

@@ -77,6 +77,8 @@ watch = true
   removefromexternalsearch = true
   ## This is used when the BaseURL does not need to modified (eg, in share links)
   siteaddress = "https://gohugo.io"
+  ## GitHub Repository Base URL (should contain /edit/master/ to automatically link to edit-ready version of file and also include closing slash)
+  ghrepourl = "https://github.com/rdwatters/hugo-docs-concept/edit/master/content/"
   gtmid = ""
   # Set to true to include a CDN call to FontAwesome
   usefontawesome = true

content/about-hugo/_index.md

@@ -1,13 +1,78 @@
 ---
-title: About Hugo
+title: Introduction to Hugo
 linktitle:
 description: A general introduction to Hugo, a powerful static site generator written in Golang.
 date: 2016-11-01
 publishdate: 2016-11-01
 lastmod: 2016-11-01
-weight: 40
+weight: 01
 draft: false
 slug:
 aliases:
 notes:
----
+---
+
+## What is Hugo?
+
+Hugo is a general-purpose website framework. Technically speaking, Hugo is
+a static site generator. Unlike systems that dynamically build a page
+with each visitor request, Hugo builds pages when you create
+your content. Since websites are viewed far more often than they are
+edited, Hugo is optimized for website viewing for the end users of your site and an ideal writing experience for authors.
+
+Sites built with Hugo are extremely fast and secure. Hugo sites can
+be hosted anywhere, including [Heroku][], [GoDaddy][], [DreamHost][],
+[GitHub Pages][], [Surge][], [Aerobatic][], [Firebase Hosting][],
+[Google Cloud Storage][], [Amazon S3][], and [CloudFront][] and work well
+with CDNs. Hugo sites run without the need for a database or dependencies on expensive runtimes like Ruby, Python, or PHP.
+
+We think of Hugo as the ideal website creation tool. With nearly instant
+build times and the ability to rebuild whenever a change is made, Hugo
+provides a very fast feedback loop. This is essential when you are
+designing websites, but also very useful when creating content.
+
+## How Fast is Hugo?
+
+
+## What Does Hugo Do?
+
+In technical terms, Hugo takes a source directory of files and
+templates and uses these as input to create a complete website.
+
+## Who Should Use Hugo?
+
+Hugo is for people that prefer writing in a text editor over
+a browser.
+
+Hugo is for people who want to hand code their own website without
+worrying about setting up complicated runtimes, dependencies and
+databases.
+
+Hugo is for people building a blog, company site, portfolio, tumblog,
+documentation, single-page website, or a website with thousands of
+pages.
+
+
+[Aerobatic]: https://www.aerobatic.com/
+[Amazon S3]: http://aws.amazon.com/s3/
+[CloudFront]: http://aws.amazon.com/cloudfront/ "Amazon CloudFront"
+[DreamHost]: http://www.dreamhost.com/
+[Firebase Hosting]: https://firebase.google.com/docs/hosting/
+[GitHub Pages]: https://pages.github.com/
+[GitLab]: https://about.gitlab.com
+[Go language]: http://golang.org/ "The Go Programming Language"
+[GoDaddy]: https://www.godaddy.com/
+[Google Cloud Storage]: http://cloud.google.com/storage/
+[Heroku]: https://www.heroku.com/
+[Jekyll]: http://jekyllrb.com/
+[Middleman]: https://middlemanapp.com/
+[Nanoc]: http://nanoc.ws/
+[Surge]: https://surge.sh
+
+## Next Steps
+
+ * [Install Hugo](/overview/installing/)
+ * [Quick start](/overview/quickstart/)
+ * [Join the Mailing List](/community/mailing-list/)
+ * [Star us on GitHub](https://github.com/spf13/hugo)
+ * [Discussion Forum](http://discuss.gohugo.io/)

content/about-hugo/hugo-features.md

@@ -5,18 +5,16 @@ description: Hugo is the fastest static site generator and includes a powerful t
 date: 2016-11-01
 publishdate: 2016-11-01
 lastmod: 2016-11-01
-weight:
+weight: 10
 draft: false
 slug:
-aliases: []
+aliases: [/about-hugo/features]
 notes:
 ---
 
-Hugo boasts the following features:
-
 ## General
 
-* Extremely fast build times (≈1 ms per page)
+* Extremely fast build times (<1 ms per page)
 * Completely cross platform: Runs on <i class="fa fa-apple"></i>&nbsp;Mac OS&nbsp;X, <i class="fa fa-linux"></i>&nbsp;Linux, <i class="fa fa-windows"></i>&nbsp;Windows, and more!
 * Easy [installation](/overview/installing/)
 * Render changes [on the fly](/overview/usage/) with [LiveReload](/extras/livereload/) as you develop

content/about-hugo/introduction-to-hugo.md

@@ -1,80 +0,0 @@
----
-title: Introduction to Hugo
-linktitle:
-description: An introduction to Hugo and the impetus for its creation.
-date: 2016-11-01
-publishdate: 2016-11-01
-lastmod: 2016-11-01
-weight: 10
-draft: false
-slug:
-aliases: [/overview/introduction]
-notes:
----
-
-## What is Hugo?
-
-Hugo is a general-purpose website framework. Technically speaking, Hugo is
-a static site generator. Unlike systems that dynamically build a page
-with each visitor request, Hugo builds pages when you create
-your content. Since websites are viewed far more often than they are
-edited, Hugo is optimized for website viewing for the end users of your site and an ideal writing experience for authors.
-
-Sites built with Hugo are extremely fast and secure. Hugo sites can
-be hosted anywhere, including [Heroku][], [GoDaddy][], [DreamHost][],
-[GitHub Pages][], [Surge][], [Aerobatic][], [Firebase Hosting][],
-[Google Cloud Storage][], [Amazon S3][], and [CloudFront][] and work well
-with CDNs. Hugo sites run without the need for a database or dependencies on expensive runtimes like Ruby, Python, or PHP.
-
-We think of Hugo as the ideal website creation tool. With nearly instant
-build times and the ability to rebuild whenever a change is made, Hugo
-provides a very fast feedback loop. This is essential when you are
-designing websites, but also very useful when creating content.
-
-## How Fast is Hugo?
-
-
-## What Does Hugo Do?
-
-In technical terms, Hugo takes a source directory of files and
-templates and uses these as input to create a complete website.
-
-## Who Should Use Hugo?
-
-Hugo is for people that prefer writing in a text editor over
-a browser.
-
-Hugo is for people who want to hand code their own website without
-worrying about setting up complicated runtimes, dependencies and
-databases.
-
-Hugo is for people building a blog, company site, portfolio, tumblog,
-documentation, single-page website, or a website with thousands of
-pages.
-
-
-[Aerobatic]: https://www.aerobatic.com/
-[Amazon S3]: http://aws.amazon.com/s3/
-[CloudFront]: http://aws.amazon.com/cloudfront/ "Amazon CloudFront"
-[DreamHost]: http://www.dreamhost.com/
-[Firebase Hosting]: https://firebase.google.com/docs/hosting/
-[GitHub Pages]: https://pages.github.com/
-[GitLab]: https://about.gitlab.com
-[Go language]: http://golang.org/ "The Go Programming Language"
-[GoDaddy]: https://www.godaddy.com/
-[Google Cloud Storage]: http://cloud.google.com/storage/
-[Heroku]: https://www.heroku.com/
-[Jekyll]: http://jekyllrb.com/
-[Middleman]: https://middlemanapp.com/
-[Nanoc]: http://nanoc.ws/
-[Surge]: https://surge.sh
-
-## Next Steps
-
- * [Install Hugo](/overview/installing/)
- * [Quick start](/overview/quickstart/)
- * [Join the Mailing List](/community/mailing-list/)
- * [Star us on GitHub](https://github.com/spf13/hugo)
- * [Discussion Forum](http://discuss.gohugo.io/)
-
-

content/about-hugo/license.md

@@ -5,7 +5,7 @@ description: Information on the Hugo license.
 date: 2016-11-01
 publishdate: 2016-11-01
 lastmod: 2016-11-01
-weight: 20
+weight: 50
 draft: false
 slug:
 aliases: [/meta/license]

content/about-hugo/why-i-built-hugo.md

@@ -5,7 +5,7 @@ description: Hugo is the fastest of all static site generators and includes feat
 date: 2017-02-01
 publishdate: 2017-02-01
 lastmod: 2017-02-01
-weight:
+weight: 30
 draft: false
 slug:
 aliases: []

content/about-hugo/why-use-a-static-site-generator.md

@@ -5,7 +5,7 @@ description:
 date: 2016-02-01
 publishdate: 2016-02-01
 lastmod: 2016-02-01
-weight:
+weight: 20
 draft: false
 slug:
 aliases: []

content/getting-started/_index.md

@@ -1,6 +1,6 @@
 ---
-title: Getting Started with Hugo
-linktitle:
+title: Getting Started with Hugo Docs
+linktitle: Using the Hugo Docs
 description: Description for the Getting Started section.
 date: 2017-02-01
 publishdate: 2017-02-01

content/getting-started/download-hugo.md

@@ -10,4 +10,5 @@ draft: false
 slug:
 aliases: []
 notes:
----
+---
+

content/hosting-and-deployment/_index.md

@@ -1,11 +1,11 @@
 ---
-title: Hosting and Deployment
+title: Hosting and Deployment Overview
 linktitle:
 description: Description for the Hosting and Deployment Section
 date: 2016-11-01
 publishdate: 2016-11-01
 lastmod: 2016-11-01
-weight: 40
+weight: 1
 draft: false
 slug:
 aliases:

content/hosting-and-deployment/deployment-with-rsync.md

@@ -0,0 +1,15 @@
+---
+title: Deployment with rysnc
+linktitle:
+description:
+date: 2017-02-01
+publishdate: 2017-02-01
+lastmod: 2017-02-01
+weight:
+draft: false
+type:
+layout:
+slug:
+aliases: []
+notes:
+---

content/hosting-and-deployment/deployment-with-wercker.md

@@ -0,0 +1,15 @@
+---
+title: Deployment with Wercker
+linktitle:
+description:
+date: 2017-02-01
+publishdate: 2017-02-01
+lastmod: 2017-02-01
+weight:
+draft: false
+type:
+layout:
+slug:
+aliases: []
+notes:
+---

content/hosting-and-deployment/hosting-on-bitbucket.md

@@ -0,0 +1,15 @@
+---
+title: Hosting on Bitbucket
+linktitle:
+description:
+date: 2017-02-01
+publishdate: 2017-02-01
+lastmod: 2017-02-01
+weight:
+draft: false
+type:
+layout:
+slug:
+aliases: []
+notes:
+---

content/hosting-and-deployment/hosting-on-github.md

@@ -0,0 +1,15 @@
+---
+title: Hosting on GitHub
+linktitle:
+description:
+date: 2017-02-01
+publishdate: 2017-02-01
+lastmod: 2017-02-01
+weight:
+draft: false
+type:
+layout:
+slug:
+aliases: []
+notes:
+---

content/hosting-and-deployment/hosting-on-gitlab.md

@@ -1,12 +1,14 @@
 ---
-title: Using the Hugo Docs
+title: Hostingon GitLab
 linktitle:
 description:
 date: 2017-02-01
 publishdate: 2017-02-01
 lastmod: 2017-02-01
-weight: 0
+weight:
 draft: false
+type:
+layout:
 slug:
 aliases: []
 notes:

themes/hugodocs/layouts/_default/baseof.html

@@ -3,7 +3,7 @@
 	{{- partial "site-head.html" . -}}
 <body>
   {{- partial "site-header.html" . -}}
-  <div class="all-content-wrapper" id="all-content-wrapper">
+  <div class="all-content-wrapper{{if .IsHome}} home{{end}}" id="all-content-wrapper">
 	{{block "main" . }}
 	{{end}}
 	</div>

themes/hugodocs/layouts/_default/section.html

@@ -1,11 +1,12 @@
 {{ define "main" }}
 <main class="main">
-	<header>
+	<header class="content-header">
 		<h1>{{with .LinkTitle}}{{ . |markdownify}}{{else}}{{ .Title }}{{end}}</h1>
+		<a role="button" target="_blank" class="edit-link" href="{{.Site.Params.ghrepourl}}{{.File.Path}}"><span class="edit-text">Edit</span> <i class="fa fa-pencil" aria-hidden="true"></i></a>
 	</header>
 	<div class="body-copy">
 	{{.Content}}
-	<span class="last-modified">Updated {{with .Lastmod}}{{.Format "January 2, 2006"}}{{else}}{{.PublishDate.Format "January 2, 2006"}}{{end}}</span>
+	<span class="last-modified">Last Updated: {{with .Lastmod}}{{.Format "January 2, 2006"}}{{else}}{{.PublishDate.Format "January 2, 2006"}}{{end}}</span>
 	</div>
 </main>
 {{ end }}

themes/hugodocs/layouts/_default/single.html

@@ -1,7 +1,8 @@
 {{ define "main" }}
 <main class="main">
-	<header>
-		<h1>{{with .LinkTitle}}{{ . |markdownify}}{{else}}{{ .Title }}{{end}}</h1>
+	<header class="content-header">
+		<h1>{{with .LinkTitle}}{{ . |markdownify}}{{else}}{{ .Title | markdownify }}{{end}}</h1>
+		<a role="button" target="_blank" class="edit-link" href="{{.Site.Params.ghrepourl}}{{.File.Path}}"><span class="edit-text">Edit</span> <i class="fa fa-pencil" aria-hidden="true"></i></a>
 	</header>
 	<div class="body-copy">
 	{{.Content}}

themes/hugodocs/layouts/partials/site-header.html

@@ -1,13 +1,9 @@
 <header id="site-header" class="site-header">
 	<div class="hugo-meta" title="Hugo version {{.Hugo.Version}}, built {{.Hugo.BuildDate}}">
 		<a href="{{.Site.BaseURL}}" id="home-link">
-			<img src="{{"images/hugo-logo-wide.png" | relURL}}" alt="">{{.Hugo.Version}}
+			<img src="{{"images/hugo-logo-wide.png" | relURL}}" alt=""><span class="hugo-v">v{{.Hugo.Version}}</span>
 		</a>
 		<!-- From https://buttons.github.io/. -->
 		<a class="github-button" href="https://github.com/spf13/hugo" data-icon="octicon-star" data-style="mega" data-count-href="/spf13/hugo/stargazers" data-count-api="/repos/spf13/hugo#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star spf13/hugo on GitHub">Star</a>
 	</div>
-	<div class="header-buttons">
-		<a role="button" class="icon-forum" href="https://discuss.gohugo.io" target="_blank">Forum</a>
-		<a role="button" class="icon-mailing-list" href="{{.Site.BaseURL}}mailing-list/">Mailing List</a>
-	</div>
 </header>

themes/hugodocs/layouts/partials/site-navigation.html

@@ -4,22 +4,28 @@
 		{{ $menuitems := .Site.Params.sitemenuitems }}
 		{{ $sitesections := .Site.Sections }}
 		{{ $url := .URL }}
+		{{ $kind := .Kind}}
 		{{ $perma := .Permalink }}
 		{{ range $menuitems }}
 		{{ $menuitem := . }}
 			{{ range $section,$content := $sitesections}}
 				{{if eq $section ($menuitem | urlize)}}
-				<li class="top-menu-item"><a class="top-menu-item-link{{if in $url $section }} active-section{{end}}" href="#">{{ replace $section "-" " "| title }}</a>
-				{{if gt (len $content.Pages) 1 }}
+				<li class="top-menu-item"><a class="top-menu-item-link{{if in $url $section }} active-section{{end}}" href="#">{{ replaceRE "And" "and" (replace $section "-" " "| title) }}</a>
 					<ul class="submenu">
+						{{ with $.Site.GetPage "section" $section }}
+						<li class="submenu-item"><a class="submenu-item-link{{if and (in $perma .URL) (eq $kind "section")}} active-page{{end}}" href="{{.Permalink}}">{{with .LinkTitle}}{{. | markdownify }}{{else}}{{.Title | markdownify}}{{end}}</a></li>
+						{{ end }}
 						{{range $content.Pages}}
-						<li data-pagelink="{{.URL}}" class="submenu-item"><a class="submenu-item-link{{if in $perma .URL}} active-page{{end}}" href="{{.Permalink}}">{{with .LinkTitle}}{{. | markdownify }}{{else}}{{.Title | markdownify}}{{end}}</a></li>
+						<li class="submenu-item"><a class="submenu-item-link{{if in $perma .URL}} active-page{{end}}" href="{{.Permalink}}">{{with .LinkTitle}}{{. | markdownify }}{{else}}{{.Title | markdownify}}{{end}}</a></li>
 						{{end}}
 					</ul>
-				{{end}}
 				</li>
 			{{ end }}
 		{{ end }}
 		{{ end }}
 	</ul>
+	<div class="nav-buttons">
+		<a role="button" class="icon-forum" href="https://discuss.gohugo.io" target="_blank">Community Forum</a><br>
+		<a role="button" class="icon-mailing-list" href="{{.Site.BaseURL}}mailing-list/">Join the Mailing List</a>
+	</div>
 </nav>

themes/hugodocs/pipeline/js/scripts/toggle-navigation.js

@@ -1,3 +1,9 @@
 $('#navigation-toggle').on('click', function() {
-  $('#site-navigation').toggleClass('navigation-open');
+  $('#site-navigation,.all-content-wrapper').toggleClass('navigation-open');
+});
+
+$('#all-content-wrapper').on('click',function(){
+	if($('.site-navigation.navigation-open')){
+		$('.site-navigation.navigation-open,.all-content-wrapper.navigation-open').removeClass('navigation-open');
+	}
 });

themes/hugodocs/pipeline/scss/_variables.scss

@@ -18,12 +18,16 @@ $default-anchor-color:$hugo-pink;
 $default-anchor-weight: inherit;
 $active-color: $default-anchor-color;
 
+//Document Body
+$body-bg-color:$hugo-white;
+
 //Typography
 $base-font-size: 18px;
-$base-font-family: 'proximanova','helvetica neue',helvetica,sans-serif;
+$base-font-family: 'muli','helvetica neue',helvetica,sans-serif;
 $base-font-color: #333333;
 $base-line-height: 1.6;
 $base-font-weight: 300;
+$heading-font-weight: 700;
 
 //Buttons
 $base-button-color: $hugo-blue;

themes/hugodocs/pipeline/scss/base/_base.scss

@@ -18,17 +18,23 @@ body {
   font-family: $base-font-family;
   color: $base-font-color;
   line-height: $base-line-height;
-  font-weight:$base-font-weight;
+  font-weight: $base-font-weight;
 }
 
 body {
-  @include MQALL('font-size', 90% 95% 100%);
+  font-size: 90%;
+  @include MQ(M) {
+    font-size: 95%;
+  }
+  @include MQ(L) {
+    font-size: 100%;
+  }
   display: flex;
   flex-direction: column;
 }
 
 p {
-  margin-top:0px;
-  margin-bottom:1em;
-  line-height:$base-line-height;
+  margin-top: 0px;
+  margin-bottom: 1em;
+  line-height: $base-line-height;
 }

themes/hugodocs/pipeline/scss/base/_typography.scss

@@ -1 +1,27 @@
-@include fonts('proximanova',$weights: 100 300 400 600 700);
+@include fonts('muli', $weights: 100 300 400 600 700);
+h1,
+h2,
+h3,
+h4 {
+  letter-spacing: -.021em;
+  font-weight: $heading-font-weight;
+  margin-top: 0px;
+  margin-bottom: 12px;
+}
+
+h1 {
+  font-size: 2em;
+  line-height: 1.2;
+  margin-bottom: .25em;
+  @include MQ(M) {
+    font-size: 2.25em;
+  }
+}
+
+h2 {
+  font-size: 1.5em;
+}
+
+h3 {
+  font-size: 1.2em;
+}

themes/hugodocs/pipeline/scss/components/_lists.scss

@@ -20,7 +20,8 @@ aside {
   ul {
     list-style: disc outside none;
     padding-left: 1em;
-    margin-left: 1em;
+    margin-left: .25em;
+    margin-top: 0px;
     li {
       // padding-left:1em;
       // margin-left: 1em;

themes/hugodocs/pipeline/scss/layout/_site-content.scss

@@ -1,31 +1,68 @@
 #all-content-wrapper {
   margin-top: $site-header-height;
   z-index: 5;
+  transition: all .3s ease-in-out;
+  opacity: 1;
   @include MQ(L) {
     margin-left: $sidebar-width;
   }
+  &.navigation-open {
+    transition: all .3s ease-in-out;
+    transform:translateX(#{$sidebar-width});
+    opacity: .4;
+    @include MQ(L) {
+      opacity: 1;
+      transform: translateX(0px);
+    }
+  }
 }
 
 main.main {
   width: 90%;
   display: block;
-  margin-left: 5%;
-  margin: {
-    left: auto;
-    right: auto;
-  }
+  margin-left: auto;
+  margin-right: auto;
   max-width: $content-max-width;
+  header.content-header {
+    display: block;
+    clear: both;
+    width: 100%;
+    position: relative;
+    margin-top: 2.5em;
+    @include MQ(M) {
+      margin-top: 2em;
+    }
+    a.edit-link {
+      font-size: 1.2em;
+      @include MQ(M) {
+        font-size: .7em;
+      }
+      .edit-text {
+        display: none;
+        @include MQ(M) {
+          display: inline;
+          margin-right: .15em;
+          text-transform: uppercase;
+        }
+      }
+      position: absolute;
+      top: .5em;
+      right: 0px;
+    }
+  }
 }
 
 .body-copy {
   margin-bottom: 2em;
+  display: inline-block;
   .last-modified {
     color: lighten($base-font-color, 20%);
     display: block;
+    margin-top: 1.5em;
     width: 100%;
     font-size: .8em;
     border-top: 1px solid lighten($base-font-color, 20%);
     text-align: center;
-    text-transform:uppercase;
+    text-transform: uppercase;
   }
 }

themes/hugodocs/pipeline/scss/layout/_site-header.scss

@@ -4,7 +4,7 @@
   display: flex;
   flex-direction: row;
   align-items: center;
-  justify-content: space-between;
+  justify-content: center;
   margin: 0px;
   background-color: $hugo-white;
   color: $hugo-black;
@@ -13,11 +13,8 @@
   left: 0px;
   z-index: 10;
   @include card(1);
-  .page-title {
-    // margin:{
-    //  left:auto;
-    //  right:auto;
-    // }
+  @include MQ(M) {
+    justify-content: space-between;
   }
   .hugo-meta {
     display: flex;
@@ -27,18 +24,22 @@
     display: flex;
     align-items: center;
     font-size: .8em;
-    margin-left: 1em;
+    margin-left: 1.5em;
     img {
-      height: $site-header-height * .8;
+      height: $site-header-height * .7;
       margin-right: .25em;
     }
+    .hugo-v {
+      align-self: flex-end;
+      font-size: .9em;
+    }
   }
   //github buttons in site-header
   iframe[src^="https://buttons.github.io"] {
+    display: none;
+    @include MQ(M) {
+      display: inline;
+    }
     margin-left: 1em;
   }
-  .header-buttons {
-    margin-right: 1em;
-    font-size: .8em;
-  }
 }

themes/hugodocs/pipeline/scss/layout/_site-navigation.scss

@@ -32,6 +32,9 @@
       line-height: 1;
       margin-top: .66em;
       margin-bottom: .66em;
+      ul li {
+        padding-left:.5em;
+      }
     }
     a.top-menu-item-link {
       font-size: 17px;
@@ -61,6 +64,16 @@
   }
 }
 
+.nav-buttons {
+  a {
+    margin-left:1em;
+    margin-bottom:.5em;
+    display:inline-block;
+    width:200px;
+    font-size:.9em;
+  }
+}
+
 #navigation-toggle {
   @include MQ(L) {
     display: none;

themes/hugodocs/pipeline/scss/pages/_homepage.scss

@@ -1,3 +1,7 @@
+.all-content-wrapper.home {
+  background-color: lighten($hugo-blue,55%);
+}
+
 main#homepage {
   width: 90%;
   @include MQ(M) {
@@ -29,6 +33,7 @@ main#homepage {
     color: inherit;
     @include card(1, 3);
     width: 100%;
+    background-color: $body-bg-color;
     @include MQ(M) {
       width: $M * .9 * .48;
     }