From 6752bb7475ab30edb093eca8e7f7e67adb360ba3 Mon Sep 17 00:00:00 2001 From: dzello Date: Tue, 17 Jul 2018 11:45:49 +0200 Subject: [PATCH] Swap in robot-lung Reveal.js theme --- exampleSite/content/_index.md | 2 +- .../themes/robot-lung.css} | 36 +++++++++++++++---- 2 files changed, 31 insertions(+), 7 deletions(-) rename exampleSite/static/{themes/dzello.css => reveal-hugo/themes/robot-lung.css} (87%) diff --git a/exampleSite/content/_index.md b/exampleSite/content/_index.md index e11f79b..60032d2 100644 --- a/exampleSite/content/_index.md +++ b/exampleSite/content/_index.md @@ -3,7 +3,7 @@ title = "reveal-hugo" description = "A Hugo theme for creating Reveal.js presentations" outputs = ["Reveal"] [reveal_hugo] -custom_theme = "themes/dzello.css" +custom_theme = "reveal-hugo/themes/robot-lung.css" margin = 0.2 highlight_theme = "color-brewer" transition = "slide" diff --git a/exampleSite/static/themes/dzello.css b/exampleSite/static/reveal-hugo/themes/robot-lung.css similarity index 87% rename from exampleSite/static/themes/dzello.css rename to exampleSite/static/reveal-hugo/themes/robot-lung.css index 47aebf4..a080f8e 100644 --- a/exampleSite/static/themes/dzello.css +++ b/exampleSite/static/reveal-hugo/themes/robot-lung.css @@ -1,8 +1,32 @@ /** - * Black theme for reveal.js. This is the opposite of the 'white' theme. - * - * By Hakim El Hattab, http://hakim.se - */ + + [ robot-lung ] + + A hot pink theme for Reveal.js with Roboto fonts and a colorful border. + By Josh Dzielak, https://dzello.com/, License MIT + + The bold border is optional and requires some HTML. To use it: + + 1. Add 4 divs to your HTML page: +
+
+
+
+ + 2. Set { margin: 0.2 } in the Reveal.js initializer to make sure + your presentation content doesn't collide with the frame. + + Like the theme but don't like the colors? Don't fret. Just change + $borderColor and/or $linkColor below to something else and rebuild. + + Or if you don't want to rebuild the theme just override the .line background + property with some CSS: + + .line { + background: ; + } + +*/ @import url(https://fonts.googleapis.com/css?family=Roboto+Slab:300,700); @import url(https://fonts.googleapis.com/css?family=Roboto:700); section.has-light-background, section.has-light-background h1, section.has-light-background h2, section.has-light-background h3, section.has-light-background h4, section.has-light-background h5, section.has-light-background h6 { @@ -60,7 +84,7 @@ body { background-color: #fff; } .reveal { - font-family: "Roboto Slab", Helvetica, sans-serif; + font-family: "Roboto Slab", serif; font-size: 32px; font-weight: normal; color: #363636; } @@ -91,7 +115,7 @@ body { .reveal h6 { margin: 0 0 20px 0; color: #141414; - font-family: "Roboto", monospace; + font-family: "Roboto", sans-serif; font-weight: 700; line-height: 1.2; letter-spacing: normal;