merged trash/ into sample/

[myslice.git] / sample / templates / view-tab.html

diff --git a/sample/templates/view-tab.html b/sample/templates/view-tab.html
new file mode 100644 (file)
index 0000000..6b4472b
--- /dev/null
+++ b/sample/templates/view-tab.html
@@ -0,0 +1,70 @@
+{% extends 'layout-unfold2.html' %}
+
+{% block unfold_main %}
+
+{% insert_str prelude "css/sample.css" %}
+{% insert prelude_js %}
+$(function(){$('#tooltipid').tooltip({'selector':'','placement':'bottom'});});
+{% endinsert %}
+
+<div id=sample-tabs>
+<ul class="nav nav-tabs" id='foo'>
+  <li >                                <a href="#name1" data-toggle="tab">Here</a></li>
+  <li class="active">          <a href="#name2" data-toggle="tab">Other</a></li>
+</ul>
+<div class="tab-content">
+   <div class="tab-pane fade in" id="name1">
+     <p> {{ lorem|safe }} </p>
+   </div>
+   <div class="tab-pane fade in active" id="name2">
+     <p> Sample tabs, this one is the active one; A shorter Lorem <code> with embedded code </code> <span class='bold'>ipsum dolor</span> sit amet, consectetuer
+    adipiscing elit, sed diam nonummy nibh euismod tincidunt ut
+    laoreet dolore magna aliquam erat volutpat. Ut wisi enim </p>
+   </div>
+</div>   
+</div>
+
+<p>Let's see what a <button class='unfold-warning btn btn-warning'>warning button</button> looks like.</p>
+
+<div class='well'> a sample of the 'well' class quis nostrud exercitation </div>
+
+a first <a id='tooltipid' href="#" data-toggle="tooltip" data-original-title="what the tooltip displays"> attempt with tooltips </a>
+
+Let us now try to attach <button id='mylougout' class='btn btn-danger' data='mydata'>a click function to a button</button>
+<script>
+function foo() {alert ('foo ' + $(this).attr('data'));}
+$(function() {$('#mylougout').click(foo);})
+</script>
+
+<div>
+ {{ lorem }}   Lorem <span class='bold'>ipsum dolor</span> <code> counter += 1
+  </code> sit amet, consectetuer
+    adipiscing elit, sed diam nonummy nibh euismod tincidunt ut
+    laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim
+    veniam,  ullamcorper suscipit lobortis
+    nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure
+    dolor in hendrerit in vulputate velit esse molestie consequat, vel
+    illum dolore eu feugiat nulla facilisis at vero eros et accumsan
+    et iusto odio dignissim qui blandit praesent luptatum zzril
+    delenit augue duis dolore te feugait nulla facilisi. Nam liber
+    tempor cum soluta nobis eleifend option congue nihil imperdiet
+    doming id quod mazim placerat facer possim assum. Typi non habent
+    claritatem insitam; est usus legentis in iis qui facit eorum
+    claritatem. Investigationes demonstraverunt lectores legere me
+    lius quod ii legunt saepius. Claritas est etiam processus
+    dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum
+    est notare quam littera gothica, quam nunc putamus parum claram,
+    anteposuerit litterarum formas humanitatis per seacula quarta
+    decima et quinta decima. Eodem modo typi, qui nunc nobis videntur
+    parum clari, fiant sollemnes in futurum.
+  </div>
+{% endblock unfold_main %}
+
+{% block unfold_margin %}
+This text is shorter on purpose Lorem <span class='bold'>ipsum
+   dolor</span> sit amet, consectetuer adipiscing elit, sed diam
+   nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
+   volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
+   ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo
+   consequat.
+{% endblock unfold_margin %}