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 266
  • Win 130
  • Mac 105
  • Linux 31
Mar 30 Mar 29 Mar 28 Mar 27 Mar 26 Mar 25 Mar 24 Mar 23 Mar 22 Mar 21 Mar 20 Mar 19 Mar 18 Mar 17 Mar 16 Mar 15 Mar 14 Mar 13 Mar 12 Mar 11 Mar 10 Mar 9 Mar 8 Mar 7 Mar 6 Mar 5 Mar 4 Mar 3 Mar 2 Mar 1 Feb 28 Feb 27 Feb 26 Feb 25 Feb 24 Feb 23 Feb 22 Feb 21 Feb 20 Feb 19 Feb 18 Feb 17 Feb 16 Feb 15 Feb 14
Windows 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 1 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 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0
Linux 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 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.