Skip to content

Instantly share code, notes, and snippets.

@rodesousa
Created January 2, 2017 12:10
Show Gist options
  • Select an option

  • Save rodesousa/417f6e81f954f2585ed9af964eacd1e5 to your computer and use it in GitHub Desktop.

Select an option

Save rodesousa/417f6e81f954f2585ed9af964eacd1e5 to your computer and use it in GitHub Desktop.

Introducing ==Gaia== theme

Marp's new slide theme


In Greek mythology, Gaia also spelled Gaea, was the personification of the Earth and one of the Greek primordial deities.

-- Gaia (mythology) - Wikipedia, the free encyclopedia


Overview

Gaia is the beautiful presentation theme on Marp!

  • ==New features==
    1. Title Slides
    2. Highlight
    3. Color scheme

How to use

From menu

Select menu: View ➡️ Theme ➡️ Gaia

Use directive

Set gaia theme by $theme Global Directive.

<!-- $theme: gaia -->

Basic example 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor ==incididunt== ut labore et dolore magna aliqua. 😄

Stay Hungry. Stay Foolish. --Steve Jobs (2005)

  • List A
    1. Sub list
    2. Sub list
      • More Sub list

Basic example 2

document.write('Hello, world!');
table layout example
align to left align to center align to right
⬅️ left ⬅️ center ➡️ right ➡️

70% center


Introduce new features!!

==1.== Title Slides


==e.g.== This page 😋


==Apply centering== to the page
that has only headings!

Useful to title slide. 😆

==Tips:== Apply vertical centering to quote only page too.


==2.== Highlight


Highlight Markup

You can use == for ==highlighting blue==.

==This is highlight markup.==

Notice

Marp would show yellow marker highlight in Markdown view or default slide theme.


==3.== Color scheme templates


==Color== scheme templates

Change color scheme by template page directive.

<!-- template: default -->
  • Default ⬅️ This page
  • Invert
  • Gaia (Theme color)

==Color== scheme templates

Change color scheme by template page directive.

<!-- template: invert -->
  • Default
  • Invert ⬅️ This page
  • Gaia (Theme color)

==Color== scheme templates

Change color scheme by template page directive.

<!-- template: gaia -->
  • Default
  • Invert
  • Gaia (Theme color) ⬅️ This page

Templates can use
to ==per pages==!

with using temporally page directive <!-- *template: invert -->

==That's all!==

Let's create beautiful slides
with ==Marp== + ==Gaia== theme!


<!-- $theme: gaia --> of Marp

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment