Fixing borders around inline document node elements which text starts at a new line

[fnpeditor.git] / modules / documentCanvas / documentCanvas.less

diff --git a/modules/documentCanvas/documentCanvas.less b/modules/documentCanvas/documentCanvas.less
index 94a8b6e..69808ea 100644 (file)
--- a/modules/documentCanvas/documentCanvas.less
+++ b/modules/documentCanvas/documentCanvas.less
@@ -1,60 +1,105 @@
-@import 'nodes.less';\r
-\r
-#rng-module-documentCanvas {\r
-   height: 100%;\r
-}\r
-\r
-#rng-module-documentCanvas-mainArea {\r
-   height: 100%;\r
-   margin-bottom: 20px;\r
-}\r
-\r
-#rng-module-documentCanvas-contentWrapper {\r
-    border-color: #ddd;\r
-    border-style: solid;\r
-    border-width: 1px;\r
-    float:left;\r
-    width: 100%;\r
-    height: 100%;\r
-    overflow-y: scroll;\r
-    padding: 0 10px;\r
-    \r
-    &::-webkit-scrollbar {\r
-        .rng-mixin-scrollbar;\r
-    }\r
-    &::-webkit-scrollbar-track {\r
-        .rng-mixin-scrollbar-track;\r
-    }\r
-    &::-webkit-scrollbar-thumb {\r
-        .rng-mixin-scrollbar-thumb;\r
-    }\r
-    &::-webkit-scrollbar-thumb:window-inactive {\r
-        .rng-mixin-scrollbar-thumb-window-inactive;\r
-    }\r
-    \r
-    #rng-module-documentCanvas-content {\r
-        outline: 0px solid transparent;\r
-    }\r
-}\r
-\r
-.rng-module-documentCanvas-currentNode {\r
-    background: #fffacd;\r
-    border-color: grey;\r
-    border-style:dashed;\r
-    border-width:1px;\r
-}\r
-\r
-.rng-module-documentCanvas-hoveredNodeTag {\r
-    position:absolute;\r
-    height:20px;\r
-    top:-20px;\r
-    left:0;\r
-    background: #bd362f;\r
-    color: white;\r
-    font-size:9px;\r
-    font-weight: normal;\r
-    font-style: normal;\r
-    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r
-    padding: 0 5px;\r
-    text-indent: 0;\r
+@import 'nodes.less';
+
+#rng-module-documentCanvas {
+   height: 100%;
+}
+
+#rng-module-documentCanvas-mainArea {
+   height: 100%;
+   margin-bottom: 20px;
+}
+
+#rng-module-documentCanvas-contentWrapper {
+    border-color: #ddd;
+    border-style: solid;
+    border-width: 1px;
+    float:left;
+    width: 100%;
+    height: 100%;
+    overflow-y: scroll;
+    padding: 0 10px;
+    
+    &::-webkit-scrollbar {
+        .rng-mixin-scrollbar;
+    }
+    &::-webkit-scrollbar-track {
+        .rng-mixin-scrollbar-track;
+    }
+    &::-webkit-scrollbar-thumb {
+        .rng-mixin-scrollbar-thumb;
+    }
+    &::-webkit-scrollbar-thumb:window-inactive {
+        .rng-mixin-scrollbar-thumb-window-inactive;
+    }
+    
+    .canvas-wrapper {
+        outline: 0px solid transparent;
+    }
+
+    .current-text-element {
+        outline: 1px dashed black;
+    }
+
+    .current-node-element {
+        border-color: lighten(#000, 15%);
+        border-style: solid;
+        border-width: 1px;
+    }
+
+    .highlighted-element {
+        border: 1px solid red;
+    }
+
+
+    .canvas-widgets {
+        display: inline;
+    }
+
+    .canvas-widget {
+        display: none;
+    }
+
+    .canvas-widget-label {
+        position: absolute;
+        display: none;
+        top: -20px;
+        left:0;
+        background-color: red;
+        color: white;
+        font-size:12px;
+        font-weight: bold;
+        padding: 1px 3px;
+        //width:300px;
+        opacity: 0.65;
+        font-family: monospace;
+        z-index:9999;
+        white-space: nowrap;
+    }
+}
+
+.rng-module-documentCanvas-currentNode {
+    background: #fffacd;
+    border-color: grey;
+    border-style:dashed;
+    border-width:1px;
+}
+
+.rng-module-documentCanvas-hoveredNodeTag {
+    position:absolute;
+    height:20px;
+    top:-20px;
+    left:0;
+    background: #bd362f;
+    color: white;
+    font-size:9px;
+    font-weight: normal;
+    font-style: normal;
+    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    padding: 0 5px;
+    text-indent: 0;
+}
+
+[document-node-element] {
+    position:relative;
+    border: 1px solid white;
 }
\ No newline at end of file