slidev-theme-narduin/layouts/auto-grid.vue

<script setup lang="ts">
const props = defineProps<{
  columns?: number
}>()
</script>

<template>
  <div class="slidev-layout">
    <slot />
    <div class="auto-grid">
      <slot name="content" />
    </div>
  </div>
</template>

<style scoped>
.auto-grid {
  --_columns: v-bind(columns);
  display: grid;
  grid-template-columns: repeat(var(--_columns, 2), 1fr);
  grid-auto-rows: 250px;
  gap: var(--space-xs);
}
.auto-grid > * {
  inline-size: 100%;
  block-size: 100%;
}
</style>