31 lines
		
	
	
		
			789 B
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			31 lines
		
	
	
		
			789 B
		
	
	
	
		
			Vue
		
	
	
	
<template>
 | 
						|
    <section class="p-3 rounded-lg flex flex-col" :class="{'bg-gray-800': second === false, 'bg-gray-700': second === true}">
 | 
						|
        <div class="flex items-center">
 | 
						|
            <div class="col-span-full font-semibold text-gray-300" v-if="heading" v-text="heading"></div>
 | 
						|
            <slot name="in-title"></slot>
 | 
						|
        </div>
 | 
						|
        <main :class="{'mt-2': heading, [containerClass]: true}">
 | 
						|
            <slot></slot>
 | 
						|
        </main>
 | 
						|
    </section>
 | 
						|
</template>
 | 
						|
 | 
						|
<script>
 | 
						|
export default {
 | 
						|
    props: {
 | 
						|
        heading: {
 | 
						|
            type: String,
 | 
						|
        },
 | 
						|
        second: {
 | 
						|
            type: Boolean,
 | 
						|
            default: false,
 | 
						|
        },
 | 
						|
        containerClass: {
 | 
						|
            default: function () {
 | 
						|
                return '';
 | 
						|
            },
 | 
						|
        },
 | 
						|
    },
 | 
						|
};
 | 
						|
</script>
 |