mirror of
https://github.com/element-plus/element-plus.git
synced 2025-01-24 11:05:17 +08:00
31 lines
639 B
Vue
31 lines
639 B
Vue
|
<template>
|
||
|
|
<div>
|
||
|
|
<template v-for="(shadow, i) in shadowGroup" :key="i">
|
||
|
|
<div
|
||
|
|
class="demo-shadow"
|
||
|
|
:style="{ boxShadow: `var(--el-box-shadow-${shadow.type})` }"
|
||
|
|
></div>
|
||
|
|
<span class="demo-shadow-text">{{ shadow.name }} <code>box-shadow: {{ getValue(shadow.type) }}</code></span>
|
||
|
|
</template>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { getCssVarValue } from '../../../util'
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
shadowGroup: {
|
||
|
|
type: Array,
|
||
|
|
default() {
|
||
|
|
return []
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
getValue(type) {
|
||
|
|
return getCssVarValue('box-shadow', type)
|
||
|
|
},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|