1.0.2 • Published 4 years ago
slidev-theme-light-icons v1.0.2
slidev-theme-light-icons
- A light and Elegant theme for Slidev.
- This theme contains collection of amazing & light-weighted icons called the
light-icons.
Live demo: Click Here.
For more information about light-icons. Visit Light Icons.
100% Light & Dark Compatible
All themes are compatible with light & dark mode
![]()
Install
Add the following frontmatter to your slides.md. Start Slidev then it will prompt you to install the theme automatically.
Learn more about how to use a theme.
Layouts
This theme provides the following layouts:
Intro intro
Usage:
---
layout: intro
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
---![]()
Intro with icon image-header-intro
Usage:
---
layout: image-header-intro
imageHeader: '../assets/images/light-icon-logo.svg'
imageRight: '../assets/images/light-icons-landing.svg'
---![]()
Dynamic Image dynamic-image
Usage:
---
layout: dynamic-image
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
equal: true
left: false
---![]()
Dynamic Image dynamic-image
Usage:
---
layout: dynamic-image
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
equal: false
left: false
---![]()
Dynamic Image dynamic-image
Usage:
---
layout: dynamic-image
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
equal: false
left: true
---![]()
Dynamic Image dynamic-image
Usage:
---
layout: dynamic-image
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
equal: true
left: false
---![]()
Dynamic Image dynamic-image
Usage:
---
layout: dynamic-image
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
upperImage: 'https://source.unsplash.com/collection/94734566/1920x1080'
equal: true
left: false
---![]()
Image at center dynamic-image
Usage:
---
layout: center-image
image: '../assets/images/light-icons-landing2.png'
---![]()
Dynamic Image dynamic-image
Usage:
---
layout: dynamic-image
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
equal: false
left: false
---![]()
Image at left left-image
Usage:
---
layout: left-image
image: '../assets/images/light-vue-landing.svg'
equal: true
---![]()
Image at center dynamic-image
Usage:
---
layout: center-image
---![]()
Components
This theme provides the following components:
LightIcon & IconBox
- For using
light-iconswherever needed inside the theme. - Also packed with additional
IconBoxto make the icons look elegant.
![]()
Contributing
npm installnpm run devto start theme preview ofexample.md- Edit the
example.mdand style to see the changes npm run exportto genreate the preview PDFnpm run screenshotto genrate the preview PNG