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 8 years ago
Last Seen 1 hour ago
First Seen 10 years ago

Installs

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

	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	Aug 22
Windows	0	0	0	0	0	1	0	0	2	0	0	0	0	0	1	1	0	0	0	1	0	0	0	0	1	0	0	0	1	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	1	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
Linux	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	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