Updated example and fixed bug in css

RamonSmit · Feb 27, 2015 · fdabbe6 · fdabbe6
1 parent 595a97a
commit fdabbe6
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 151 deletions.
diff --git a/index.html b/index.html
@@ -13,6 +13,7 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
 <title>Nestable</title>
+<link rel="stylesheet" href="jquery.nestable.css">
 <style type="text/css">
 
 .cf:after {
@@ -70,147 +71,6 @@
     font-size: 1.25em;
 }
 
-/**
- * Nestable
- */
-
-.dd {
-    position: relative;
-    display: block;
-    margin: 0;
-    padding: 0;
-    max-width: 600px;
-    list-style: none;
-    font-size: 13px;
-    line-height: 20px;
-}
-
-.dd-list {
-    display: block;
-    position: relative;
-    margin: 0;
-    padding: 0;
-    list-style: none;
-}
-
-.dd-list .dd-list {
-    padding-left: 30px;
-}
-
-.dd-collapsed .dd-list {
-    display: none;
-}
-
-.dd-item,
-.dd-empty,
-.dd-placeholder {
-    display: block;
-    position: relative;
-    margin: 0;
-    padding: 0;
-    min-height: 20px;
-    font-size: 13px;
-    line-height: 20px;
-}
-
-.dd-handle {
-    display: block;
-    height: 30px;
-    margin: 5px 0;
-    padding: 5px 10px;
-    color: #333;
-    text-decoration: none;
-    font-weight: bold;
-    border: 1px solid #ccc;
-    background: #fafafa;
-    background: -webkit-linear-gradient(top, #fafafa 0%, #eee 100%);
-    background: -moz-linear-gradient(top, #fafafa 0%, #eee 100%);
-    background: linear-gradient(top, #fafafa 0%, #eee 100%);
-    -webkit-border-radius: 3px;
-    border-radius: 3px;
-    box-sizing: border-box;
-    -moz-box-sizing: border-box;
-}
-
-.dd-handle:hover {
-    color: #2ea8e5;
-    background: #fff;
-}
-
-.dd-item > button {
-    text-indent: -9999pt;
-    display: block;
-    position: relative;
-    cursor: pointer;
-    float: left;
-    width: 25px;
-    height: 20px;
-    margin: 5px 0;
-    padding: 0;
-    text-indent: 100%;
-    white-space: nowrap;
-    overflow: hidden;
-    border: 0;
-    background: transparent;
-    font-size: 12px;
-    line-height: 1;
-    text-align: center;
-    font-weight: bold;
-}
-
-.dd-item > button:before {
-    content: '+';
-    display: block;
-    position: absolute;
-    width: 100%;
-    text-align: center;
-    text-indent: 0;
-}
-
-.dd-item > button[data-action="collapse"]:before {
-    content: '-';
-}
-
-.dd-placeholder,
-.dd-empty {
-    margin: 5px 0;
-    padding: 0;
-    min-height: 30px;
-    background: #f2fbff;
-    border: 1px dashed #b6bcbf;
-    box-sizing: border-box;
-    -moz-box-sizing: border-box;
-}
-
-.dd-empty {
-    border: 1px dashed #bbb;
-    min-height: 100px;
-    background-color: #e5e5e5;
-    background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),
-    -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
-    background-image: -moz-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),
-    -moz-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
-    background-image: linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),
-    linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
-    background-size: 60px 60px;
-    background-position: 0 0, 30px 30px;
-}
-
-.dd-dragel {
-    position: absolute;
-    pointer-events: none;
-    z-index: 9999;
-}
-
-.dd-dragel > .dd-item .dd-handle {
-    margin-top: 0;
-}
-
-.dd-dragel .dd-handle {
-    -webkit-box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
-    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
-}
-
 /**
  * Nestable Extras
  */

diff --git a/jquery.nestable.css b/jquery.nestable.css
@@ -18,13 +18,6 @@
 .dd-list .dd-list {
   padding-left: 30px;
 }
-.dd-collapsed .dd-list,
-.dd-collapsed .dd-collapse {
-  display: none;
-}
-.dd-collapsed .dd-expand {
-  display: block;
-}
 .dd-item,
 .dd-empty,
 .dd-placeholder {
@@ -54,7 +47,6 @@
   background: #fff;
 }
 .dd-item > button {
-  display: none;
   position: relative;
   cursor: pointer;
   float: left;
@@ -85,7 +77,14 @@
 .dd-item > button.dd-collapse:before {
   content: '-';
 }
-.dd-item > button.dd-collapse {
+.dd-expand {
+  display: none;
+}
+.dd-collapsed .dd-list,
+.dd-collapsed .dd-collapse {
+  display: none;
+}
+.dd-collapsed .dd-expand {
   display: block;
 }
 .dd-empty,
@@ -115,4 +114,4 @@
 }
 .dd-dragel .dd-handle {
   box-shadow: 2px 4px 6px 0 rgba(0,0,0,.1);
-}
+}