Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Added syntax highlighting to README.md #1

Merged
merged 1 commit into from

2 participants

@drewblas

No description provided.

@heavysixer heavysixer merged commit ad411c7 into heavysixer:master
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Jun 12, 2012
  1. @drewblas

    Syntax highlight readme

    drewblas authored
This page is out of date. Refresh to see the latest.
Showing with 42 additions and 41 deletions.
  1. +42 −41 README.md
View
83 README.md
@@ -12,54 +12,55 @@ How to be spineless
Mustache uses the concept of controllers and views and partials (called templates). The best way explain spineless is to use it. Consider the following example:
- <body>
- <h1>Welcome to the hello world application</h1>
+```html
+<body>
+ <h1>Welcome to the hello world application</h1>
- <!-- Spineless applications render inside a div with an "application" class. -->
- <div class="application">
+ <!-- Spineless applications render inside a div with an "application" class. -->
+ <div class="application">
- <!--
- An application consists of many controllers with nested views.
- By default views and controllers are hidden until you tell Spineless to render them.
- -->
+ <!--
+ An application consists of many controllers with nested views.
+ By default views and controllers are hidden until you tell Spineless to render them.
+ -->
- <div class="controller" data-controller='application'>
- <div class="view" data-action='index'>
+ <div class="controller" data-controller='application'>
+ <div class="view" data-action='index'>
- <!-- Spineless will render templates inside of any tag that uses the "data-template" attribute. -->
- <div style="float:left;" data-template='sideNav'></div>
- <div style="float:left;">
- &lt;-- click a link on the side nav.
- </div>
- </div>
- <div class="view" data-action='hello'>
-
- <!-- again we reuse the sideNav template -->
- <div style="float:left;" data-template='sideNav'></div>
- <h1>HELLO!!!!</h1>
- </div>
- </div>
- </div>
- <div class="templates">
- <div data-template-name='sideNav'>
- <ul>
- <!-- links can be used in spineless by adding the "route" class to them -->
- <li><a class="route" href="/">Home</a></li>
- <li><a class="route" href="/application/hello">Hello</a></li>
- </ul>
+ <!-- Spineless will render templates inside of any tag that uses the "data-template" attribute. -->
+ <div style="float:left;" data-template='sideNav'></div>
+ <div style="float:left;">
+ &lt;-- click a link on the side nav.
</div>
</div>
- <script src="../lib/jquery-1.7.1.min.js" type="text/javascript" charset="utf-8"></script>
- <script src="../lib/jquery.mustache.js" type="text/javascript" charset="utf-8"></script>
- <script src="../spineless.js" type="text/javascript" charset="utf-8"></script>
- <script type="text/javascript">
- $(document).ready(function(){
- var sp = $.spineless();
- sp.render('application', 'index');
- });
- </script>
- </body>
+ <div class="view" data-action='hello'>
+ <!-- again we reuse the sideNav template -->
+ <div style="float:left;" data-template='sideNav'></div>
+ <h1>HELLO!!!!</h1>
+ </div>
+ </div>
+ </div>
+ <div class="templates">
+ <div data-template-name='sideNav'>
+ <ul>
+ <!-- links can be used in spineless by adding the "route" class to them -->
+ <li><a class="route" href="/">Home</a></li>
+ <li><a class="route" href="/application/hello">Hello</a></li>
+ </ul>
+ </div>
+ </div>
+ <script src="../lib/jquery-1.7.1.min.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../lib/jquery.mustache.js" type="text/javascript" charset="utf-8"></script>
+ <script src="../spineless.js" type="text/javascript" charset="utf-8"></script>
+ <script type="text/javascript">
+ $(document).ready(function(){
+ var sp = $.spineless();
+ sp.render('application', 'index');
+ });
+ </script>
+</body>
+```
TODO
====
Something went wrong with that request. Please try again.