ui: add line numbers to record_detail code

packages/ui-default/components/highlighter/highlighter.page.styl

@@ -22,9 +22,6 @@ code
   color: $code-color
   font-size: rem($font-size-secondary)
 
-[data-syntax-hl-show-line-number] pre.line-numbers > code
-  white-space: pre
-
 .line-highlight 
   position: absolute
   left: 0
@@ -59,36 +56,6 @@ code
     border-radius: 0px !important
     background: none !important
 
-[data-syntax-hl-show-line-number]
-  pre
-    padding-left: 3.8em
-    counter-reset: linenumber
-
-  pre > code
-    position: relative
-
-  .line-numbers-rows
-    position: absolute
-    pointer-events: none
-    top: 0
-    font-size: 100%
-    left: -3.8em
-    width: 3em
-    letter-spacing: -1px
-    user-select: none
-
-    span
-      pointer-events: none
-      display: block
-      counter-increment: linenumber
-
-      &:before
-        content: counter(linenumber)
-        color: #ddd
-        display: block
-        padding-right: 0.8em
-        text-align: right
-
 .token.tab:not(:empty),
 .token.cr,
 .token.lf,

packages/ui-default/templates/record_detail.html

@@ -18,7 +18,7 @@
         </div>
       </div>
       <div class="section__body">
-        <pre><code class="line-numbers language-{{ model.setting.langs[rdoc.lang].highlight }}">{{ rdoc['code'] }}</code></pre>
+        <pre class="line-numbers"><code class="language-{{ model.setting.langs[rdoc.lang].highlight }}">{{ rdoc['code'] }}</code></pre>
       </div>
     </div>
     {% endif %}