Commit 60970701 authored by Paul Asmuth's avatar Paul Asmuth
Browse files

update the documentation html layout

parent 3a771b08

doc/commands.md

0 → 100644
+46 −0
Original line number Diff line number Diff line 
API Reference

=============



List of Commands

----------------



This table lists all available commands grouped by the scope in which they are

used. Please follow the respective links for more details on individual configuration

options.



<table>

  <tr><th>Name</th><th>Synopsis</th></tr>

  <tbody>

    <tr><td><a href="/commands/plot/axes">plot/axes</a></td></tr>

    <tr><td><a href="/commands/plot/areas">plot/areas</a></td></tr>

    <tr><td><a href="/commands/plot/axis">plot/axis</a></td></tr>

    <tr><td><a href="/commands/plot/bars">plot/bars</a></td></tr>

    <tr><td><a href="/commands/plot/errorbars">plot/errorbars</a></td></tr>

    <tr><td><a href="/commands/plot/grid">plot/grid</a></td></tr>

    <tr><td><a href="/commands/plot/labels">plot/labels</a></td></tr>

    <tr><td><a href="/commands/plot/lines">plot/lines</a></td></tr>

    <tr><td><a href="/commands/plot/points">plot/points</a></td></tr>

    <tr><td><a href="/commands/plot/vectors">plot/vectors</a></td></tr>

    <tr><td><a href="/commands/plot/rectangles">plot/rectangles</a></td></tr>

  </tbody>

</table>





Configuration Options

---------------------



<table>

  <tr><th>Name</th><th>Synopsis</th></tr>

  <tbody>

    <tr><td><a href="/reference/colors">Colors</a></td></tr>

    <tr><td><a href="/reference/color-maps">Color Maps</a></td></tr>

    <tr><td><a href="/reference/typographic">Typographic Units</a></td></tr>

    <tr><td><a href="/reference/fonts">Fonts</a></td></tr>

    <tr><td><a href="/reference/marker-shapes">Marker Shapes</a></td></tr>

    <tr><td><a href="/reference/scale-types">Scale Types</a></td></tr>

    <tr><td><a href="/reference/scale-layout">Scale Layout</a></td></tr>

    <tr><td><a href="/reference/format">Number Formatters</a></td></tr>

  </tbody>

</table>

doc/frontpage.md

+19 −52
Original line number Diff line number Diff line 
<h1>clip (v0.6)</h1>

<h1>Documentation</h1>



clip (the _command line illustration processor_) is an open-source command line

program and software library for creating charts and other data-driven

illustrations.



<div style="margin-top: 1.2em;">

In essence, clip consists of a library of drawing commands. This command library

includes high-level building blocks for creating common chart types as well as

lower-level drawing primitives such as markers, arrows and lines.



When called from the command line, clip reads input data in text and CSV format

and produces the output chart as a SVG or PNG file. Additionaly, clip is available

as the libclip software library which can be embedded into any application that

supports a C FFI.



<p>

  <a href="./getting-started" style="">Getting Started</a>

  <span style="margin: 0 .3em">·</span>

  <a href="./examples">Examples</a>

  <span style="margin: 0 .3em">·</span>

  <a href="./installation">Download</a>

</div>

</p>



<div style="margin-top: 2em; margin-bottom: 3em; background: #f2f7ff; padding: 10pt; max-width: 900px; box-sizing: border-box;">

<div style="margin-top: 1em; margin-bottom: 2em; background: #f2f7ff; padding: 10pt; max-width: 50em; box-sizing: border-box;">

  <b>BETA:</b> Please note that clip is pre-1.0 software under active development;

  It has reached a "minumum viable product" level of quality, but users should

  expect things to generally be a bit rough around the edges and subject to change.

  To see what already works, have a look at the <a href="/examples">Examples</a> page.

</div>



## Documentation



<h3>Introduction</h3>

<ul class="index">

References

----------



