sheng/mes-ui-d2
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

no message

Browse Source 
Former-commit-id: 19bbab73053fe72c9602c376125eec0c3001410e
Former-commit-id: 134f7c8b31d90f8d17214c612f784690e85be6eb
Former-commit-id: e7d159a4da5d6898c11f54626f6293721c33c21d
This commit is contained in:
李杨
2018-02-16 21:42:50 +08:00
parent 874441360e
commit 23ceeafc9c
7 changed files with 17 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/pages/demo/components/highlight/code/css.js Normal file
View File

@@ -0,0 +1,8 @@
export default `body {
background-color: aliceblue;
height: 100%;
}
.my-card {
height: 300px;
width: 300px;
}`

8
src/pages/demo/components/highlight/code/html.js Normal file
View File

@@ -0,0 +1,8 @@
export default `<ul>
<li class="li-1"><p>Hello</p></li>
<li>
<span style="color: red;">
Hello
</span>
</li>
</ul>`

3
src/pages/demo/components/highlight/code/javascript.js Normal file
View File

@@ -0,0 +1,3 @@
export default `[].forEach.call($$("*"), a => {
a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16)
})`

8
src/pages/demo/components/highlight/code/scss.js Normal file
View File

@@ -0,0 +1,8 @@
export default `body {
background-color: aliceblue;
height: 100%;
.my-card {
height: 300px;
width: 300px;
}
}`

51
src/pages/demo/components/highlight/demo.vue Normal file
View File

@@ -0,0 +1,51 @@
<template>
<Container type="ghost">
<el-card class="dd-mb">
<PageHeader
title="组件封装演示"
url="https://github.com/isagalaev/highlight.js">
</PageHeader>
</el-card>
<el-card class="dd-mb">
<p slot="title">javascript</p>
<Highlight :code="codeJavascript"></Highlight>
</el-card>
<el-row :gutter="20">
<el-col :span="8">
<el-card class="dd-mb">
<p slot="title">css</p>
<Highlight :code="codeCSS"></Highlight>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="dd-mb">
<p slot="title">scss</p>
<Highlight :code="codeSCSS"></Highlight>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="dd-mb">
<p slot="title">html</p>
<Highlight :code="codeHTML"></Highlight>
</el-card>
</el-col>
</el-row>
</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>