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
......@@ -37,7 +37,8 @@ In case you need the mathjax submodule as well
1. Clone this repo
1. Change origin to your repo
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?
......@@ -50,18 +51,15 @@ four dashes (`----`) to create a new one vertically.
Use `Notes:` to add reader notes to your slide.
Alternatively you can write your slides with pure **html**
### How do I see my stuff?
- You can display `index.html` with your browser
or
- You can run `deploy.py` with Python 3 and open the provided link in your browser.
- 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?
Append `?print-pdf` at the end of the URL.
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`.
Click on the printer symbol in the bottom-left corner to get the printable version of the slides.
Then just use the print function of your browser to make a PDF of the page.
......
<!doctype html>
<html lang="it">
<head>
<meta charset="utf-8">
<meta name="description" content="">
<meta name="author" content="">
<meta charset="utf-8"/>
<meta content="" name="description"/>
<meta content="" name="author"/>
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0,
user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style"
content="black-translucent">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
<meta content="yes" name="apple-mobile-web-app-capable"/>
<meta content="black-translucent" name="apple-mobile-web-app-status-bar-style"/>
<!-- 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 -->
<link rel="stylesheet" href="poul/css/poul.css" id="theme">
<link href="./poul/css/poul.css" id="theme" rel="stylesheet"/>
<!-- 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 -->
<script>
var link = document.createElement('link');
let link = document.createElement('link');
link.rel = 'stylesheet';
link.type = 'text/css';
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);
</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"/>
<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>
<script src="./reveal.js/lib/js/head.min.js"></script>
<script src="./reveal.js/js/reveal.js"></script>
<!-- Init Reveal.js -->
<script>
document.addEventListener("DOMContentLoaded", () => {
Reveal.initialize({
controls: false,
slideNumber: true,
history: true,
transition: 'none',
pdfMaxPagesPerSlide: 1,
pdfSeparateFragments: false,
display: 'flex',
markdown: {
smartypants: true,
},
......@@ -83,37 +49,54 @@
40: 'next' // Down arrow
},
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
},
dependencies: [
{
src: 'reveal.js/plugin/markdown/marked.js',
condition: function(){ return !!document.querySelector('[data-markdown]'); }
src: './reveal.js/plugin/markdown/marked.js',
condition: function () {
return !!document.querySelector('[data-markdown]');
}
},
{
src: 'reveal.js/plugin/markdown/markdown.js',
condition: function() { return !!document.querySelector('[data-markdown]'); }
src: './reveal.js/plugin/markdown/markdown.js',
condition: function () {
return !!document.querySelector('[data-markdown]');
}
},
{
src: 'reveal.js/plugin/highlight/highlight.js',
src: './reveal.js/plugin/highlight/highlight.js',
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
},
{
src: 'reveal.js/plugin/math/math.js',
src: './reveal.js/plugin/math/math.js',
async: true
}
]
});
});
</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>
<!--
vim: tabstop=2 shiftwidth=2 expandtab:
-->
<a class="printable-version" href="?print-pdf"></a>
\ No newline at end of file
......@@ -4,6 +4,7 @@
* Forked from the default black theme.
*/
@import url(../../reveal.js/lib/font/source-sans-pro/source-sans-pro.css);
section.has-light-background,
section.has-light-background h1,
section.has-light-background h2,
......@@ -11,30 +12,52 @@ section.has-light-background h3,
section.has-light-background h4,
section.has-light-background h5,
section.has-light-background h6 {
color: #222; }
color: #222;
}
/*********************************************
* GLOBAL STYLES
*********************************************/
body {
background: #191919;
background-color: #191919; }
background-color: #191919;
}
.reveal {
font-family: "Source Sans Pro", Helvetica, sans-serif;
font-size: 38px;
font-weight: normal;
color: #fff; }
color: #fff;
}
::selection {
color: #fff;
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 > section {
line-height: 1.3;
font-weight: inherit; }
font-weight: inherit;
}
/*********************************************
* HEADERS
......@@ -52,80 +75,108 @@ body {
line-height: 1.2;
letter-spacing: normal;
text-shadow: none;
word-wrap: break-word; }
word-wrap: break-word;
}
.reveal h1 {
font-size: 2.5em; }
font-size: 2.5em;
}
.reveal h2 {
font-size: 1.6em; }
font-size: 1.6em;
}
.reveal h3 {
font-size: 1.3em; }
font-size: 1.3em;
}
.reveal h4 {
font-size: 1em; }
font-size: 1em;
}
.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
*********************************************/
.reveal p {
margin: 20px 0;
line-height: 1.3; }
line-height: 1.3;
}
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
.reveal iframe {
max-width: 95%;
max-height: 95%; }
max-height: 95%;
}
.reveal strong,
.reveal b {
font-weight: bold;
color: #ffc600; }
color: #ffc600;
}
.reveal em {
font-style: italic; }
font-style: italic;
}
.reveal ol,
.reveal dl,
.reveal ul {
display: inline-block;
text-align: left;
margin: 0 0 0 1em; }
margin: 0 0 0 1em;
}
.reveal ol {
list-style-type: decimal; }
list-style-type: decimal;
}
.reveal ul {
list-style-type: disc; }
list-style-type: disc;
}
.reveal ul ul {
list-style-type: square; }
list-style-type: square;
}
.reveal ul ul ul {
list-style-type: circle; }
list-style-type: circle;
}
.reveal ul ul,
.reveal ul ol,
.reveal ol ol,
.reveal ol ul {
display: block;
margin-left: 40px; }
margin-left: 40px;
}
.reveal dt {
font-weight: bold; }
font-weight: bold;
}
.reveal dd {
margin-left: 40px; }
margin-left: 40px;
}
.reveal q,
.reveal blockquote {
quotes: none; }
quotes: none;
}
.reveal blockquote {
display: block;
......@@ -135,14 +186,17 @@ body {
padding: 5px;
font-style: italic;
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:last-child {
display: inline-block; }
display: inline-block;
}
.reveal q {
font-style: italic; }
font-style: italic;
}
.reveal pre {
display: block;
......@@ -155,57 +209,70 @@ body {
font-family: monospace;
line-height: 1.2em;
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 {
font-family: monospace; }
font-family: monospace;
}
.reveal pre code {
display: block;
padding: 5px;
overflow: auto;
max-height: 400px;
word-wrap: normal; }
word-wrap: normal;
}
.reveal table {
margin: auto;
border-collapse: collapse;
border-spacing: 0; }
border-spacing: 0;
}
.reveal table th {
font-weight: bold; }
font-weight: bold;
}
.reveal table th,
.reveal table td {
text-align: left;
padding: 0.2em 0.5em 0.2em 0.5em;
border-bottom: 1px solid; }
border-bottom: 1px solid;
}
.reveal table th[align="center"],
.reveal table td[align="center"] {
text-align: center; }
text-align: center;
}
.reveal table th[align="right"],
.reveal table td[align="right"] {
text-align: right; }
text-align: right;
}
.reveal table tr:last-child td {
border-bottom: none; }
border-bottom: none;
}
.reveal sup {
vertical-align: super; }
vertical-align: super;
}
.reveal sub {
vertical-align: sub; }
vertical-align: sub;
}
.reveal small {
display: inline-block;
font-size: 0.6em;
line-height: 1.2em;
vertical-align: top; }
vertical-align: top;
}
.reveal small * {
vertical-align: top; }
vertical-align: top;
}
/*********************************************
* LINKS
......@@ -215,16 +282,19 @@ body {
text-decoration: none;
-webkit-transition: color 0.15s ease;
-moz-transition: color 0.15s ease;
transition: color 0.15s ease; }
transition: color 0.15s ease;
}
.reveal a:hover {
color: #aa8833;
text-shadow: none;
border: none; }
border: none;
}
.reveal .roll span:after {
color: #fff;
background: #068de9; }
background: #068de9;
}
/*********************************************
* IMAGES
......@@ -237,73 +307,119 @@ body {
.reveal section img.plain {
border: 0;
box-shadow: none; }
box-shadow: none;
}
.reveal a img {
-webkit-transition: all 0.15s linear;
-moz-transition: all 0.15s linear;
transition: all 0.15s linear; }
transition: all 0.15s linear;
}
.reveal a:hover img {
background: rgba(255, 255, 255, 0.2);
border-color: #fc4a2c;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
}
/*********************************************
* NAVIGATION CONTROLS
*********************************************/
.reveal .controls .navigate-left,
.reveal .controls .navigate-left.enabled {
border-right-color: #ffc600; }
border-right-color: #ffc600;
}
.reveal .controls .navigate-right,
.reveal .controls .navigate-right.enabled {
border-left-color: #ffc600; }
border-left-color: #ffc600;
}
.reveal .controls .navigate-up,
.reveal .controls .navigate-up.enabled {
border-bottom-color: #ffc600; }
border-bottom-color: #ffc600;
}
.reveal .controls .navigate-down,
.reveal .controls .navigate-down.enabled {
border-top-color: #ffc600; }
border-top-color: #ffc600;
}
.reveal .controls .navigate-left.enabled:hover {
border-right-color: #aa8833; }
border-right-color: #aa8833;
}
.reveal .controls .navigate-right.enabled:hover {
border-left-color: #aa8833; }
border-left-color: #aa8833;
}
.reveal .controls .navigate-up.enabled:hover {
border-bottom-color: #aa8833; }
border-bottom-color: #aa8833;
}
.reveal .controls .navigate-down.enabled:hover {
border-top-color: #aa8833; }
border-top-color: #aa8833;
}
/*********************************************
* PROGRESS BAR
*********************************************/
.reveal .progress {
background: rgba(0, 0, 0, 0.2); }
background: rgba(0, 0, 0, 0.2);
}
.reveal .progress span {
background: #ffc600;
-webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
-moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
}
.reveal section.outro h1 {
.reveal .outro h1 {
padding: 0;
margin: 0;
}
.reveal section.outro img.logo {
.reveal .outro .logo {
max-height: 20vh;
padding: 0;
}
.reveal section.outro img.cc {
.reveal .outro .cc {
max-height: 5vh;
padding: 0;
}
/*********************************************
* CODE
*********************************************/
code.input::before, pre.input > code::before {
content: "$";
color: #8699A4;
padding-right: 5px;
}
code.input.root::before, pre.input.root > code::before {
content: "#";
}
/*********************************************
* OTHER
*********************************************/
.printable-version {