Merge pull request #22 from WebCoder49/prism-line-numbers

Prism line numbers

Author: WebCoder49

plugins/autocomplete.css

@@ -1,3 +1,7 @@
+/**
+ * Display a popup under the caret using the text in the code-input element. This works well with autocomplete suggestions.
+ * Files: autocomplete.js / autocomplete.css
+ */
 code-input .code-input_autocomplete_popup {
     display: block;
     position: absolute;

plugins/autocomplete.js

@@ -1,5 +1,6 @@
 /**
- *
+ * Display a popup under the caret using the text in the code-input element. This works well with autocomplete suggestions.
+ * Files: autocomplete.js / autocomplete.css
  */
 codeInput.plugins.Autocomplete = class extends codeInput.Plugin {
     /**

plugins/autodetect.js

@@ -1,6 +1,7 @@
 /**
  * Autodetect the language live and change the `lang` attribute using the syntax highlighter's 
  * autodetect capabilities. Works with highlight.js.
+ * Files: autodetect.js
  */
 codeInput.plugins.Autodetect = class extends codeInput.Plugin {
     constructor() {

plugins/debounce-update.js

@@ -1,6 +1,7 @@
 /**
  * Debounce the update and highlighting function
- *  https://medium.com/@jamischarles/what-is-debouncing-2505c0648ff1
+ * https://medium.com/@jamischarles/what-is-debouncing-2505c0648ff1
+ * Files: debounce-update.js
  */
 codeInput.plugins.DebounceUpdate = class extends codeInput.Plugin {
     /**

plugins/indent.js

@@ -1,6 +1,7 @@
 /**
  * Adds indentation using the `Tab` key, and auto-indents after a newline, as well as making it 
  * possible to indent/unindent multiple lines using Tab/Shift+Tab
+ * Files: indent.js
  */
  codeInput.plugins.Indent = class extends codeInput.Plugin {
     constructor() {

plugins/prism-line-numbers.css

@@ -0,0 +1,20 @@
+/**
+ * Allows code-input elements to be used with the Prism.js line-numbers plugin, as long as the code-input element 
+ * or a parent element of it has the CSS class `line-numbers`.
+ * https://prismjs.com/plugins/line-numbers/
+ * Files: prism-line-numbers.css
+ */
+/* Update padding to match line-numbers plugin */
+code-input.line-numbers textarea, code-input.line-numbers.code-input_pre-element-styled pre,
+.line-numbers code-input textarea, .line-numbers code-input.code-input_pre-element-styled pre {
+  padding-top: 1em!important;
+  padding-bottom: 1em!important;
+  padding-right: 1em!important;
+  padding-left: 3.8em!important;
+}
+
+/* Remove unnecessary, interfering padding values */
+code-input.line-numbers, code-input.line-numbers.code-input_pre-element-styled code,
+.line-numbers code-input, .line-numbers code-input.code-input_pre-element-styled code{
+  padding: 0;
+}