Skip to content

Instantly share code, notes, and snippets.

@jamesmenera
Created January 10, 2012 00:13
Show Gist options
  • Save jamesmenera/1585868 to your computer and use it in GitHub Desktop.
Save jamesmenera/1585868 to your computer and use it in GitHub Desktop.
JADE PAUL IRISH HTML TRICK
JADE:
!!!5
//if ! IE
html
//if IE 6
html.ie6
//if IE 7
html.ie7
//if IE 8
html.ie8
//if IE 9
html.ie9
//if ! IE
html
head
- if (locals.pageTitle)
title!= '&! — ' + pageTitle
- else
title &!
script(src="/public.js")
link(rel="stylesheet", href="/css/coda-slider-2.0.css")
link(rel="stylesheet", href="/css/home.css")
link(rel="author", type="text/plain", href="/humans.txt")
link(rel="fluid-icon", href="http://andbang.com/images/fluid-icon.png")
meta(name="viewport", content="user-scalable=no, width\=device-width")
script(src="https://use.typekit.com/bez1nzc.js")
script
try{Typekit.load();}catch(e){}
body(id=bodyId)
!=body
OUTPUT:
<!DOCTYPE html><!--[if ! IE ]><html></html><![endif]--><!--[if IE 6]><html class="ie6"></html><![endif]--><!--[if IE 7]><html class="ie7"></html><![endif]--><!--[if IE 8]><html class="ie8"></html><![endif]--><!--[if IE 9]><html class="ie9"></html><![endif]--><!--if ! IE--><html><head></head><title>&amp;! &mdash; home</title><script src="/public.js"></script><link rel="stylesheet" href="/css/coda-slider-2.0.css"><link rel="stylesheet" href="/css/home.css"><link rel="author" type="text/plain" href="/humans.txt"><link rel="fluid-icon" href="http://andbang.com/images/fluid-icon.png"><meta name="viewport" content="user-scalable=no, width=device-width"><script src="https://use.typekit.com/bez1nzc.js"></script><script>try{Typekit.load();}catch(e){}
</script><body id="home"></body><div id="background"><header><div><h1 title="&amp;! (andbang)">&amp;!
</h1></div></header><div class="wrapper"><header><nav><a href="#">navigation</a><a href="#">navigation</a><a href="/login" id="login">login</a></nav></header><div class="coda-slider-wrapper"><div id="coda-slider-1" class="coda-slider preload"><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div></div><div id="coda-nav-1" class="coda-nav"><ul><li class="tab1"><a href="#1">Panel 1</a></li><li class="tab2"><a href="#2">Panel 2</a></li><li class="tab3"><a href="#3">Panel 3</a></li><li class="tab4"><a href="#4">Panel 4</a></li></ul></div></div><section id="focus"><span>Ship</span><span>collaborate</span><span>&amp;</span><span>listen</span><p>here is where stuff goes.</p><button>something
</button><button>something
</button></section><section id="testimonials"><h3>Here's what people are saying
</h3><ul><li><q>"Gluten-free iphone chambray yr single-origin coffee."</q><br/><br/><em>-Zooey Deschanel</em><p>Actress & Musician</p></li><li><q>"Gluten-free iphone chambray yr single-origin coffee."</q><br/><br/><em>-Conan O'brien</em><p>Former SNL Comedy Writer</p></li><li><q>"Gluten-free iphone chambray yr single-origin coffee."</q><br/><br/><em>-Conan O'brien</em><p>Former SNL Comedy Writer</p></li></ul></section></div></div><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="/js/jquery.easing.1.3.js"></script><script src="/js/jquery.coda-slider-2.0.js"></script><script type="text/javascript">$().ready(function() {
$('#coda-slider-1').codaSlider({
dynamicArrows: false,
dynamicTabs: false,
autoSlide: true,
autoSlideInterval: 3000,
crossLinking: false
});
});
</script><!--script(src="/js/home.js")--><script>try{Typekit.load();}catch(e){}
</script><script>var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-19634270-5']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
_kmq.push(['record', 'Home Page']);
</script></html>
JADE:
!!!5
| <!--[if IE 7]> <html class="ie6" lang="en"> <![endif]-->
| <!--[if IE 8]> <html class="ie7" lang="en"> <![endif]-->
| <!--[if IE 9]> <html class="ie8" lang="en"> <![endif]-->
| <!--[if ! IE ]><!--> <html lang="en"> <!--<![endif]-->
ERROR:
Error: /Users/james/Sites/andbang/views/layout.jade:7
5| | <!--[if ! IE ]><!--> <html lang="en"> <!--<![endif]-->
6|
> 7| head
8| - if (locals.pageTitle)
9| title!= '&amp;! &mdash; ' + pageTitle
10| - else
unexpected token "indent"
at Object.parseExpr (/Users/james/Sites/andbang/node_modules/jade/lib/parser.js:187:15)
at Object.parse (/Users/james/Sites/andbang/node_modules/jade/lib/parser.js:112:25)
at parse (/Users/james/Sites/andbang/node_modules/jade/lib/jade.js:96:62)
at Object.compile (/Users/james/Sites/andbang/node_modules/jade/lib/jade.js:149:9)
at Function.compile (/Users/james/Sites/andbang/node_modules/express/lib/view.js:65:33)
at ServerResponse._render (/Users/james/Sites/andbang/node_modules/express/lib/view.js:414:18)
at ServerResponse.render (/Users/james/Sites/andbang/node_modules/express/lib/view.js:315:17)
at ServerResponse._render (/Users/james/Sites/andbang/node_modules/express/lib/view.js:429:10)
at ServerResponse.render (/Users/james/Sites/andbang/node_modules/express/lib/view.js:315:17)
at /Users/james/Sites/andbang/serverapp/requestHandler.js:408:13
JADE:
!!!5
//if ! IE
html
//if IE 6
html.ie6
//if IE 7
html.ie7
//if IE 8
html.ie8
//if IE 9
html.ie9
//if ! IE
html
head
- if (locals.pageTitle)
title!= '&amp;! &mdash; ' + pageTitle
- else
title &amp;!
script(src="/public.js")
link(rel="stylesheet", href="/css/coda-slider-2.0.css")
link(rel="stylesheet", href="/css/home.css")
link(rel="author", type="text/plain", href="/humans.txt")
link(rel="fluid-icon", href="http://andbang.com/images/fluid-icon.png")
meta(name="viewport", content="user-scalable=no, width\=device-width")
script(src="https://use.typekit.com/bez1nzc.js")
script
try{Typekit.load();}catch(e){}
body(id=bodyId)
!=body
OUTPUT: ALL COMMENTED OUT BECAUSE OF NESTING
<!DOCTYPE html><!--[if ! IE ]><html></html><![endif]--><!--[if IE 6]><html class="ie6"></html><![endif]--><!--[if IE 7]><html class="ie7"></html><![endif]--><!--[if IE 8]><html class="ie8"></html><![endif]--><!--[if IE 9]><html class="ie9"></html><![endif]--><!--[if ! IE]><html></html><head></head><title>&amp;! &mdash; home</title><script src="/public.js"></script><link rel="stylesheet" href="/css/coda-slider-2.0.css"><link rel="stylesheet" href="/css/home.css"><link rel="author" type="text/plain" href="/humans.txt"><link rel="fluid-icon" href="http://andbang.com/images/fluid-icon.png"><meta name="viewport" content="user-scalable=no, width=device-width"><script src="https://use.typekit.com/bez1nzc.js"></script><script>try{Typekit.load();}catch(e){}
</script><body id="home"></body><div id="background"><header><div><h1 title="&amp;! (andbang)">&amp;!
</h1></div></header><div class="wrapper"><header><nav><a href="#">navigation</a><a href="#">navigation</a><a href="/login" id="login">login</a></nav></header><div class="coda-slider-wrapper"><div id="coda-slider-1" class="coda-slider preload"><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div><div class="panel"><div class="panel-wrapper"><img src="/home/slide1.jpg"/></div></div></div><div id="coda-nav-1" class="coda-nav"><ul><li class="tab1"><a href="#1">Panel 1</a></li><li class="tab2"><a href="#2">Panel 2</a></li><li class="tab3"><a href="#3">Panel 3</a></li><li class="tab4"><a href="#4">Panel 4</a></li></ul></div></div><section id="focus"><span>Ship</span><span>collaborate</span><span>&amp;</span><span>listen</span><p>here is where stuff goes.</p><button>something
</button><button>something
</button></section><section id="testimonials"><h3>Here's what people are saying
</h3><ul><li><q>"Gluten-free iphone chambray yr single-origin coffee."</q><br/><br/><em>-Zooey Deschanel</em><p>Actress & Musician</p></li><li><q>"Gluten-free iphone chambray yr single-origin coffee."</q><br/><br/><em>-Conan O'brien</em><p>Former SNL Comedy Writer</p></li><li><q>"Gluten-free iphone chambray yr single-origin coffee."</q><br/><br/><em>-Conan O'brien</em><p>Former SNL Comedy Writer</p></li></ul></section></div></div><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="/js/jquery.easing.1.3.js"></script><script src="/js/jquery.coda-slider-2.0.js"></script><script type="text/javascript">$().ready(function() {
$('#coda-slider-1').codaSlider({
dynamicArrows: false,
dynamicTabs: false,
autoSlide: true,
autoSlideInterval: 3000,
crossLinking: false
});
});
</script><!--script(src="/js/home.js")--><script>try{Typekit.load();}catch(e){}
</script><script>var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-19634270-5']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
_kmq.push(['record', 'Home Page']);
</script><![endif]-->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment