Skip to content
This repository has been archived by the owner on Sep 16, 2019. It is now read-only.

How change the background of gaia? #137

Closed
ISosnovik opened this issue Dec 14, 2016 · 2 comments
Closed

How change the background of gaia? #137

ISosnovik opened this issue Dec 14, 2016 · 2 comments
Labels
Supports in Marp Next The tagged issue has/would resolved in repos on @marp-team, and might close in near future.

Comments

@ISosnovik
Copy link

ISosnovik commented Dec 14, 2016

Gaia is awesome but

  • The background. How could I change it?
  • Code blocks. They are so contrast.

How to change them?
How could I make my own theme?

@ISosnovik ISosnovik changed the title How to add theme? How change the background of gaia? Dec 14, 2016
@matsubara0507
Copy link

I think, quick way is that make css and write link tag to top of md file.
When writing CSS, It is better to refer to sass/themes/gaia.sass.
Write the link tag as follows:

<link rel="stylesheet" href="/gaia.css">
<!-- $theme: gaia -->

# Introducing ==Gaia== theme

#### Marp's new slide theme

###### Created by [Yuki Hattori (@yhatt)](https://github.com/yhatt)

---

but, this way is very hard.

so, I recommend that you actually build at local.
In that case, create a sass file, put it in sass/themes/ and rewrite the coffee file a bit.
rewrite the 32nd line of mds_md_setting.coffee, if make sass/themes/hoge.sass

  return if basename in ['default', 'gaia', 'hoge'] then "css/themes/#{basename}.css" else null

@yhatt yhatt added the Supports in Marp Next The tagged issue has/would resolved in repos on @marp-team, and might close in near future. label Oct 8, 2018
@yhatt
Copy link
Owner

yhatt commented Oct 8, 2018

I think updating source code of the current Marp to customize theme is too hard.

In Marp Next, we prepared a controlled way to customize gaia theme, that came from Marpit framework.

/* theme.css */
@import 'gaia';

section {
  background: white;
}

You can use custom theme in CLI interface.

npx @marp-team/marp-cli slide.md --theme theme.css

If you want not to create a new theme, you can use an inline <style> tag.

---
theme: gaia
---

<style>
section {
  background: white;
}
</style>

Please track #5 about the support of custom CSS theme in GUI interface of Marp Next.

@yhatt yhatt closed this as completed Oct 8, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Supports in Marp Next The tagged issue has/would resolved in repos on @marp-team, and might close in near future.
Projects
None yet
Development

No branches or pull requests

3 participants