improved documentation CSS (ca27aea5) · Commits · github_fork / Clip

examples/examples.yaml

+3 −3

Original line number	Diff line number	Diff line
		- section: Scientific Charts
		- section: Monochromatic Charts
		files:
		- file: charts-scientific/vectorfield
		- file: charts-scientific/line_markers
		@@ -9,11 +9,11 @@
		- file: charts-scientific/streamgraph
		- file: charts-scientific/scalarfield

		- section: Editorial Charts
		- section: Colourful Charts
		files:
		- file: charts-editorial/linechart_with_labels
		- file: charts-editorial/chart_i18n
		- file: charts-editorial/stacked_areas
		- file: charts-editorial/linechart_with_labels
		- file: charts-editorial/stacked_bars
		- file: charts-editorial/barchart_horizontal

manual/reference/command_line.md

+1 −1

Original line number	Diff line number	Diff line
		Command Line
		============

		The primary method for translate input expressions to SVG or PNG output files is
		The primary method for translating input expressions to SVG or PNG output files is
		the `clip` command line program. A typical invocation looks like this:

		$ clip --in my_chart.clp --out my_chart.svg

manual/web/build_examples.py

+13 −10

Original line number	Diff line number	Diff line
		@@ -25,18 +25,21 @@ def build_example(example):

		def build_example_list(examples):
		tpl = """
		<h1 style="margin-bottom: 0;">Examples</h1>
		<h1>Examples</h1>
		<p>
		This page contains a list of example charts generated by clip to show you
		what's possible. Each example links to the clip source that generated it.
		</p>

		{{#list}}
		<h3>{{section}}</h3>
		<section class="examples-list">
		<section>
		<h2>{{section}}</h2>
		{{#files}}
		<div>
		<h3>Example: <a href="/examples/{{file}}" class="link"><code>examples/{{file}}</code></a></h3>
		<h4>Example: <a href="/examples/{{file}}" class="link"><code>examples/{{file}}</code></a></h4>
		<figure>
		<a href="/examples/{{file}}"><img src="/examples/{{file}}.svg"></a>
		</figure>
		</div>
		<hr />
		{{/files}}
		</section>
		{{/list}}

manual/web/documentation.css

+8 −68

Original line number	Diff line number	Diff line
		@@ -27,7 +27,7 @@ h1, h2, h3, h4, h5, h6 {

		h1, h2, h3 { line-height: 1.3; }
		h1 { font-size: 38.5px; }
		h2 { font-size: 22px; }
		h2 { font-size: 22px; font-weight: 500; }
		h3 { font-size: 18px; font-weight: 600; }
		h4 { font-size: 18px; font-weight: 500; }
		h5 { font-size: 100%; font-weight: 500; }
		@@ -44,13 +44,10 @@ h2, a h2 {
		line-height: 1;
		margin-top: 2em;
		margin-bottom: .8em;
		font-weight: 600;
		font-size: 18px;
		background: #f2f7ff;
		padding-bottom: .6em;
		color: #1a2c58;
		box-sizing: border-box;
		border-bottom: 2px solid #e7ebf2;
		padding: .6rem .6em .4rem .6em;
		display: block;
		}

		@@ -68,7 +65,7 @@ h4 code {
		}

		section {
		margin-bottom: 2em;
		margin-bottom: 3em;
		}

		h2 + section {
		@@ -80,6 +77,10 @@ hr {
		border-top: 1px solid #222;
		}

		hr:last-child {
		display: none;
		}

		ul {
		padding: 0 0 0 40px;
		margin: 0;
		@@ -153,7 +154,7 @@ article {
		padding: 2em 0;
		}

		article:not(.full-width) {
		article {
		max-width: 900px;
		}

		@@ -421,64 +422,3 @@ article .color_legend {
		margin-right: .4em;
		}

		.examples-list {
		margin-bottom: 3em;
		margin-top: 1em;
		max-width: 100%;
		overflow: hidden;
		}

		@media screen and (max-width: 850px) {
		.examples-list > div {
		margin-bottom: 1em;
		border-left: 1pt solid #ced3e0;
		border-top: 1pt solid #ced3e0;
		}
		}

		@media screen and (min-width: 850px) {
		.examples-list {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(36em, 1fr));
		border-left: 1pt solid #ced3e0;
		border-top: 1pt solid #ced3e0;
		}
		}

		.examples-list > div {
		height: 100%;
		border-bottom: 1pt solid #ced3e0;
		border-right: 1pt solid #ced3e0;
		box-sizing: border-box;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		}

		.examples-list h3 {
		background: #f8faff;
		color: #111;
		font-weight: 500;
		margin-top: 0;
		padding: .4em .6em;
		border-bottom: 1px solid #ddd;
		font-size: 90%;
		}

		.examples-list h3 code {
		background: transparent;
		}

		.examples-list figure {
		margin: 1em;
		overflow: hidden;
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 1;
		}

		.examples-list figure img {
		width: 100%;
		}

Admin message