Jade Snippets

by P233 ALL

Jade Snippets for Sublime Text 2

Details

Version 2015.02.25.18.52.50
Homepage github.com
Issues github.com
Modified 10 years ago
Last Seen 3 hours ago
First Seen 13 years ago

Installs

Total 37K
Win 19K
Mac 11K
Linux 7K

	Jul 18	Jul 17	Jul 16	Jul 15	Jul 14	Jul 13	Jul 12	Jul 11	Jul 10	Jul 9	Jul 8	Jul 7	Jul 6	Jul 5	Jul 4	Jul 3	Jul 2	Jul 1	Jun 30	Jun 29	Jun 28	Jun 27	Jun 26	Jun 25	Jun 24	Jun 23	Jun 22	Jun 21	Jun 20	Jun 19	Jun 18	Jun 17	Jun 16	Jun 15	Jun 14	Jun 13	Jun 12	Jun 11	Jun 10	Jun 9	Jun 8	Jun 7	Jun 6	Jun 5	Jun 4
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	1	0	1	0	0	0	0	0	0	0	0	0	0	0	0	0	0
Mac	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	1	0	1	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

Jade Snippets for Sublime Text 2

A collection of Jade snippets. All suggestions are welcome.

Installation

Strongly recommend to install this repo through Package Control.

Snippets List

Conditionnals

if =>

if condition
  //- code

if else =>

if condition
  //- code
else
  //- code

each =>

each value in variable
  //- code...

case =>

case condition
  when condition
    //- code
  default
    //- code

Attributes

id => id=""

cla => class=""

hre => href=""

src => src=""

typ => type=""

nam => name=""

rel => rel=""

con => content=""

val => value=""

tar => target=""

act => action=""

met => method=""

pla => placeholder=""

ari => aria-*=""

itemt => itemtype="http://schema.org/*"

items => itemscope=""

itemp => itemprop

rol => role=""

data => data-*=""

Elements

a => a(href="http://", target="_blank")

img => img(src="image/", alt="")

scr => script(type="text/javascript", src="")

lin => link(rel="stylesheet", type="text/css", href="")

Forms

form => form(id="", method="", action="")

inp => input(type="text", placeholder="")

but => button(type="button", placeholder="")

tex => textarea(placeholder="")

pli => p > label(for="") + input(id="", type="")

Jade Specific

exte => extend

inc => include

mix => mixin name(param1, param2)

Filters

st => :stylus

le => :less

md => :markdown

cd => :cdata

co => :coffeescript

Templates

tem =>

doctype html
html
  head(lang="en")
    title ${1:title name}
    meta(http-equiv="content-type", content="text/html; charset=UTF-8")
    meta(name="description", content="")
    meta(name="keywords", content="")
    meta(name="viewport", content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;")
    // if lt IE 9
      script(type="text/javascript", src="js/html5shiv.js")
    link(rel="stylesheet", href="css/style.css", type="text/css")
  body
    header
      h1
    .container

    footer

    script(type="text/javascript", src="js/jquery-1.11.0.min.js")
    // if IE
      script(type="text/javascript", src="js/placeholder.js")

tplh5bp =>

doctype html
//- TODO: Don't forget to set lang !!
html(class="no-js")
  head
    //- TODO: Check if it's the good charset
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    title
    meta(name='description', content='')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    //- TODO : Place favicon.ico and apple-touch-icon.png in the root directory
    block css
      link(rel='stylesheet', href='css/normalize.css')
      link(rel='stylesheet', href='css/main.css')
    block top-script
      script(src='js/vendor/modernizr-2.7.1.min.js')
  body
    //-
      Add your site or application content here
    block main
      p Hello world! This is HTML5 Boilerplate.

    block bottom-script
      script(src='//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js')
      script.
        window.jQuery || document.write('<script src="js/vendor/jquery-1.11.0.min.js"><\/script>')
      script(src='js/plugins.js')
      script(src='js/main.js')
      //- TODO : Google Analytics: change UA-XXXXX-X to be your site\'s ID.
      script.
        (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
        function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
        e=o.createElement(i);r=o.getElementsByTagName(i)[0];
        e.src='//www.google-analytics.com/analytics.js';
        r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
        ga('create','UA-XXXXX-X');ga('send','pageview');

Other

ie => // if lt IE 9

Contributors

rs459