Default new theme is not prepared for a background image

[f84p]

Describe the bug

When using the provided instructions to create a new theme, and adding the line
background: <link_to_image>

to the example.md file withing the template, no image is showing up.

Minimal reproduction

Steps to reproduce the behavior:

1. Run
   pnpm create slidev-theme
2. Add the line to the example.md file inside the template folder:
   background: <link_to_image>
3. Execute:
   pnpm run dev
4. The background image is not showing up

Proposed solution

The custom theme's cover and intro layouts are just "starters" and don't actually have the logic to display background images.

Update the files cover.vue and intro.vue to define a background prop.
Apply a dynamic style that sets the background-image if a path is provided.

Example change:

<script setup lang="ts">
import { computed } from 'vue'
const props = defineProps({
  background: {
    type: String,
  },
})
const style = computed(() => {
  if (props.background) {
    return {
      backgroundImage: `url(${props.background})`,
      backgroundRepeat: 'no-repeat',
      backgroundPosition: 'center',
      backgroundSize: 'cover',
    }
  }
  return {}
})
</script>
<template>
  <div class="slidev-layout cover" :style="style">
    <div class="my-auto w-full">
      <slot />
    </div>
  </div>
</template>

Environment

• Slidev version: v52.11.3
• Browser: Firefox 140.7.0esr (64-Bit)
• OS: Windows 11