Kickoff Snippets
:rice_ball: Useful snippets for Sublime Text and Atom
Details
Installs
- Total 256
- Win 124
- Mac 102
- Linux 30
Oct 6 | Oct 5 | Oct 4 | Oct 3 | Oct 2 | Oct 1 | Sep 30 | Sep 29 | Sep 28 | Sep 27 | Sep 26 | Sep 25 | Sep 24 | Sep 23 | Sep 22 | Sep 21 | Sep 20 | Sep 19 | Sep 18 | Sep 17 | Sep 16 | Sep 15 | Sep 14 | Sep 13 | Sep 12 | Sep 11 | Sep 10 | Sep 9 | Sep 8 | Sep 7 | Sep 6 | Sep 5 | Sep 4 | Sep 3 | Sep 2 | Sep 1 | Aug 31 | Aug 30 | Aug 29 | Aug 28 | Aug 27 | Aug 26 | Aug 25 | Aug 24 | Aug 23 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Windows | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 2 | 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 | 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:
- Run
Package Control: Install Package
command, find and install Kickoff Snippets plugin. - Restart ST editor (if required)
Atom
- Go to
Atom > Preferences...
then search for kickoff-snippets in Packages tab. - Restart Atom.
VS Code
- Launch VS Code Quick Open (
⌘+P
), paste the following command, and press enter 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.