Welcome to Graphite Paper’s documentation!

graphite offers the infrastructure to enhance your publications for a multi-media and interactive digital context. The more than ever emerging demand for reliable and well-edited information meets a depreciated way of publishing. With graphite papers you can create your standalone publication with one command. Or use the provided starter packs to build up your own and invidualised publication series.

Getting started

Do you want to create a website from a single source or do you want to create your own theme and build up a publication series? - single paper - publication series - individualise theme - contribute to graphite-paper

Install graphite-paper

Mac OS

xCode command line tools Homebrew Python 3 pipenv

Overall design

Layout

  • The standard layout is the multi-layer narrative as described in Paper xCoAx.

  • As an alternative, we provide an slide-based layout, similar to the concept for the m·stats homepage.

Syntax and file structure

  • We distinguish two types of content

  • Markdown (for text) and

  • Objects (which can be stored in individual files or as part of a markdown file) and are described in YAML.

  • There is always a main.md file.

  • Sub-files can either be markdown files or objects

Objects

  • Objects have a class and know class-inheritance – e.g., there could be an object visualization with children like barplot or histogram.

  • Objects are defined in YAML. The parameters available are defined by the class.

Three levels

Frame: This is the outer frame of the HTML report, including the heading. The frame provides an overall structure with tabs and contains a placeholder for the actual article.

Article: One of the tabs in the frame contains the article, which is basically a definition of sub-elements – either plugins (YAML) or text (Markdown).

Plugin / module: Each module has a input definition and returns at least a content object, most modules return an additional aside object. Further details for the layout might also be part of the return values.

Syntax

WORKING FILE:

https://docs.google.com/spreadsheets/d/1bp6Y3C1jGtIH9GvygYurikihPT6EIarLHO20KirznWM/edit#gid=0

First rule

Blank lines divide logical blocks (e.g. paragraphs including asides).

Types of plugins

(1) Import external markdown file or plugin

:--- test.md ---:

or

:--- PLUGIN | config.yaml ---:

(2) Plugin within the text

:--- PLUGIN ---:
param1: abc
param2: xyz
param_list:
  - a1
  - b2
  - c3
:--------------:

(3) Add one or more paragraph-wide side-notes

Lorem impsum und so weiter
:--- NOTE ---:
First side note
:--- NOTE ---:
Second side note
:------------:

(4) Add a side note, which is linked to a word (foot-note-style)

Lorem ipsum [: NOTE | test :] und so weiter
:--- NOTE | test ---:
Here we go…
:-----------------:

Markdown for text

Example:

# Markdown

This an *markdown* example with a bullet list:

* one
* two
* three

Objects are defined as yaml objects

Lorem ipsum dolor[: NOTE:test :] sit amet
sdfasdsd
:--- NOTE:test ---:
This is a test note
:-----------------:

Or as stand-alone objects:

:------------------- CODE ----------------------:
class Test:
    def __init__(self, name):
        self.name = name
:-----------------------------------------------:

External files

:--- file.md ---:

:--- PLUGIN:file.yaml ---:

Marginal notes

Marginal notes can have multiple origins. They can be extracted from the markdown (e.g. footnotes or glossary entries) – syntax to be determined.

Marginal notes concerning the entire paragraph can be separated by three dashes. Example:

This is a paragraph
:--- NOTE ---:
First marginal note
:--- NOTE ---:
Second marginal note for the same paragraph
:------------:

References

The Reference to a source in the text consists of a slug to the full reference and the text displayed.

Note: To display reference icons without inline citation just leave the last element blank.

This is text [: REFERENCE | AuthorCoauthor2020 | Author, F., Coauthor, S. 2016 :] that goes on.

And in references.yaml

AuthorCoauthor2020:
    short: "Author, F., Coauthor, S. (2016). Some fancy title, 7(1)."
    long: ""Author, F., Coauthor, S. (2016). Some fancy title, 7(1). 2053951719897945."

Author

:--- AUTHOR ---:
file: assets/images/authors/….png
name: Martha Mustermann
institution: Brand Inc.
website: https://www.impactdistillery.de/graphite
linkedinName: sample
description: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
:--------------:

Chapter Header

# header

or

:----- CHAPTER_HEADER -----:
image: "assets/images/find-experts-at-kilta-com-k9pmyStHKXE-unsplash.jpg"
title: Introduction
subtitle: Design publications with a digital dissemination in mind
:--------------------------:

Page strucuture

body
    .page-wrap
        nav
        header
        .jumbotron
            p.author
            h1
        article
            .abstract
            .article-info
            section.h2-section
                h2
                ...
                section.h3-section
                    h3
                    ...
                section.h3-section
                    h3
                    ...
            section.h2-section
                h2
                section.h3-section
                section.h3-section
            .contributions.references

____ ROW : figure :: caption: “”” : url::”“

—-/ROW

____ ROW : text

MD

—-/ROW

File structure

main.py

config.yaml (theme, technisch)
module-registration.yaml
tabs.yaml
meta.yaml
audiences.yaml

THEMES
    CORE
        STYLES
            computed-style.css
            SCSS
                theme.scss (lädt partials)
                _variables.scss
                _colors.scss
                _layout.scss
                _grid.scss
                _mixins.scss
                MODULES
                    _video.scss
                    _quote.scss
                    _video-youtube.scss
        SCRIPTS
            main.js
            MODULES
                video.js
        TEMPLATES
            header.html
            .....
            footer.html
    MSTATS
        STYLES
            computed-style.css
            SCSS
                _variables.scss (change look)
                _colors.scss
                MODULES
                    _video-youtube.scss
        SCRIPTS
        TEMPLATES
            footer.html (Piwik)
CONTENT
    main.md
    PARTIALS
        intro.md
        methods.md
        results.md
        abstract.md
        executive-summary.md
    VIDEOS
        adam.yaml
        eva.yaml
    QUOTES
        all-english-quotes.yaml

Indices and tables