Refactor partials, layout and sass files
This commit is contained in:
parent
43974d0908
commit
628a4df0df
18 changed files with 95 additions and 68 deletions
|
@ -50,6 +50,6 @@ html, button, input, select, textarea, .pure-g [class *= "pure-u"] {
|
||||||
}
|
}
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
color: #1F37E6;
|
color: $color-link;
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -25,12 +25,12 @@ $gray-800: #343a40;
|
||||||
$gray-900: #212529;
|
$gray-900: #212529;
|
||||||
$black: #000;
|
$black: #000;
|
||||||
|
|
||||||
// $color-link:
|
$color-link: #1177EE;
|
||||||
// $color-visited-link:
|
$color-visited-link: #7823c9;
|
||||||
|
|
||||||
|
|
||||||
$body-line-height: 1.75;
|
$body-line-height: 1.75;
|
||||||
$body-min-width: 25rem;
|
$body-min-width: 25rem;
|
||||||
$content-max-width: 64rem;
|
$content-max-width: 64rem;
|
||||||
|
$content-min-width: $body-min-width;
|
||||||
$nav-menu-width: 18rem;
|
$nav-menu-width: 18rem;
|
||||||
$toc-menu-width: 14rem;
|
$toc-menu-width: 14rem;
|
|
@ -17,28 +17,20 @@ body {
|
||||||
line-height: $body-line-height;
|
line-height: $body-line-height;
|
||||||
}
|
}
|
||||||
|
|
||||||
.book-content {
|
a {
|
||||||
max-width: $content-max-width;
|
text-decoration: none;
|
||||||
margin: 0 auto;
|
color: $color-link;
|
||||||
}
|
|
||||||
|
|
||||||
.book-page {
|
|
||||||
padding: 0 $size-48;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.book-brand {
|
.book-brand {
|
||||||
padding: 0 $padding-16;
|
padding: 0 $padding-16;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
|
|
||||||
a {
|
|
||||||
color: $gray-800;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Navigation styles
|
||||||
.book-nav {
|
.book-nav {
|
||||||
width: $nav-menu-width;
|
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
|
width: $nav-menu-width;
|
||||||
|
|
||||||
nav {
|
nav {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -50,14 +42,54 @@ body {
|
||||||
|
|
||||||
font-size: $font-size-14;
|
font-size: $font-size-14;
|
||||||
background: $gray-100;
|
background: $gray-100;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style: none;
|
||||||
padding-left: $padding-16;
|
padding-left: $padding-16;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: block;
|
||||||
|
color: $gray-800;
|
||||||
|
padding: $padding-4 $padding-16;
|
||||||
|
text-transform: capitalize;
|
||||||
|
|
||||||
|
&[href]:hover {
|
||||||
|
color: $gray-600;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
color: $color-link;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// class used for sections with bookTopSection: true
|
||||||
|
.book-nav-section {
|
||||||
|
margin-bottom: $padding-16;
|
||||||
|
> a { font-weight: 600; }
|
||||||
|
> ul { padding-left: 0; }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.book-content {
|
||||||
|
max-width: $content-max-width;
|
||||||
|
min-width: $content-min-width;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
.book-page {
|
||||||
|
padding: $padding-16 $size-48;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:visited {
|
||||||
|
color: $color-visited-link
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Table of Contents styles
|
||||||
.book-toc {
|
.book-toc {
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
width: $toc-menu-width;
|
width: $toc-menu-width;
|
||||||
font-size: $font-size-12;
|
|
||||||
|
|
||||||
nav {
|
nav {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -67,6 +99,8 @@ body {
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
|
||||||
|
font-size: $font-size-12;
|
||||||
|
|
||||||
> ul {
|
> ul {
|
||||||
margin: $size-48 0;
|
margin: $size-48 0;
|
||||||
padding: 0 $padding-16;
|
padding: 0 $padding-16;
|
||||||
|
@ -80,7 +114,6 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration: none;
|
|
||||||
line-height: 1.25;
|
line-height: 1.25;
|
||||||
padding: $padding-4 0;
|
padding: $padding-4 0;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
|
@ -1,25 +1,31 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
{{ partial "book-html-head" . }}
|
{{ partial "book/html-head" . }}
|
||||||
<title>{{ .Site.Title }}</title>
|
<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="pure-g">
|
<div class="pure-g">
|
||||||
|
|
||||||
<div class="pure-u book-nav">
|
<div class="pure-u book-nav">
|
||||||
{{ partial "book-nav" . }}
|
{{ partial "book/nav" . }}
|
||||||
</div>
|
</div>
|
||||||
<div class="pure-u book-content">
|
<div class="pure-u book-content">
|
||||||
<div class="pure-g">
|
<div class="pure-g">
|
||||||
|
|
||||||
<div class="pure-u book-page markdown">
|
<div class="pure-u book-page markdown">
|
||||||
{{ block "main" . }}{{ end }}
|
{{ block "main" . }}{{ end }}
|
||||||
</div>
|
</div>
|
||||||
|
{{ if and (default true .Site.Params.BookShowTOC) (.Page.TableOfContents) }}
|
||||||
<div class="pure-u book-toc">
|
<div class="pure-u book-toc">
|
||||||
{{ partial "book-toc" . }}
|
{{ partial "book/toc" . }}
|
||||||
</div>
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -1,7 +0,0 @@
|
||||||
{{ define "title" }}
|
|
||||||
{{ .Title }} – {{ .Site.Title }}
|
|
||||||
{{ end }}
|
|
||||||
|
|
||||||
{{ define "main" }}
|
|
||||||
<div>{{ .Content }}</div>
|
|
||||||
{{ end }}
|
|
|
@ -1,7 +1,7 @@
|
||||||
{{ define "title" }}
|
{{- define "title" -}}
|
||||||
{{ .Title }} – {{ .Site.Title }}
|
{{ .Site.Title }}
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{ define "main" }}
|
{{- define "main" -}}
|
||||||
<div>{{ .Content }}</div>
|
<div>{{ .Content }}</div>
|
||||||
{{ end }}
|
{{ end }}
|
|
@ -1,3 +1,7 @@
|
||||||
{{ define "main" }}
|
{{- define "title" -}}
|
||||||
|
{{ .Site.Title }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{- define "main" -}}
|
||||||
<div>{{ .Content }}</div>
|
<div>{{ .Content }}</div>
|
||||||
{{ end }}
|
{{ end }}
|
|
@ -1 +0,0 @@
|
||||||
{{ .Page.TableOfContents }}
|
|
|
@ -3,7 +3,7 @@
|
||||||
|
|
||||||
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,600" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,600" rel="stylesheet">
|
||||||
<link href="/css/pure-min.css" rel="stylesheet">
|
<link href="/css/pure-min.css" rel="stylesheet">
|
||||||
<link href="/css/grids-responsive-min.css" rel="stylesheet">
|
<!-- <link href="/css/grids-responsive-min.css" rel="stylesheet"> -->
|
||||||
|
|
||||||
{{ $styles := resources.Get "styles.scss" | resources.ToCSS | resources.Minify | resources.Fingerprint }}
|
{{ $styles := resources.Get "styles.scss" | resources.ToCSS | resources.Minify | resources.Fingerprint }}
|
||||||
<link rel="stylesheet" href="{{ $styles.Permalink }}">
|
<link rel="stylesheet" href="{{ $styles.Permalink }}">
|
0
layouts/partials/book/nav-after.html
Normal file
0
layouts/partials/book/nav-after.html
Normal file
|
@ -12,27 +12,29 @@
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
<nav role="navigation" class="pure-menu">
|
<nav role="navigation">
|
||||||
{{ partial "book-brand" . }}
|
{{ partial "book/nav-brand" . }}
|
||||||
|
|
||||||
<ul class="pure-menu-list pure-menu-root">
|
<ul>
|
||||||
{{ range .Scratch.Get "BookSections" }}
|
{{ range .Scratch.Get "BookSections" }}
|
||||||
{{ template "book-section" (dict "Section" . "CurrentPage" $.Permalink) }}
|
{{ template "book-section" (dict "Section" . "CurrentPage" $.Permalink) }}
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
{{ partial "book/nav-after" . }}
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<!-- Single section of menu (recursive) -->
|
<!-- Single section of menu (recursive) -->
|
||||||
{{ define "book-section" }}
|
{{ define "book-section" }}
|
||||||
<li class="pure-menu-item">
|
<li {{ if .Section.Params.booktopsection }}class="book-nav-section"{{ end }}>
|
||||||
{{ template "book-heading" .Section }}
|
{{ template "book-heading" .Section }}
|
||||||
<ul class="pure-menu-list">
|
<ul>
|
||||||
{{ range .Section.Sections }}
|
{{ range .Section.Sections }}
|
||||||
{{ template "book-section" (dict "Section" . "CurrentPage" $.CurrentPage) }}
|
{{ template "book-section" (dict "Section" . "CurrentPage" $.CurrentPage) }}
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ range .Section.Pages }}
|
{{ range .Section.Pages }}
|
||||||
<li class="pure-menu-item">
|
<li>
|
||||||
<a href="{{ .RelPermalink }}" class="pure-menu-link {{ if eq $.CurrentPage .Permalink }}active{{ end }}">
|
<a href="{{ .RelPermalink }}" class="{{ if eq $.CurrentPage .Permalink }}active{{ end }}">
|
||||||
{{ default .Title (.File | humanize | title) }}
|
{{ default .Title (.File | humanize | title) }}
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
|
@ -49,13 +51,13 @@
|
||||||
{{ $title := default .Title $title }}
|
{{ $title := default .Title $title }}
|
||||||
|
|
||||||
{{ if .Content }}
|
{{ if .Content }}
|
||||||
<a href="{{ .RelPermalink }}" class="pure-menu-link {{ if .IsSection }}section{{ end }}">
|
<a href="{{ .RelPermalink }}">
|
||||||
{{- $title -}}
|
{{- $title -}}
|
||||||
</a>
|
</a>
|
||||||
{{ else }}
|
{{ else }}
|
||||||
<span class="pure-menu-heading {{ if .IsSection }}section{{ end }}">
|
<a>
|
||||||
{{- $title -}}
|
{{- $title -}}
|
||||||
</span>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
5
layouts/partials/book/nav-bundle.html
Normal file
5
layouts/partials/book/nav-bundle.html
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
<nav role="navigation">
|
||||||
|
{{ partial "book/nav-brand" . }}
|
||||||
|
{{ with .Site.GetPage .Site.Params.BookMenuBundle }}{{ .Content }}{{ end }}
|
||||||
|
{{ partial "book/nav-after" . }}
|
||||||
|
</nav>
|
5
layouts/partials/book/nav.html
Normal file
5
layouts/partials/book/nav.html
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
{{ if .Site.Params.BookMenuBundle }}
|
||||||
|
{{ partial "book/nav-bundle" . }}
|
||||||
|
{{ else }}
|
||||||
|
{{ partial "book/nav-auto" . }}
|
||||||
|
{{ end }}
|
1
layouts/partials/book/toc.html
Normal file
1
layouts/partials/book/toc.html
Normal file
|
@ -0,0 +1 @@
|
||||||
|
{{ .Page.TableOfContents }}
|
|
@ -1,21 +0,0 @@
|
||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
|
|
||||||
<title>Your page title</title>
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css"> <!--[if lte IE 8]>
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-old-ie-min.css">
|
|
||||||
<![endif]-->
|
|
||||||
<!--[if gt IE 8]><!-->
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/grids-responsive-min.css">
|
|
||||||
<!--<![endif]--></head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<!--
|
|
||||||
Your HTML goes here. Visit purecss.io/layouts/ for some sample HTML code.
|
|
||||||
-->
|
|
||||||
</body>
|
|
||||||
</html>
|
|
Binary file not shown.
Loading…
Reference in a new issue