Skip to content
Snippets Groups Projects
Commit d4cb6f36 authored by Lars Bilke's avatar Lars Bilke Committed by Lars Bilke
Browse files

[web] Fixed nav, simple styling with tachyons.io

parent 34b6c9ff
No related branches found
No related tags found
No related merge requests found
......@@ -2,17 +2,20 @@
<div class="col-xs-3">
{{ $segments := split .RelPermalink "/" }}
{{ $subsection := index $segments 2 }}
<ul>
{{ range .Site.Pages.ByWeight }}
{{ if eq .Type "docs"}}
{{ $localSegments := split .RelPermalink "/" }}
{{ $localSubsection := index $localSegments 2 }}
{{ if eq $localSubsection $subsection }}
<li><a href="{{ .Permalink }}">{{ .Title }}</a></li>
<h3>Developer Guide</h3>
<hr>
<ul class="sidenav">
{{ $currentPage := . }}
{{ $currentMenu := index .Site.Menus $subsection }}
{{ range $currentMenu }}
{{ if .HasChildren }}
<li class="category">{{ .Name }}</li>
{{ range .Children }}
<li><a href="{{ .URL }}"{{if $currentPage.IsMenuCurrent $subsection . }} class="active"{{end}}>{{ .Name }}</a></li>
{{ end }}
{{ end }}
{{ end }}
{{ end }}
<ul>
</ul>
</div>
<div class="col-xs-9">
<h1>{{ .Title }}</h1>
......@@ -20,22 +23,8 @@
{{ .Content }}
<hr>
<div class="row between-xs">
<div class="col-xs-4">
{{ if isset .Params "back" }}
<a href='{{ relref . .Params.back }}'>Back: {{ .Params.back }}</a>
{{ end }}
</div>
<div class="col-xs-4" style="text-align: right">
{{ if isset .Params "next" }}
<a href='{{ relref . .Params.next }}'>Next: {{ .Params.next }}</a>
{{ end }}
</div>
</div>
{{ partial "footer-nav.html" . }}
<p>This article was written by {{ .Params.Author }}. If you are missing something or you find an error please <a href="mailto:ogs-devs@googlegroups.com">let us know</a>.</p>
</div>
{{ partial "page-info" . }}
{{ partial "footer.html" . }}
{{ if .Prev | or .Next }}
<div class="footer-nav">
<div class="row between-xs">
<div class="col-xs-6">
{{ if .Prev }}
<a href="{{ .Prev.Permalink }}" title="{{ .Prev.Permalink }}">
<span>Previous</span>
<div class="nav-title">
{{ .Prev.Title }}
</div>
</a>
{{ end }}
</div>
<div class="col-xs-6">
{{ if .Next }}
<span class="tr">
<a href="{{ .Next.Permalink }}" title="{{ .Next.Permalink }}">
<div>Next</div>
<div class="nav-title">
{{ .Next.Title }}
</div>
</a>
</span>
{{ end }}
</div>
</div>
</div>
{{ end }}
<!-- <script src="js/scripts.js"></script> -->
<p>Last revision: {{ .Lastmod.Format "January 2, 2006" }}{{ if .IsPage }}<em>{{ with .GitInfo }}| {{ .Subject }} | <a href="https://github.com/ufz/ogs/commit/{{ .AbbreviatedHash }}">{{ .AbbreviatedHash }}</a>{{end }}</em>{{ end }}
</div> <!-- row -->
</div> <!-- container -->
</body>
......
......@@ -25,7 +25,11 @@
<body>
<div class="container">
<div class="row">
<div class="nav"><a href="/">Home</a> | <a href="/news">News</a> | <a href="/about">About</a> | <a href="/docs">Docs</a></div>
</div>
<nav>
<a href="/" class="black b">opengeosys.org</a>
{{ $currentPage := . }}
{{ range .Site.Menus.main }}
<a href="{{ .URL }}" {{if $currentPage.IsMenuCurrent "main" . }} class="active"{{end}}>{{ .Name }}</a>
{{ end }}
</nav>
<div class="row">
<div class="page-info">
<p>This article was written by {{ .Params.Author }}. If you are missing something or you find an error please <a href="mailto:ogs-devs@googlegroups.com">let us know</a>. <br>
Last revision: {{ .Lastmod.Format "January 2, 2006" }}{{ if .IsPage }}<em>{{ with .GitInfo }}| {{ .Subject }} | <a href="https://github.com/ufz/ogs/commit/{{ .AbbreviatedHash }}">{{ .AbbreviatedHash }}</a>{{end }}</em>{{ end }}</p>
</div>
......@@ -3,10 +3,13 @@
<h1>OpenGeoSys Documentation</h1>
<div class="row">
{{ range .Params.sections }}
<div class="col-xs-4">
<h3><a href="/docs/{{ .slug }}">{{ .name }}</a></h3>
<p>{{ .text }}</p>
</div>
<article class="fl w-33 ma2 bg-white br3 pa4 pa4-ns mv3 ba b--black-10">
<div class="tc">
<h1 class="f4"><a href="/docs/{{ .slug }}">{{ .name }}</a></h1>
<hr class="mw3 bb bw1 b--black-10">
</div>
<p class="1h-copy measure center f6 black-70">{{ .text }}</p>
</article>
{{ end }}
</div>
......
......@@ -3,3 +3,91 @@
max-width: 100%;
height: auto;
}
@import "node_modules/tachyons-sass/tachyons.scss";
// Fonts
h1, h2, h3, h4, h5, h6 { @extend .athelas; }
p, li { @extend .avenir; }
code, pre { @extend .code }
// Header
h1 { @extend .f2; }
h2 { @extend .f3; }
h3 { @extend .f4; }
// Text
a {
@extend .link;
@extend .hover-orange;
}
p, li {
@extend .measure-wide;
@extend .lh-copy;
@extend .f5;
}
// Code
code, pre {
@extend .lh-solid;
}
// Nav
.nav-a-style {
@extend .gray;
@extend .dim;
@extend .dib;
}
nav {
@extend .pa3;
@extend .pa4-ns;
a {
@extend .nav-a-style;
@extend .f6;
@extend .f5-ns;
@extend .mr3;
}
a.active {
@extend .orange;
}
}
// Docs
// Side nav
ul.sidenav {
@extend .list;
@extend .pl0;
li {
@extend .f5;
}
li.category {
@extend .athelas;
@extend .small-caps;
}
a {
@extend .nav-a-style;
@extend .f6;
}
a.active {
@extend .orange;
}
}
// Footer nav-a-style
.footer-nav {
a {
@extend .f6;
}
}
.page-info {
p {
@extend .f6;
max-width: 100%;
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment