large date demo complete

jquerytools · Oct 20, 2011 · 91a5cb9 · 91a5cb9
1 parent f539ebe
commit 91a5cb9
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 9 deletions.
diff --git a/content/demos/dateinput/large-skin.htm b/content/demos/dateinput/large-skin.htm
@@ -6,7 +6,9 @@
 {% endmark %}{% endblock %}
 
 {% block body %}{% mark body %}
+<div style="width:192px;margin:0 auto;">
 <input type="date" name="test" />
+</div>
 
 <script>
   $(":date").dateinput();

diff --git a/content/demos/dateinput/large-skin.html b/content/demos/dateinput/large-skin.html
@@ -10,13 +10,20 @@
 {% endblock %}
 
 {% block demo %}
-<p class="more">
+<div class="blurb">
+
+<h1 class="teaser title">{{ resource.meta.title }}</h1>
+<p>
   Because the calendar is an overlayed element it is possible to use a
   large layout and the user experience won't suffer - quite the
   contrary.
 </p>
 
-{{ standalone.body }}
+<div class="box full">
+{{standalone.body}}
+</div>
+<a class="standalone" href="large-skin.htm">standalone demo</a>
+</div>
 
 <h3>CSS coding</h3>
 
@@ -59,10 +66,4 @@ <h3>CSS coding</h3>
   the <a href="{{ content_url('dateinput/index.html') }}#skinning">skinning
   documentation</a> for the details of CSS id and class names.
 </p>
-
-<div class="box petrol">
-  Here is the <a href="large-skin.htm">standalone version</a> of this
-  demo. You can freely study and copy its source code.
-</div>
-{% endblock %}
-
+{% endblock %}