Former-commit-id: 90b140d703fb3fce2bef2d98516293854ef9d014 Former-commit-id: a77a9d22757d33850b7366f9d603a920458a29e0 Former-commit-id: d8f16caa59b4ebe374d26c011f967e3dc7e4eef0
55 lines
1.3 KiB
Vue
55 lines
1.3 KiB
Vue
<template>
|
|
<d2-container type="ghost">
|
|
<el-card class="d2-mb">
|
|
<PageHeader
|
|
title="代码高亮组件"
|
|
url="https://github.com/isagalaev/highlight.js">
|
|
</PageHeader>
|
|
</el-card>
|
|
<el-card class="d2-mb">
|
|
<p slot="title">javascript</p>
|
|
<d2-highlight :code="codeJavascript"/>
|
|
</el-card>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-card class="d2-mb">
|
|
<p slot="title">css</p>
|
|
<d2-highlight :code="codeCSS"/>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card class="d2-mb">
|
|
<p slot="title">scss</p>
|
|
<d2-highlight :code="codeSCSS"/>
|
|
</el-card>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-card class="d2-mb">
|
|
<p slot="title">html</p>
|
|
<d2-highlight :code="codeHTML"/>
|
|
</el-card>
|
|
</el-col>
|
|
</el-row>
|
|
<el-card>
|
|
<d2-markdown url="/static/md/组件 - 代码高亮.md"/>
|
|
</el-card>
|
|
</d2-container>
|
|
</template>
|
|
|
|
<script>
|
|
import codeJavascript from './code/javascript'
|
|
import codeCSS from './code/css'
|
|
import codeSCSS from './code/scss'
|
|
import codeHTML from './code/html'
|
|
export default {
|
|
data () {
|
|
return {
|
|
codeJavascript,
|
|
codeCSS,
|
|
codeSCSS,
|
|
codeHTML
|
|
}
|
|
}
|
|
}
|
|
</script>
|