<template>
	<div class="pane" tabindex="1">
		<div class="content background" style="height: 0">
			<slot>
				<span style="color: #cccccc;align-self: center; flex: 1;text-align: center;">Empty pane</span>
			</slot>
		</div>
		<div class="title-bar">
			<div class="name-icon background">
				<i :class="icon"></i>
				<span>{{title}}</span>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: "Pane",
		data() {
			return {}
		},
		props: ['title', 'icon'],
		methods: {
			onClickMore(){

			}
		}
	}
</script>

<style scoped>

</style>