ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Kickoff Snippets

by TryKickoff ALL

:rice_ball: Useful snippets for Sublime Text and Atom

Labels completions, html, css, sass, js, javascript

Details

Installs

  • Total 261
  • Win 127
  • Mac 104
  • Linux 30
Jan 21 Jan 20 Jan 19 Jan 18 Jan 17 Jan 16 Jan 15 Jan 14 Jan 13 Jan 12 Jan 11 Jan 10 Jan 9 Jan 8 Jan 7 Jan 6 Jan 5 Jan 4 Jan 3 Jan 2 Jan 1 Dec 31 Dec 30 Dec 29 Dec 28 Dec 27 Dec 26 Dec 25 Dec 24 Dec 23 Dec 22 Dec 21 Dec 20 Dec 19 Dec 18 Dec 17 Dec 16 Dec 15 Dec 14 Dec 13 Dec 12 Dec 11 Dec 10 Dec 9 Dec 8
Windows 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
Mac 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
Linux 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0

Readme

Source
raw.​githubusercontent.​com

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.