Skip to content

Instantly share code, notes, and snippets.

View chrisdmacrae's full-sized avatar
🐢
Slowly winning

Chris D. Macrae chrisdmacrae

🐢
Slowly winning
View GitHub Profile
@chrisdmacrae
chrisdmacrae / falcon-punch.tsx
Last active July 9, 2020 22:02
Functional stencil dream
‪@Component({ tag: “falcon-punch” })‬
‪export function FalconPunch(props) {‬
‪ @state() let hasPunched: Boolean = false;‬
const doPunch = () => hasPunched = true;
‪ @onChange(hasPunched)‬
‪ function handleHasPunchChange() {‬
‪ if (hasPunched)‬
‪ alert(`React just got punched!`)‬
@chrisdmacrae
chrisdmacrae / Comparisons.ts
Last active February 10, 2020 03:36
Builder patterns for XState
// Compare fluent to object notation
const pedestrianMachine = Machine({
id: "pedestrian",
initial: 'walk',
states: {
walk: {
on: {
PED_TIMER: 'wait'
}
Factor/Selector Example Value
!important color: red !important; +10000
Inline style tag <div style='color: red;'></div> +1000
ID selectors #myId { color: red; } +100
Class selectors .myClass { color: red; } +10
Attribute selectors [title='Example title'] { color: red; } +10
Pseudo-class selectors :hover { color: red; } +10
Pseudo-selectors ::before { color: red; } / ::after { color: red; } +1
Element/Tag selectors div { color: red; } +1
Source order div { color: blue; } div { color: red; } +1
@chrisdmacrae
chrisdmacrae / README.md
Last active January 30, 2018 21:45
Algolia Search - Forestry.io

Simple Algolia w/ Hugo

The following allows you to easily generate an Algolia index with Hugo consisting of whatever front matter metadata you like.

Why this compared to other plugins?

There are plugins that generate indexes using NPM packages or other tools. The issue is that they don't have any context to your site configuration or Hugo's internals, so they may miss pages or index pages that should not be indexed.

Using Hugo means your index has the full context of your site available when being generated.

Generating Index

To generate the index you create the index's layout at layouts/_default/list.algolia.json.

Folder structure

/app
  /components
    component.jsx
  /content
    /page1/
 file.md