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 259
  • Win 126
  • Mac 103
  • Linux 30
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 Dec 7 Dec 6 Dec 5 Dec 4 Dec 3 Dec 2 Dec 1 Nov 30 Nov 29 Nov 28 Nov 27 Nov 26 Nov 25 Nov 24 Nov 23 Nov 22 Nov 21 Nov 20 Nov 19 Nov 18 Nov 17 Nov 16 Nov 15 Nov 14 Nov 13 Nov 12 Nov 11 Nov 10 Nov 9 Nov 8 Nov 7
Windows 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 1 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 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
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.