Skip to content

TryKickoff/Kickoff-snippets

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Kickoff Snippets

For Sublime Text, Atom & VS Code

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

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.