CoFH / cofh.github.io

9 stars 11 forks source link

Cofh World - Add Examples #86

Open sustained opened 5 years ago

sustained commented 5 years ago

Overview

Main Examples Page

The way I have things set up there is a concept of "primary" examples. Every single feature type, distribution type and common format has ONE primary example.

Then there is a master "examples" page which lists all of these primary examples.

The intention is that this page provides a great overview of the mod, complete with example JSON files, images and all. Furthermore, the intent is that these primary examples will be kept nice and simple, so as to not overwhelm people early on.

The link to this new examples page is displayed in the footer.

image

The existence of this new examples page is also alluded to on the main CoFH World page.

image

Docs Pages

On the actual docs pages for feature types, distribution types and common formats the primary example is always the first one displayed (and is highlighted in blue).

Any further examples will be displayed below.

How it works

Examples are defined by markdown files, primarily via YAML front matter.

An example of a minimal example definition file. ```md --- link: docs: /docs/cofh-world/world-generator-configuration/feature-types/boulder/ type: feature group: boulder title: "My Boulder Example" primary: false images: [] --- This is my boulder example. \`\`\`json { "some": "json" } \`\`\` ```

The example files are organised into directories but this is not necessary, it is the type and the group that matters.

Unfortunately Jekyll/Liquid doesn't support any concept of "sub-collections" so I had to use the front matter instead.

Instead of inlining the code like in the above example, it's also possible to use Github Gist. Simply additionally define link.code.embed and link.code.download.

Progress

Primary Examples

Screenshots

How an individual example looks. ![image](https://user-images.githubusercontent.com/5995080/61097690-27982000-a454-11e9-8c74-8d62c0e4ebda.png)
One of the docs pages showing how it looks when there are multiple examples. ![image](https://user-images.githubusercontent.com/5995080/61097744-5e6e3600-a454-11e9-8715-ab5ab1a64afc.png)
The examples page as it currently stands. ![image](https://user-images.githubusercontent.com/5995080/61098111-ba858a00-a455-11e9-8f93-5e3e97a487c1.png)
sustained commented 5 years ago

Note that this isn't what I would call complete, I am just sending in the PR as it is approaching completion. I'll keep working on it in the coming days.

Please let me know if there's anything wrong or that needs to change and I'll get it done.

I'm brand new to Jekyll/Liquid and it's possible I've done something stupid. It's also fairly likely that my code is ugly or dumb.

As I said, just let me know; I'll fix it.

sustained commented 5 years ago

I plan to try to get this finished soon but I'd appreciate a bit of input from the web guy on the work so far because if there are major issues with anything I've done here then I need to know about them so that I can make the necessary changes.

@Tonius

Tonius commented 5 years ago

I tooked around and I quite like how it looks so far. Nice job! When merging I will probably do some finishing touches myself, but nothing really big.

I did notice most of the pages that have examples also have the 'no examples' message at the bottom.

sustained commented 5 years ago

Excellent, I'll try to get this finished soon then.

Huh okay... odd, I'll have to look into that.