<ul>

  <li><a href="./getting-started">Getting Started</a></li>

  <li><a href="./commands">API Reference</a></li>

  <li><a href="./examples">Examples</a></li>

  <li><a href="./installation">Download</a></li>

  <li><a href="./installation">Installation</a></li>

  <li><a href="./usage/command-line">Usage</a></li>

</ul>



<h3>General Concepts</h3>

<ul class="index">

  <li><a href="/reference/document-setup">Document Setup</a></li>

  <li><a href="/reference/colors">Colors</a></li>

  <li><a href="/reference/color-maps">Color Maps</a></li>

  <li><a href="/reference/typographic">Typographic Units</a></li>

  <li><a href="/reference/fonts">Fonts</a></li>

  <li><a href="/reference/marker-shapes">Marker Shapes</a></li>

  <li><a href="/reference/scale-types">Scale Types</a></li>

  <li><a href="/reference/scale-layout">Scale Layout</a></li>

  <li><a href="/reference/format">Number Formatters</a></li>

</ul>





List of Commands

----------------



<h5>Document Setup</h5>

<ul class="index">

  <li><a href="#" class="prop"><code><strong>width</strong></code></a></li>

  <li><a href="#" class="prop"><code><strong>height</strong></code></a></li>

  <li><a href="#" class="prop"><code><strong>dpi</strong></code></a></li>

</ul>



<h5>Plotting Data</h5>

<ul class="index">

  <li><a href="/commands/plot/axes"><code><strong>plot/axes</strong></code></a></li>

  <li><a href="/commands/plot/areas"><code><strong>plot/areas</strong></code></a></li>

  <li><a href="/commands/plot/axis"><code><strong>plot/axis</strong></code></a></li>

  <li><a href="/commands/plot/bars"><code><strong>plot/bars</strong></code></a></li>

  <li><a href="/commands/plot/errorbars"><code><strong>plot/errorbars</strong></code></a></li>

  <li><a href="/commands/plot/grid"><code><strong>plot/grid</strong></code></a></li>

  <li><a href="/commands/plot/labels"><code><strong>plot/labels</strong></code></a></li>

  <li><a href="/commands/plot/lines"><code><strong>plot/lines</strong></code></a></li>

  <li><a href="/commands/plot/points"><code><strong>plot/points</strong></code></a></li>

  <li><a href="/commands/plot/vectors"><code><strong>plot/vectors</strong></code></a></li>

  <li><a href="/commands/plot/rectangles"><code><strong>plot/rectangles</strong></code></a></li>

</ul>



<h5>Other</h5>

<ul class="index">

  <li><a href="/commands/figure/legend"><code><strong>figure/legend</strong></code></a></li>

</ul>





Community

---------

doc/toc.yaml

+4 −0
Original line number Diff line number Diff line
@@ -26,6 +26,10 @@ documentation: 
          title: "FAQ"

          url: "/faq"

          file: "faq"

        -

          title: "Commands"

          url: "/commands"

          file: "commands"



  -

    title: "Examples"

doc/web/build_layout.py

