46 lines
746 B
Vue
46 lines
746 B
Vue
<template>
|
|
<section class="border4">
|
|
<div class="slot">
|
|
<slot/>
|
|
</div>
|
|
<div class="title">{{ title }}</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'border4',
|
|
props: {title: String}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.border4 {
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(33, 73, 157, 0.15);
|
|
border-radius: 6px;
|
|
border: 1px solid #274A7E;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
|
|
.slot {
|
|
width: 100%;
|
|
height: calc(100% - 48px);
|
|
}
|
|
|
|
.title {
|
|
height: 48px;
|
|
line-height: 48px;
|
|
padding: 0 10px;
|
|
color: #82C5FF;
|
|
font-size: 16px;
|
|
text-align: center;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
</style>
|