r1424 - trunk/demos/sortable

r1424 - trunk/demos/sortable


Author: rdworth
Date: Wed Dec 31 15:10:48 2008
New Revision: 1424
Modified:
trunk/demos/sortable/default.html
trunk/demos/sortable/delaydistance.html
trunk/demos/sortable/droponempty.html
trunk/demos/sortable/droppable.html
trunk/demos/sortable/floating.html
trunk/demos/sortable/items.html
trunk/demos/sortable/placeholder.html
Log:
demos/sortable: touched up sortable demos
Modified: trunk/demos/sortable/default.html
==============================================================================
--- trunk/demos/sortable/default.html    (original)
+++ trunk/demos/sortable/default.html    Wed Dec 31 15:10:48 2008
@@ -8,19 +8,19 @@
    <script type="text/javascript" src="../../ui/ui.sortable.js"></script>
    <link type="text/css" href="../demos.css" rel="stylesheet" />
    <style type="text/css">
-    .demo ul { list-style-type: none; margin: 0; padding: 0; }
-    .demo li { margin: 3px; padding: 2px; }
+    #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
+    #sortable li { margin: 3px; padding: 0.4em; font-size: 1.6em; height:
1.4em; }
    </style>
    <script type="text/javascript">
    $(function() {
-        $("ul").sortable();
+        $("#sortable").sortable();
    });
    </script>
</head>
<body>
<div class="demo">
-<ul>
+<ul id="sortable">
    <li class="ui-state-default">Item 1</li>
    <li class="ui-state-default">Item 2</li>
    <li class="ui-state-default">Item 3</li>
@@ -29,8 +29,6 @@
    <li class="ui-state-default">Item 6</li>
    <li class="ui-state-default">Item 7</li>
    <li class="ui-state-default">Item 8</li>
-    <li class="ui-state-default">Item 9</li>
-    <li class="ui-state-default">Item 10</li>
</ul>
</div><!-- End demo -->
@@ -38,7 +36,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->
Modified: trunk/demos/sortable/delaydistance.html
==============================================================================
--- trunk/demos/sortable/delaydistance.html    (original)
+++ trunk/demos/sortable/delaydistance.html    Wed Dec 31 15:10:48 2008
@@ -53,7 +53,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->
Modified: trunk/demos/sortable/droponempty.html
==============================================================================
--- trunk/demos/sortable/droponempty.html    (original)
+++ trunk/demos/sortable/droponempty.html    Wed Dec 31 15:10:48 2008
@@ -53,7 +53,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->
Modified: trunk/demos/sortable/droppable.html
==============================================================================
--- trunk/demos/sortable/droppable.html    (original)
+++ trunk/demos/sortable/droppable.html    Wed Dec 31 15:10:48 2008
@@ -46,7 +46,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->
Modified: trunk/demos/sortable/floating.html
==============================================================================
--- trunk/demos/sortable/floating.html    (original)
+++ trunk/demos/sortable/floating.html    Wed Dec 31 15:10:48 2008
@@ -9,7 +9,7 @@
    <link type="text/css" href="../demos.css" rel="stylesheet" />
    <style type="text/css">
    #sortable { list-style-type: none; margin: 0; padding: 0; }
-    #sortable li { margin: 3px; padding: 2px; float: left; width: 100px;
height: 100px; }
+    #sortable li { margin: 3px; padding: 1px; float: left; width: 100px;
height: 100px; font-size: 4em; text-align: center; }
    </style>
    <script type="text/javascript">
    $(function() {
@@ -21,18 +21,18 @@
<div class="demo">
<ul id="sortable">
-    <li class="ui-state-default">Item 1</li>
-    <li class="ui-state-default">Item 2</li>
-    <li class="ui-state-default">Item 3</li>
-    <li class="ui-state-default">Item 4</li>
-    <li class="ui-state-default">Item 5</li>
-    <li class="ui-state-default">Item 6</li>
-    <li class="ui-state-default">Item 7</li>
-    <li class="ui-state-default">Item 8</li>
-    <li class="ui-state-default">Item 9</li>
-    <li class="ui-state-default">Item 10</li>
-    <li class="ui-state-default">Item 11</li>
-    <li class="ui-state-default">Item 12</li>
+    <li class="ui-state-default">1</li>
+    <li class="ui-state-default">2</li>
+    <li class="ui-state-default">3</li>
+    <li class="ui-state-default">4</li>
+    <li class="ui-state-default">5</li>
+    <li class="ui-state-default">6</li>
+    <li class="ui-state-default">7</li>
+    <li class="ui-state-default">8</li>
+    <li class="ui-state-default">9</li>
+    <li class="ui-state-default">10</li>
+    <li class="ui-state-default">11</li>
+    <li class="ui-state-default">12</li>
</ul>
</div><!-- End demo -->
@@ -40,7 +40,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->
Modified: trunk/demos/sortable/items.html
==============================================================================
--- trunk/demos/sortable/items.html    (original)
+++ trunk/demos/sortable/items.html    Wed Dec 31 15:10:48 2008
@@ -50,7 +50,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->
Modified: trunk/demos/sortable/placeholder.html
==============================================================================
--- trunk/demos/sortable/placeholder.html    (original)
+++ trunk/demos/sortable/placeholder.html    Wed Dec 31 15:10:48 2008
@@ -8,8 +8,8 @@
    <script type="text/javascript" src="../../ui/ui.sortable.js"></script>
    <link type="text/css" href="../demos.css" rel="stylesheet" />
    <style type="text/css">
-    #sortable { list-style-type: none; margin: 0; padding: 0; }
-    #sortable li { margin: 3px; padding: 2px; }
+    #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
+    #sortable li { margin: 3px; padding: 0.4em; font-size: 1.6em; height:
1.4em; }
    </style>
    <script type="text/javascript">
    $(function() {
@@ -31,8 +31,6 @@
    <li class="ui-state-default">Item 6</li>
    <li class="ui-state-default">Item 7</li>
    <li class="ui-state-default">Item 8</li>
-    <li class="ui-state-default">Item 9</li>
-    <li class="ui-state-default">Item 10</li>
</ul>
</div><!-- End demo -->
@@ -40,7 +38,7 @@
<div class="demo-description">


-The easiest way to make an element draggable. Hold down the mouse and drag
it around.
+





</div><!-- End demo-description -->