Kickoff Snippets
:rice_ball: Useful snippets for Sublime Text and Atom
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:
- 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.