A full reference of styles available for your cheat sheets.
This cheatsheet is a complete reference of all the supported display options!
This section list all the markdown elements used to render cheat sheests.
-one-column |
|
-two-column |
(default) |
-three-column |
|
-left-reference |
3 columns (short first column) |
-no-hide |
Don’t hide H2 |
See: H2 sections
## Section
{: .-two-column}
Devhints uses Kramdown, and supports adding classes via Kramdown’s syntax.
This is a section with {: .-prime}
. Notice the fancy highlight! Great for “getting started” kind of snippets.
Every box is an H3 section. The box will encompass everything inside the body of the H3.
This is a basic section with paragraphs in it.
here.is(() => {
some.code()
})
here.is.some.more()
Code blocks can be placed one after the other.
See: Cheatsheets
here.is(() => {
some.code()
})
here.is.some.more()
Code blocks can have headings.
app.start(() => {
const port = app.server.port
console.log(`Started at ${port}`)
})
Add {: data-line="3"}
to add line highlights.
app.start(() => {
const port = app.server.port
console.log(`Started at ${port}`)
})
Add {: data-line="2,3"}
to add multiple line highlights.
import React from 'react'
class Hello extends React.Component {
render () {
return <span>Hello</span>
}
}
Add {: .-setup}
to a pre
or table
or ul
.
function createNode(nodeName: string, options: { key: string }) {
return true
}
Long lines will have scrollbars.
<script>(function(d,s){if(window.Promise&&[].includes&&Object.assign&&window.Map)return;var js,sc=d.getElementsByTagName(s)[0];js=d.createElement(s);js.src='https://cdn.polyfill.io/v2/polyfill.min.js';sc.parentNode.insertBefore(js, sc);}(document,'script'))</script>
Add -wrap
to wrap long lines.
createElement()
componentDidMount()
componentWillUnmount()
shouldComponentUpdate()
componentWillReceiveProps()
Here’s an extra paragraph after the list.
Add {: .-six-column}
to make large lists.
Add {: .-four-column}
to make large lists.
This is a basic section with paragraphs in it. When paragraphs are the first elements in an H3 section’s body, they appear as white.
Example | Output |
---|---|
%m/%d/%Y |
06/05/2013 |
%A, %B %e, %Y |
Sunday, June 5, 2013 |
%b %e %a |
Jun 5 Sun |
Example | Output |
---|---|
%H:%M |
23:05 |
%I:%M %p |
11:05 PM |
This is a basic table with h4’s.
V |
Vector |
P |
Pencil |
T |
Text |
L |
Line |
R |
Rectangle |
O |
Oval |
U |
Rounded |
Add {: .-shortcuts}
to tables.
Prefix | Example | What |
---|---|---|
// |
//hr[@class='edge'] |
Anywhere |
./ |
./a |
Relative |
/ |
/html/body/div |
Root |
Add {: .-headers}
to add headers.