jstrong
/
zola
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

WIP docs

index-subcmd
Vincent Prouillet 7 years ago
parent
195b760fdc
commit
bad1378485
13 changed files with 174 additions and 16 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +34
    -0
      docs/content/documentation/_index.md
  2. +4
    -0
      docs/content/documentation/getting-started/_index.md
  3. +6
    -0
      docs/content/documentation/getting-started/cli-usage.md
  4. +6
    -0
      docs/content/documentation/getting-started/configuration.md
  5. +6
    -0
      docs/content/documentation/getting-started/directory-structure.md
  6. +6
    -0
      docs/content/documentation/getting-started/installation.md
  7. +2
    -6
      docs/sass/_base.scss
  8. +3
    -0
      docs/sass/_docs.scss
  9. +18
    -0
      docs/sass/_index.scss
  10. +19
    -7
      docs/sass/_layout.scss
  11. +4
    -0
      docs/sass/site.scss
  12. +26
    -0
      docs/templates/documentation.html
  13. +40
    -3
      docs/templates/index.html

+ 34
- 0
docs/content/documentation/_index.md View File

@@ -0,0 +1,34 @@
+++
template = "documentation.html"
+++

Getting started
- Installation
- CLI usage
- Directory structure
- config.toml
Content
- Organisation
- Pages
- Sections
- Shortcodes
- Internal links
- Table of contents
- Deep linking (# links)
- Syntax highlighting
- Pagination
- Tag & categories
- RSS
- Sitemap
Templates
- Intro
- Each kind of page and the variables available
- Built-in global functions
- Built-in filters
- Debugging

Theme
- Installing & customising a theme
- Creating a theme

+ 4
- 0
docs/content/documentation/getting-started/_index.md View File

@@ -0,0 +1,4 @@
+++
title = "Getting Started"
sort_by = "order"
+++

+ 6
- 0
docs/content/documentation/getting-started/cli-usage.md View File

@@ -0,0 +1,6 @@
+++
title = "CLI usage"
order = 2
+++

Hey

+ 6
- 0
docs/content/documentation/getting-started/configuration.md View File

@@ -0,0 +1,6 @@
+++
title = "Configuration"
order = 4
+++

Hey

+ 6
- 0
docs/content/documentation/getting-started/directory-structure.md View File

@@ -0,0 +1,6 @@
+++
title = "Directory structure"
order = 3
+++

Hey

+ 6
- 0
docs/content/documentation/getting-started/installation.md View File

@@ -0,0 +1,6 @@
+++
title = "Installation"
order = 1
+++

Hey

+ 2
- 6
docs/sass/_base.scss View File

@@ -6,8 +6,8 @@ html, body {
body { body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
line-height: 1.6; line-height: 1.6;
background-color: #191919;
color: white;
background-color: $background;
color: $foreground;


// for sticky footer // for sticky footer
display: flex; display: flex;
@@ -65,7 +65,3 @@ pre {
padding: 1rem; padding: 1rem;
overflow: auto; overflow: auto;
} }

button {

}

+ 3
- 0
docs/sass/_docs.scss View File

@@ -0,0 +1,3 @@
.documentation {
padding: 3rem;
}

+ 18
- 0
docs/sass/_index.scss View File

@@ -2,9 +2,27 @@
width: 60%; width: 60%;
margin: 0 auto; margin: 0 auto;
margin-top: 3rem; margin-top: 3rem;
margin-bottom: 6rem;
text-align: center; text-align: center;


&__tagline { &__tagline {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
} }

.selling-points {
background: $foreground;
color: $background;
padding: 3rem;

&__content {
display: flex;
flex-wrap: wrap;
}
}

.selling-point {
// 2 selling points per row on desktop
width: 50%;
padding: 2rem;
}

+ 19
- 7
docs/sass/_layout.scss View File

@@ -1,17 +1,29 @@
header { header {
padding: 2rem 0; padding: 2rem 0;
}


nav {
max-width: 1000px;
margin: 0 auto;
}
.container {
max-width: 1000px;
margin: 0 auto;
} }


footer {
text-align: center;
padding: 2rem 0;
@media only screen and (max-width: 1000px) {
.container {
max-width: 90%;
}
} }


.content { .content {
flex-grow: 1; flex-grow: 1;

&--reversed {
background: $foreground;
color: $background;
}
}


footer {
text-align: center;
padding: 2rem 0;
} }

+ 4
- 0
docs/sass/site.scss View File

@@ -6,7 +6,11 @@
box-sizing: border-box; box-sizing: border-box;
} }


$background: #191919;
$foreground: white;

@import "base"; @import "base";
@import "layout"; @import "layout";
@import "header"; @import "header";
@import "index"; @import "index";
@import "docs";

+ 26
- 0
docs/templates/documentation.html View File

@@ -0,0 +1,26 @@
{% extends "index.html" %}

{% block title %}{{ super() }} - Documentation {% endblock title %}

{% block extra_content_class %}content--reversed{% endblock extra_content_class %}

{% block content %}
{% set section = get_section(path="documentation/_index.md") %}
<div class="documentation container">
<aside class="documentation__sidebar">
{% for subsection in section.subsections %}
<li>
{{ subsection.title }}
<ul>
{% for page in subsection.pages | reverse %}
<li>{{page.title}}</li>
{% endfor %}
</ul>
</li>
{% endfor %}
</aside>
<div class="documentation__content">
hey
</div>
</div>
{% endblock content %}

+ 40
- 3
docs/templates/index.html View File

@@ -12,15 +12,15 @@
<body> <body>


<header> <header>
<nav>
<nav class="container">
<a class="header__logo" href="{{ config.base_url }}">Gutenberg</a> <a class="header__logo" href="{{ config.base_url }}">Gutenberg</a>
<a href="" class="nav-link">Docs</a>
<a href="/documentation" class="nav-link">Documentation</a>
<a href="" class="nav-link">Themes</a> <a href="" class="nav-link">Themes</a>
<a href="https://github.com/Keats/gutenberg" class="nav-link">Github</a> <a href="https://github.com/Keats/gutenberg" class="nav-link">Github</a>
</nav> </nav>
</header> </header>


<div class="content">
<div class="content {% block extra_content_class %}{% endblock extra_content_class %}">
{% block content %} {% block content %}
<div class="hero"> <div class="hero">
<h1>Your damn fast one-stop static site engine</h1> <h1>Your damn fast one-stop static site engine</h1>
@@ -29,6 +29,43 @@
</p> </p>
<a href="" class="button">Get started</a> <a href="" class="button">Get started</a>
</div> </div>

<div class="selling-points">
<div class="selling-points__content container">

<div class="selling-point">
<h2>Everything built-in</h2>
<p>
Gutenberg comes with Sass compilation, syntax highlighting and
a other features that usually require using additional tools
or use JavaScript libraries on your site.
</p>
</div>

<div class="selling-point">
<h2>Fast</h2>
<p>
Your site will be generated in milliseconds, not seconds.
That includes Sass compilation and syntax highlighting.
</p>
</div>

<div class="selling-point">
<h2>Flexible</h2>
<p>
You can build anything you want with Gutenberg: blogs, landing pages, knowledge bases...
</p>
</div>

<div class="selling-point">
<h2>Easy to use</h2>
<p>
Gutenberg strives for good UX and being productive instantly.
</p>
</div>

</div>
</div>
{% endblock content %} {% endblock content %}
</div> </div>




Write Preview
Loading…
Cancel
Save