ledge 0.2.1 → 0.2.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: b6a4ea2983504f61b4d1b612b51bf0fa9de46903
-  data.tar.gz: 8facd3ec72865f734af7d8c84b4096b66643dadd
+  metadata.gz: 1dd5195c2b21faf616f0a7e40862870a420ffc40
+  data.tar.gz: c7d7f96c26ba255fadf4f9328e4138785c91c74d
 SHA512:
-  metadata.gz: af81eb7ac375a1e615e7ab1daba0867d11128a7d81826e8b77a7e88cde7f2dbb790782f093be0da02d0637eaf5269887b84cd47f757c1b279622d00dae040997
-  data.tar.gz: f4cd37fdcc5bf7436411e5e8a2b513814ba02a39e140cfdc4333a751bbe1a40f5d042637c4286bfe08fd2f69995c4bc266d468afe9a3f429c3c10dfd3bdaa47d
+  metadata.gz: 6b6a6a02b0c9fccaf9dddb1587e74663ad5da534f0ca9adb6e9c9b71b7d3315842505e3680f4c41572f2198ee39ea39f39ddac44d69d5348733ed653449a767d
+  data.tar.gz: 1bd59654f9d6176b4fa97a8f01ee3e4a9cbe1b8b9b154815ac32611d6ef0dd3f9055c6c672960702bdb4365230e2ebbb34249cd861544a52477f4ae4fef6aab8

data/app/assets/javascripts/ledge/index.coffee

@@ -56,7 +56,7 @@ class Ledge
     $("textarea#ledge").text(Ledge::jsonify($("div.__ledge_edit")))
 
   create_row: (type, content) ->
-    row = $("<div class='__ledge_row __ledge_row_#{type}' data-ledge-type='#{type}' contenteditable><div class='__ledge_options'></div><div class='__ledge_row_content'>#{content}</div></div>")
+    row = $("<div class='__ledge_row __ledge_row_#{type}' data-ledge-type='#{type}'><div class='__ledge_options'></div><div class='__ledge_row_content' contenteditable>#{content}</div></div>")
     row.on "input", ->
       Ledge::update_textarea()
     if (Ledge::ROW_TYPE_PAIR[type] != undefined)
@@ -86,7 +86,7 @@ class Ledge
     $(".__ledge_column").prepend("<div class='__ledge_add'>+</div>")
     $(".__ledge_column .__ledge_add").click ->
       row = Ledge::create_row "new", Ledge::ROW_ADD_HTML
-      row.attr("contenteditable", false)
+      row.find(".__ledge_row_content").attr("contenteditable", false)
       $(this).after(row)
       Ledge::refresh_row_adders()
       row.find(".__ledge_add_item").click ->
@@ -95,10 +95,10 @@ class Ledge
         Ledge::add_options(index, $(this).parent().parent().find(".__ledge_options"))
         $(this).parent().parent()
           .removeClass("__ledge_row_new")
-          .attr("contenteditable", true)
           .addClass("__ledge_row_#{type}")
           .attr("data-ledge-type", type)
           .find(".__ledge_row_content")
+          .attr("contenteditable", true)
           .html(Ledge::ROW_TYPES[index]::initial_content)
         Ledge::update_textarea()
   click_delete_column: (del) ->

data/app/assets/stylesheets/ledge/index.scss

@@ -1,3 +1,7 @@
+[contenteditable]:focus {
+  outline: 0px solid transparent;
+}
+
 .__ledge_edit {
   display: table;
 
@@ -15,22 +19,20 @@
     position: relative;
     min-height: 36px;
     line-height: 36px;
-    padding: 5px 10px;
-    border-radius: 5px;
     transition: 0.15s all;
 
-    .__ledge_options {
-      visibility: hidden;
-      transition: 0.2s all;
-      opacity: 0;
-    }
-
     &:hover {
       background: #ECEFF1;
+      border-radius: 5px;
+    }
 
-      .__ledge_options {
-        visibility: visible;
-        opacity: 1;
+    .__ledge_row_content {
+      padding: 10px 10px;
+      padding-top: 42px;
+
+      h1, h2, h3, h4, h5, h6, p {
+        padding: 0;
+        margin: 0;
       }
     }
 
@@ -38,11 +40,11 @@
       background: #ECEFF1;
       margin: 10px 0;
       text-align: center;
-      padding: 10px 20px;
 
       .__ledge_row_content {
         margin: auto;
         display: inline-block;
+        padding: 10px 20px;
 
         .__ledge_add_item {
           background-color: #607D8B;
@@ -107,10 +109,10 @@
   .__ledge_options {
     position: absolute;
     top: 0;
+    left: 0;
     right: 0;
-    background: rgba(255, 255, 255, .8);
-    border-bottom-left-radius: 5px;
-    border-top-right-radius: 5px;
+    overflow: hidden;
+    height: 32px;
 
     > div {
       transition: 0.15s all;
@@ -128,26 +130,41 @@
       user-select: none;
 
       &:hover {
-        background-color: rgba(255, 0, 0, .4);
+        background-color: rgba(0, 0, 0, .1);
+      }
+
+      &:first-child {
+        border-top-left-radius: 5px;
       }
     }
 
     .__ledge_delete {
       background-image: image-url("trash.png");
+      float: right;
+      border-top-right-radius: 5px;
+
+      &:hover {
+        background-color: rgba(255, 0, 0, .4);
+      }
     }
+  }
 
-    :last-child {
+  .__ledge_column > .__ledge_options {
+    left: inherit;
+    .__ledge_delete {
       border-top-right-radius: 5px;
-    }
+      border-top-left-radius: 0px;
 
-    :first-child {
-      border-bottom-left-radius: 5px;
+      &:hover {
+        background-color: rgba(255, 0, 0, .4);
+      }
     }
   }
 }
 
 .__ledge_content {
   display: table;
+
   .__ledge_column {
     padding-right: 20px;
     display: table-cell;

data/lib/ledge/version.rb

@@ -1,3 +1,3 @@
 module Ledge
-  VERSION = "0.2.1"
+  VERSION = "0.2.2"
 end