<template>
	<div class="search-results search-results--projects">
		<div class="simple-subtitle">
			Projects
			<span class="toolbar__search-count">
				{{ results.length }}
			</span>
		</div>
		<w-divider />
		<div class="search-results__project-list">
			<ProjectTile
				v-for="(project, index) in results"
				:key="index"
				:project="project"
			/>
		</div>
	</div>
</template>

<script lang="ts">
import Vue, { PropType } from 'vue';

export default Vue.extend({
	props: {
		results: Object as PropType<any[]>
	}
});
</script>

<style lang="scss">
.search-results__project-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
}
</style>