slidev-theme-antfu-vite-conf-2023 v0.1.9

slidev-theme-antfu-vite-conf-2023

A reproduce the ppt style of antfu's speech at viteConf2023 theme for Slidev.

Live demo: here

Install

Add the following frontmatter to your slides.md. Start Slidev then it will prompt you to install the theme automatically.

It is also required to install the npm package vite-svg-loader and adding a vite.config.js in your project with the following:

import svgLoader from 'vite-svg-loader'

export default {
  plugins: [svgLoader()],
}

Learn more about how to use a theme.

Layouts

This theme provides the following layouts:

Custom light gradient color

Gradient color is implemented using CSS

Gradient color default value:

.defaltLinearGradient {
    background-image: linear-gradient(to right , rgb(207 200 89 / 1 ) 0% , rgb(77 189 127 / 1 ) 50% , rgb(77 189 172 / 1 ) 100%)
}

---
themeConfig:
 linearGradient: 'linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%)'
---

Configure lighting direction

Provides 8 different angles of lighting directions

The default value is right-up

Number mapping in position matches ppt page number

---
themeConfig:
 linearGradient: 'linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%)'
 position: 
  1: right-up
  2: right-middle
  3: right-down
  4: left-down
  5: left-middle
  6: left-up
  7: top-up
  8: top-down
---

You can also set it to none and it will not have any lighting

---
themeConfig:
 linearGradient: 'linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%)'
 position: 
  1: none
---

Case

Start	End

Thank

• https://talks.antfu.me/2023/viteconf/1
• https://antfu.me/posts/roads-to-oss-set-theory-viteconf-2023
• https://sli.dev/