+3 −1
Original line number Diff line number Diff line
@@ -29,10 +29,12 @@ tpl = """ 
      <span style="margin: 0 .3em">·</span>

      <a class="link" href="/" style="">Documentation</a>

      <span style="margin: 0 .3em">·</span>

      <a class="link" href="/commands" style="">API Reference</a>

      <span style="margin: 0 .3em">·</span>

      <a class="link" href="/examples">Examples</a>

      <span style="margin: 0 .3em">·</span>

      <a class="link" href="/installation">Download</a>

      <ul class="crumbs">

      <ul class="crumbs" style="display: none;">

        <li><a href="/">Documentation</a></li>

        <li><a>{{title}}</a></li>

      </ul>

doc/web/documentation.css

+34 −33
Original line number Diff line number Diff line
@@ -7,10 +7,9 @@ html { 
body {

  margin: 0;

  padding: 0;

  font-family: Helvetica, Arial, sans-serif;

  font-size: 16px;

  line-height: 1.3;

  font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;

  background-color: #fff;

  line-height: 1.3;

  color: #000;

  text-rendering: optimizelegibility;

  min-height: 100vh;
@@ -22,12 +21,11 @@ h1, h2, h3, h4, h5, h6 { 
  font-weight: bold;

  line-height: 20px;

  color: inherit;

  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

}



h1, h2, h3 { line-height: 1.3; }

h1 { font-size: 38.5px; }

h2 { font-size: 22px; font-weight: 500; }

h2 { font-size: 20px; font-weight: 500; }

h3 { font-size: 18px; font-weight: 600; }

h4 { font-size: 18px; font-weight: 500; }

h5 { font-size: 100%; font-weight: 500; }
@@ -42,14 +40,11 @@ h3, h4 { 


h2, a h2 {

  line-height: 1;

  margin-top: 2em;

  margin-bottom: .8em;

  padding-bottom: .6em;

  color: #1a2c58;

  margin-top: 1em;

  color: #000;

  box-sizing: border-box;

  border-bottom: 2px solid #e7ebf2;

  display: block;

  font-weight: bold;

  font-weight: 600;

}



h4 em {
@@ -98,16 +93,15 @@ ul li p { 
}



body {

  padding-left: 4em;

  padding-right: 4em;

  padding-left: 2em;

  padding-right: 2em;

}



article, nav, footer {

  max-width: 860px;

  /*max-width: 860px;*/

}



nav {

  border-bottom: 1pt solid #ced3e0;

  overflow: auto;

  margin: 0 2em;

  padding: 1.6em 0 0 0;
@@ -190,7 +184,7 @@ article h1 + h2, 
article h2 + h3,

article h2 + h4,

article h3 + h4 {

  margin-top: 1.4em;

  margin-top: 0;

}



article h3 + hr {
@@ -210,17 +204,19 @@ article h3 + pre { 
  margin-top: 0.2em;

}



article pre, article p, article code {

  max-width: 50rem;

}



article pre + h3.section {

  margin-top: 1.8em;

}



article p {

  margin-top: 0;

  margin-bottom: .6em;

  margin-bottom: 1em;

  font-weight: 400;

  color: #000;

  line-height: 1.5;

  margin-bottom: 1em;

}



article hr {
@@ -250,7 +246,6 @@ article table { 


article img {

  max-width: 100%;

  margin: auto;

}



code {
@@ -306,7 +301,6 @@ table { 
table td, table th {

  padding: 4px 6px;

  text-align: left;

  border-bottom: 1px solid #ddd;

  vertical-align: top;

}
@@ -314,7 +308,6 @@ table th { 
  font-weight: 600;

  color: #333;

  width: 125px;

  border-bottom: 2px solid #ddd;

}



table th i {
@@ -430,10 +423,14 @@ article .color_legend { 
  margin-right: .4em;

}



article figure {

  padding: 0;

  margin: 0;

}



article figure img.small {

  display: block;

  max-height: 100%;

  margin: auto;

  margin-top: 2em;

  max-width: 600px;

  border: 1px solid #aeb3bb;
@@ -441,7 +438,6 @@ article figure img.small { 
}



article figcaption {

  text-align: center;

  margin-bottom: 3em;

  font-size: 90%;

  display: block;
@@ -455,10 +451,17 @@ article figcaption code { 
}



.toc {

  float: right;

  margin: 4.2em 0 0 6em;

  padding: 0 2em;

  border-left: 1px solid #ccc;

  border-left: 1px solid #ddd;

  position: absolute;

  margin-left: 53em;

  margin-top: 4em;

}



@media (max-width: 70rem) {

  .toc {

    display: none;

  }

}



.toc ul {
@@ -525,14 +528,11 @@ ul.index code { 
  font-weight: 500;

}



.examples {

  margin: auto;

}



.examples figure {

  margin: 0;

  padding: 1em 10%;

  border-bottom: 1px solid #ddd;

  float: left;

  max-width: 32em;

  margin-right: 1em;

}



.examples figure:last-child {
@@ -541,4 +541,5 @@ ul.index code { 


.examples figcaption {

  margin-bottom: 2em;

  text-align: center;

}

CRA Git | Maintained and supported by SUSTech CRA and CCSE