[表单设计]卡片阴影预览
parent
f5e75f44de
commit
751b4614df
|
|
@ -44,9 +44,9 @@
|
|||
</Row>
|
||||
</template>
|
||||
<template v-else-if="['Card'].includes(schema.component)">
|
||||
<a-row class="grid-row" style="width:100%">
|
||||
<a-row class="grid-row" style="width:100%;padding:10px;">
|
||||
<a-col class="grid-col" :span="schema.colProps.span">
|
||||
<a-card :title="schema.label">
|
||||
<a-card :title="schema.label" :class="schema.shadow === 'always'? 'card-always': schema.shadow === 'hover'? 'card-hover': ''">
|
||||
<a-row class="grid-row">
|
||||
<a-col
|
||||
class="grid-col"
|
||||
|
|
@ -172,4 +172,16 @@
|
|||
.v-form-render-item {
|
||||
overflow: hidden;
|
||||
}
|
||||
.card-always{
|
||||
border-color: transparent;
|
||||
box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
|
||||
}
|
||||
.card-hover{
|
||||
transition: box-shadow 0.2s, border-color 0.2s;
|
||||
}
|
||||
.card-hover:hover{
|
||||
border-color: transparent;
|
||||
box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue