优化css高亮

test.md

@@ -1,133 +0,0 @@
-```html
-<div class="code-box">
-  <header class="title">
-    <section><i></i><i></i><i></i></section>
-    <section>${this.lang}</section>
-    <wc-icon
-      title="复制"
-      class="act"
-      name="doc"
-      @click=${this.copyCode}
-    ></wc-icon>
-  </header>
-  <div class="code-block">
-    ${this.#code.map(s => html`<code>${raw(s)}</code>`)}
-  </div>
-</div>
-```
-
-
-```js
-import { html, raw, css, Component, nextTick } from '@bd/core'
-import { colorHtml, colorJs, colorCss, colorMd } from './colorful.js'
-import '../icon/index.js'
-import '../layer/index.js'
-
-function trim(str) {
-  return str
-    .trim()
-    .replace(/&lt;/g, '<')
-    .replace(/&gt;/g, '>')
-    .replace(/&amp;/g, '&')
-}
-
-class Code extends Component {
-  static props = {
-    code: {
-      type: String,
-      default: '',
-      attribute: false,
-      observer(v) {
-        this.setCode(v.trim())
-      }
-    },
-    lang: ''
-  }
-
-  
-
-  #code = []
-
-  setCode(txt, a) {
-    let lang = this.lang
-
-    switch (lang) {
-      case 'js':
-      case 'javascript':
-      case 'ts':
-      case 'typescript':
-        txt = colorJs(txt)
-        break
-
-      case 'html':
-        txt = colorHtml(txt)
-        break
-
-      case 'css':
-      case 'scss':
-      case 'less':
-        txt = colorCss(txt)
-        break
-
-      case 'md':
-      case 'markdown':
-        txt = colorMd(txt)
-        break
-    }
-
-    this.#code = txt.split('\n')
-  }
-
-  copyCode() {
-    navigator.clipboard.writeText(this.code)
-    layer.toast('复制到粘贴板成功', 'success')
-  }
-
-  mounted() {
-    var txt = this.innerHTML || this.textContent
-    txt = txt.trim().replace(/^[\r\n]|\s{2,}$/g, '')
-
-    if (txt.startsWith('<xmp>') && txt.endsWith('</xmp>')) {
-      txt = txt.slice(5, -6).trim()
-    } else if (this.firstElementChild?.tagName === 'TEXTAREA') {
-      txt = this.firstElementChild.value.trim()
-    } else if (txt.startsWith('<pre>') && txt.endsWith('</pre>')) {
-      txt = trim(txt.slice(5, -6))
-    } else {
-      txt = trim(txt)
-    }
-
-    this.textContent = ''
-    if (txt) {
-      nextTick(_ => {
-        this.code = txt
-      })
-    }
-  }
-
-  render() {
-    let foo = html`<section>${this.#code.map(s => html`<a>${s}</a>`)}</section>`
-
-    return html`
-      <div class="code-box">
-        <header class="title">
-          <section><i></i><i></i><i></i></section>
-          <section>${this.lang}</section>
-          <wc-icon
-            title="复制"
-            class="act"
-            name="doc"
-            @click=${this.copyCode}
-          ></wc-icon>
-        </header>
-        <div class="code-block">
-          ${this.#code.map(s => html`<code>${raw(s)}</code>`)}
-        </div>
-      </div>
-    `
-  }
-}
-
-Code.reg('code')
-
-```