Kickoff Snippets

For Sublime Text, Atom & VS Code

Use these snippets if you use the Kickoff framework & Sublime Text or Atom

• Kickoff demos

How to install

Sublime

With Package Control:

1. Run Package Control: Install Package command, find and install Kickoff Snippets plugin.
2. Restart ST editor (if required)

Atom

1. Go to Atom > Preferences... then search for kickoff-snippets in Packages tab.
2. Restart Atom.

VS Code

1. Launch VS Code Quick Open (⌘+P), paste the following command, and press enter
2. ext install kickoff-snippets

Tab triggers

• CSS
• animation: animation TAB
• background-size: background-size TAB
• background: background TAB
• border-radius: border-radius TAB
• box-shadow: box-shadow TAB
• media-query: media TAB
• transform: transform TAB
• transition: transition TAB
• translate3d: translate3d TAB
• HTML
• 2 grid columns: grid TAB
• grid row: grid TAB
• grid column: grid TAB
• media object: media TAB
• button: btn TAB
• fluid video: video TAB
• checkbox: checkbox TAB
• radio: radio TAB
• select: select TAB
• file: file TAB
• form actions: actions TAB
• input: input TAB
• table: table TAB
• svg: svg TAB
• Javascript
• es6 module: es6 TAB
• attach.js module: attach TAB
• double-dollar: $$ TAB
• SCSS
• before: before TAB
• link: link TAB
• visited: visited TAB
• active: active TAB
• hover: hover TAB
• after: after TAB
• before&after: beforeafter TAB
• font-size mixin: font-size TAB
• media-query mixin: mq TAB
• hidpi mixin: hidpi TAB
• respond-min mixin: rmin TAB (deprecated)
• respond-max mixin: rmax TAB (deprecated)
• respond-minmax mixin: rminmax TAB (deprecated)
• rotate mixin: rotate TAB
• size mixin: size TAB
• square mixin: square TAB
• transition: transition TAB
• modular-scale function: modular-scale TAB
• multiply function: multiply TAB
• map-deep-get function: map-deep-get TAB
• color variables: color TAB
• default-transition variables: default-transition TAB
• font-family variables: font-family TAB

Sublime to Atom converter

./atomizr -i "~/htdocs/trykickoff/Kickoff-snippets/SASS/*.sublime-snippet" -o snippets.cson --split

Publishing to Atom package or packagecontrol.io

Ensure you have Atom installed, then run (we use apm to increment the version number:

apm publish major|minor|patch

# for VS Code
vsce publish

This bumps the version, adds a tag, publishes to Atom's package repo. Package Control watches for changes so will take a little longer.

Convert sublime snippets to VS Code

Use http://codebeautify.org/javascript-escape-unescape to escape the body of the snippet. Manually copy the rest.