Merge pull request #6 from bit-docs/static-asset

Add static asset highlight-line.less

Author: leoj3n

highlight-line.js renamed to index.js

@@ -1,3 +1,4 @@
+require("./static/styles/highlight-line.less");
 var $ = require("jquery");
 
 var getLines = function(lineString) {

package.json

@@ -2,7 +2,7 @@
   "name": "bit-docs-html-highlight-line",
   "version": "0.2.3",
   "description": "Highlight a line in source code",
-  "main": "highlight-line.js",
+  "main": "index.js",
   "scripts": {
     "preversion": "npm test",
     "test": "mocha test.js --reporter spec",

static/styles/highlight-line.less

@@ -0,0 +1,38 @@
+@import "locate://bit-docs-site/styles/variables.less";
+
+/**
+ * @parent bit-docs-html-highlight-line/static
+ * @module bit-docs-html-highlight-line/static/styles/highlight-line.less
+ *
+ * @description Base styles for highlight tag.
+ *
+ * @body
+ *
+ * Adds styling for the `.expand` element.
+ *
+ * The `.expand` element gets added onload when the `only` option is used with
+ * the highlight tag, and the code block has lines before/after the highlight.
+ */
+article {
+  code {
+    .expand {
+      color: black;
+      padding: 4px 0px;
+      text-align: center;
+      background-color: #eee;
+      border-top: 1px solid #ccc;
+      border-bottom: 1px solid #ccc;
+    }
+    .expand:before {
+      width: 15px;
+      height: 15px;
+      margin: 0 auto;
+      display: block;
+      content: '⇅ EXPAND ⇅';
+    }
+    .expand:hover {
+      opacity: .6;
+      cursor: pointer;
+    }
+  }
+}