Skip to content

alchemmist/slidev-theme-alchemmist

Repository files navigation

slidev-alchemmist-theme demo

npm npm Last commit Stars Forks License Contributors Blog

A modern, customizable Slidev theme inspired by design of alchemmist blog. slidev-alchemmist-theme provides polished typography, color tokens, and layout components to make creating clean and beautiful Slidev presentations fast and consistent.

Slideck demo

Features

  • Clean and stylish typography
  • Toolkit of custom components (like Quote, Card, ...)
  • Builtin pagination
  • Builtin auto footer with page-level disable rules
  • The mechanism of slides section with colorful markers
  • Table of contents in table view

Try all this featrues in demo.

Installation

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

---
theme: alchemmist
---

Learn more about how to use theme.

Footer

Footer is now rendered automatically for every slide.

Use per-slide frontmatter to disable footer:

---
footer: false
---

You can still use themeConfig.footerPagesDisabled to disable footer on specific page numbers:

---
theme: alchemmist
themeConfig:
  footerPagesDisabled: [1, 4, 5]
---

Pagination

Pagination is rendered automatically when themeConfig.paginationX or themeConfig.paginationY is set.

Use per-slide frontmatter to disable pagination:

---
pagination: false
---

You can still use themeConfig.paginationPagesDisabled to disable pagination on specific page numbers.

To set custom footer for whole deck, create your own component and set it in themeConfig.footerComponent.

---
theme: alchemmist
themeConfig:
  footerComponent: ProjectFooter
---

Then implement components/ProjectFooter.vue (name must match footerComponent) and reuse base theme footer via AlchemmistFooter if needed.

Theme also exposes dynamic CSS variable --alchemmist-footer-height, so custom layouts can subtract real footer height from available space.

Development

Firstly, read the "writing theme" section in slidev docmentation.

Contributing

You can offer any contribution, that you want. But some tips from me:

  1. Bug reports it's very needed of this repository, make it more and more.
  2. In first order, this is a my personal theme. That mean design of theme depends of me totally. But you can suggest design improvments too, maybe we have same style.
  3. You are welcome to Examples of usage section. Use this theme (or use fork of this theme, it's absalutlly okey) and make it public. Then you can suggest you project and I'm put it to this README. It can be help to you popularity.
  4. If you add a new feature, don't forgot to put example of it to example slides.

Examples of usage

The list of projects, which use this theme:

  • talks — The collection of slides, from my public talks
  • EOSP — The eductional curse, that was read at Central University.

About

Theme for slidev in design inspired by the blog alchemmist.xyz

Topics

Resources

License

Stars

Watchers

Forks

Contributors