Skip to content

GitLab

Commit 2318165f authored by JackV's avatar JackV
Browse files

Merge branch 'add_header' into 'master' 

Add header

See merge request !1
parents 4aa71933 24204eb6
Show whitespace changes
Inline Side-by-side
README.md
View file @ 2318165f
...@@ -37,7 +37,8 @@ In case you need the mathjax submodule as well ...@@ -37,7 +37,8 @@ In case you need the mathjax submodule as well
1. Clone this repo 1. Clone this repo
1. Change origin to your repo 1. Change origin to your repo
1. Push 1. Push
1. Edit `content.md` and `index.html` 1. Add author's info in `./slides/intro.html` and `./slides/outro.html`
1. Put your content in `./slides/content.md` or add slides files in `./slides/` and link these in `./index.html`
### How do I write my stuff? ### How do I write my stuff?
...@@ -50,18 +51,15 @@ four dashes (`----`) to create a new one vertically. ...@@ -50,18 +51,15 @@ four dashes (`----`) to create a new one vertically.
Use `Notes:` to add reader notes to your slide. Use `Notes:` to add reader notes to your slide.
Alternatively you can write your slides with pure **html**
### How do I see my stuff? ### How do I see my stuff?
- You can display `index.html` with your browser - You can run `./deploy.py` with Python 3 and open the provided link in your browser.
or
- You can run `deploy.py` with Python 3 and open the provided link in your browser.
## How do I make a PDF out of the slides? ## How do I make a PDF out of the slides?
Append `?print-pdf` at the end of the URL. Click on the printer symbol in the bottom-left corner to get the printable version of the slides.
For instance if you're running the `deploy.py` script locally the URL will be
something like `http://127.0.0.1:8080/?print-pdf`.
Then just use the print function of your browser to make a PDF of the page. Then just use the print function of your browser to make a PDF of the page.
......
index.html
View file @ 2318165f
<!doctype html> <!doctype html>
<html lang="it">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8"/>
<meta name="description" content=""> <meta content="" name="description"/>
<meta name="author" content=""> <meta content="" name="author"/>
<meta name="viewport" <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, <meta content="yes" name="apple-mobile-web-app-capable"/>
user-scalable=no"> <meta content="black-translucent" name="apple-mobile-web-app-status-bar-style"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style"
content="black-translucent">
<!-- reveal.js base stylesheel. Don't remove nor edit this. --> <!-- reveal.js base stylesheel. Don't remove nor edit this. -->
<link rel="stylesheet" href="reveal.js/css/reveal.css"> <link href="./reveal.js/css/reveal.css" rel="stylesheet"/>
<!-- POuL theme for reveal.js --> <!-- POuL theme for reveal.js -->
<link rel="stylesheet" href="poul/css/poul.css" id="theme"> <link href="./poul/css/poul.css" id="theme" rel="stylesheet"/>
<!-- Code syntax highlighting --> <!-- Code syntax highlighting -->
<link rel="stylesheet" href="reveal.js/lib/css_highlight/hopscotch.css"> <link href="./reveal.js/lib/css_highlight/hopscotch.css" rel="stylesheet"/>
<!-- Printing and PDF exports --> <!-- Printing and PDF exports -->
<script> <script>
var link = document.createElement('link'); let link = document.createElement('link');
link.rel = 'stylesheet'; link.rel = 'stylesheet';
link.type = 'text/css';
link.href = window.location.search.match(/print-pdf/gi) link.href = window.location.search.match(/print-pdf/gi)
? 'reveal.js/css/print/pdf.css' : 'reveal.js/css/print/paper.css'; ? './poul/css/print/pdf.css' : './poul/css/print/paper.css';
document.getElementsByTagName('head')[0].appendChild(link); document.getElementsByTagName('head')[0].appendChild(link);
</script> </script>
</head>
<body>
<div class="reveal">
<div class="slides">
<section class="intro">
<h1>Corsi Punto Croce 2018</h1>
<h2>Come fare gli orli</h2>
<img src="poul/img/logo-text-white.svg"/>
<p>Autore &lt;email@email.com&gt;</p>
</section>
<section data-markdown="content.md"
data-charset="utf-8"
data-separator="^\r?\n---\r?\n$"
data-separator-vertical="^\r?\n----\r?\n$"
data-separator-notes="^Notes:">
</section>
<section class="outro">
<h1>Thank you!</h1>
<img class="logo" src="poul/img/logo-notext-white.svg"/>
<p>Rilasciato sotto licenza Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International</p>
<img class="cc" src="poul/img/creativecommons-by-nc-sa.svg"/> <script src="./reveal.js/lib/js/head.min.js"></script>
<script src="./reveal.js/js/reveal.js"></script>
<p>Autore &lt;email@email.com&gt;</p>
</section>
</div>
</div>
<script src="reveal.js/lib/js/head.min.js"></script>
<script src="reveal.js/js/reveal.js"></script>
<!-- Init Reveal.js -->
<script> <script>
document.addEventListener("DOMContentLoaded", () => {
Reveal.initialize({ Reveal.initialize({
controls: false, controls: false,
slideNumber: true, slideNumber: true,
history: true, history: true,
transition: 'none', transition: 'none',
pdfMaxPagesPerSlide: 1, pdfMaxPagesPerSlide: 1,
pdfSeparateFragments: false,
display: 'flex',
markdown: { markdown: {
smartypants: true, smartypants: true,
}, },
...@@ -83,37 +49,54 @@ ...@@ -83,37 +49,54 @@
40: 'next' // Down arrow 40: 'next' // Down arrow
}, },
math: { math: {
mathjax: 'reveal.js/lib/js/mathjax/MathJax.js', mathjax: './reveal.js/lib/js/mathjax/MathJax.js',
config: 'TeX-AMS_HTML-full' // See http://docs.mathjax.org/en/latest/config-files.html config: 'TeX-AMS_HTML-full' // See http://docs.mathjax.org/en/latest/config-files.html
}, },
dependencies: [ dependencies: [
{ {
src: 'reveal.js/plugin/markdown/marked.js', src: './reveal.js/plugin/markdown/marked.js',
condition: function(){ return !!document.querySelector('[data-markdown]'); } condition: function () {
return !!document.querySelector('[data-markdown]');
}
}, },
{ {
src: 'reveal.js/plugin/markdown/markdown.js', src: './reveal.js/plugin/markdown/markdown.js',
condition: function() { return !!document.querySelector('[data-markdown]'); } condition: function () {
return !!document.querySelector('[data-markdown]');
}
}, },
{ {
src: 'reveal.js/plugin/highlight/highlight.js', src: './reveal.js/plugin/highlight/highlight.js',
async: true, async: true,
callback: function() { hljs.initHighlightingOnLoad(); } callback: function () {
hljs.initHighlightingOnLoad();
}
}, },
{ {
src: 'reveal.js/plugin/notes/notes.js', src: './reveal.js/plugin/notes/notes.js',
async: true async: true
}, },
{ {
src: 'reveal.js/plugin/math/math.js', src: './reveal.js/plugin/math/math.js',
async: true async: true
} }
] ]
}); });
});
</script> </script>
</body> </head>
<div class="reveal">
<div class="slides">
<section data-markdown="./slides/intro.html"></section>
<section data-charset="utf-8"
data-markdown="./slides/content.md"
data-separator="^\r?\n---\r?\n$"
data-separator-notes="^Notes:"
data-separator-vertical="^\r?\n----\r?\n$">
</section>
<section data-markdown="./slides/outro.html"></section>
</div>
</div>
<!-- <a class="printable-version" href="?print-pdf"></a>
vim: tabstop=2 shiftwidth=2 expandtab: \ No newline at end of file
-->
poul/css/poul.css
View file @ 2318165f
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
* Forked from the default black theme. * Forked from the default black theme.
*/ */
@import url(../../reveal.js/lib/font/source-sans-pro/source-sans-pro.css); @import url(../../reveal.js/lib/font/source-sans-pro/source-sans-pro.css);
section.has-light-background, section.has-light-background,
section.has-light-background h1, section.has-light-background h1,
section.has-light-background h2, section.has-light-background h2,
...@@ -11,30 +12,52 @@ section.has-light-background h3, ...@@ -11,30 +12,52 @@ section.has-light-background h3,
section.has-light-background h4, section.has-light-background h4,
section.has-light-background h5, section.has-light-background h5,
section.has-light-background h6 { section.has-light-background h6 {
color: #222; } color: #222;
}
/********************************************* /*********************************************
* GLOBAL STYLES * GLOBAL STYLES
*********************************************/ *********************************************/
body { body {
background: #191919; background: #191919;
background-color: #191919; } background-color: #191919;
}
.reveal { .reveal {
font-family: "Source Sans Pro", Helvetica, sans-serif; font-family: "Source Sans Pro", Helvetica, sans-serif;
font-size: 38px; font-size: 38px;
font-weight: normal; font-weight: normal;
color: #fff; } color: #fff;
}
::selection { ::selection {
color: #fff; color: #fff;
background: #fc4a2c; background: #fc4a2c;
text-shadow: none; } text-shadow: none;
}
.slides > section {
height: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.slides section > section {
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.reveal .slides > section, .reveal .slides > section,
.reveal .slides > section > section { .reveal .slides > section > section {
line-height: 1.3; line-height: 1.3;
font-weight: inherit; } font-weight: inherit;
}
/********************************************* /*********************************************
* HEADERS * HEADERS
...@@ -52,80 +75,108 @@ body { ...@@ -52,80 +75,108 @@ body {
line-height: 1.2; line-height: 1.2;
letter-spacing: normal; letter-spacing: normal;
text-shadow: none; text-shadow: none;
word-wrap: break-word; } word-wrap: break-word;
}
.reveal h1 { .reveal h1 {
font-size: 2.5em; } font-size: 2.5em;
}
.reveal h2 { .reveal h2 {
font-size: 1.6em; } font-size: 1.6em;
}
.reveal h3 { .reveal h3 {
font-size: 1.3em; } font-size: 1.3em;
}
.reveal h4 { .reveal h4 {
font-size: 1em; } font-size: 1em;
}
.reveal h1 { .reveal h1 {
text-shadow: none; } text-shadow: none;
}
.reveal x-section-title {
position: absolute;
top: 0;
right: 20px;
color: #ffc600;
font-weight: bold;
text-align: right;
}
/********************************************* /*********************************************
* OTHER * OTHER
*********************************************/ *********************************************/
.reveal p { .reveal p {
margin: 20px 0; margin: 20px 0;
line-height: 1.3; } line-height: 1.3;
}
/* Ensure certain elements are never larger than the slide itself */ /* Ensure certain elements are never larger than the slide itself */
.reveal img, .reveal img,
.reveal video, .reveal video,
.reveal iframe { .reveal iframe {
max-width: 95%; max-width: 95%;
max-height: 95%; } max-height: 95%;
}
.reveal strong, .reveal strong,
.reveal b { .reveal b {
font-weight: bold; font-weight: bold;
color: #ffc600; } color: #ffc600;
}
.reveal em { .reveal em {
font-style: italic; } font-style: italic;
}
.reveal ol, .reveal ol,
.reveal dl, .reveal dl,
.reveal ul { .reveal ul {
display: inline-block; display: inline-block;
text-align: left; text-align: left;
margin: 0 0 0 1em; } margin: 0 0 0 1em;
}
.reveal ol { .reveal ol {
list-style-type: decimal; } list-style-type: decimal;
}
.reveal ul { .reveal ul {
list-style-type: disc; } list-style-type: disc;
}
.reveal ul ul { .reveal ul ul {
list-style-type: square; } list-style-type: square;
}
.reveal ul ul ul { .reveal ul ul ul {
list-style-type: circle; } list-style-type: circle;
}
.reveal ul ul, .reveal ul ul,
.reveal ul ol, .reveal ul ol,
.reveal ol ol, .reveal ol ol,
.reveal ol ul { .reveal ol ul {
display: block; display: block;
margin-left: 40px; } margin-left: 40px;
}
.reveal dt { .reveal dt {
font-weight: bold; } font-weight: bold;
}
.reveal dd { .reveal dd {
margin-left: 40px; } margin-left: 40px;
}
.reveal q, .reveal q,
.reveal blockquote { .reveal blockquote {
quotes: none; } quotes: none;
}
.reveal blockquote { .reveal blockquote {
display: block; display: block;
...@@ -135,14 +186,17 @@ body { ...@@ -135,14 +186,17 @@ body {
padding: 5px; padding: 5px;
font-style: italic; font-style: italic;
background: rgba(255, 255, 255, 0.05); background: rgba(255, 255, 255, 0.05);
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); } box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
}
.reveal blockquote p:first-child, .reveal blockquote p:first-child,
.reveal blockquote p:last-child { .reveal blockquote p:last-child {
display: inline-block; } display: inline-block;
}
.reveal q { .reveal q {
font-style: italic; } font-style: italic;
}
.reveal pre { .reveal pre {
display: block; display: block;
...@@ -155,57 +209,70 @@ body { ...@@ -155,57 +209,70 @@ body {
font-family: monospace; font-family: monospace;
line-height: 1.2em; line-height: 1.2em;
word-wrap: break-word; word-wrap: break-word;
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); } box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3);
}
.reveal code { .reveal code {
font-family: monospace; } font-family: monospace;
}
.reveal pre code { .reveal pre code {
display: block; display: block;
padding: 5px; padding: 5px;
overflow: auto; overflow: auto;
max-height: 400px; max-height: 400px;
word-wrap: normal; } word-wrap: normal;
}
.reveal table { .reveal table {
margin: auto; margin: auto;
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; } border-spacing: 0;
}
.reveal table th { .reveal table th {
font-weight: bold; } font-weight: bold;
}
.reveal table th, .reveal table th,
.reveal table td { .reveal table td {
text-align: left; text-align: left;
padding: 0.2em 0.5em 0.2em 0.5em; padding: 0.2em 0.5em 0.2em 0.5em;
border-bottom: 1px solid; } border-bottom: 1px solid;
}
.reveal table th[align="center"], .reveal table th[align="center"],
.reveal table td[align="center"] { .reveal table td[align="center"] {
text-align: center; } text-align: center;
}
.reveal table th[align="right"], .reveal table th[align="right"],
.reveal table td[align="right"] { .reveal table td[align="right"] {
text-align: right; } text-align: right;
}
.reveal table tr:last-child td { .reveal table tr:last-child td {
border-bottom: none; } border-bottom: none;
}
.reveal sup { .reveal sup {
vertical-align: super; } vertical-align: super;
}
.reveal sub { .reveal sub {
vertical-align: sub; } vertical-align: sub;
}
.reveal small { .reveal small {
display: inline-block; display: inline-block;
font-size: 0.6em; font-size: 0.6em;