Giter Club home page Giter Club logo

slidev-theme-thinktecture's Introduction

slidev-theme for Thinktecture

A minimalistic slidev theme for Thinktecture.

Install

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

---
theme: thinktecture
---

Layouts

This theme provides the following layouts:

Cover

By default, the first slide of a deck uses the cover layout.

Cover Layout

The main content of the slide becomes the title, subtitle is set via ::subtitle:: slot and footer using ::footer:: slot

Red variant

To use the red cover, set red: true in frontmatter

Red Cover Layout

Profile slide profile

Profile Layout

You can provide individual profile information using the following frontmatter:

Property Type required description default value
speaker string yes Your name
job string no Your job title Hausmeister
mail string no Your mail address [email protected]
twitter string no Your Twitter handle thinktecture
blog object {name:string, url:string} no your personal blog null
image string yes Path or URL for a picture of you
tags string[] no Technology Focus Tags []
awards string[] no Your awards []

When omitting the optional awards property, profile will render like shown belog

Profile Layout (no-awards)

Section slide section

Section Layout

Set the name of the section using the name property in frontmatter

Immersive layout

Render a bold text in front of a fullsize image using the immersive layout. Set the image in frontmatter:

---
layout: immersive
image: 'https://source.unsplash.com/collection/94734566/1920x1080'
---
# this is a test

Immersive

Red Variant

To use the red immersive layout, set red: true in frontmatter

Immersive

2 Column-Layout

In contrast to the default 2-Column-Layout, ours can render a text spreading accross left and right area.

---
layout: two-columns
---

# This is a two column slide

Some general text that goes before the two columns

::left::

With some text that goes on the left side

- And some
- important bullets

::right::

With some other text that goes on the right side

- Again with some
- very important bullets

2-Column-Layout

Demo time ๐Ÿš€ demo

Demo Layout

You can provide the name of the demo using the name property in frontmatter.

Closing slide closing

Closing Layout

You can set links using the links property in frontmatter. Every link consists of name and url. The footer can be set using the ::footer:: slot.

Red Variant

To use the red closing layout, set red: true in frontmatter

Red Closing Layout

Contributing

  • npm install
  • npm run dev to start theme preview of example.md
  • Edit the example.md and style to see the changes
  • npm run export to generate the preview PDF
  • npm run screenshot to generate the preview PNG

slidev-theme-thinktecture's People

Contributors

thorstenhans avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.