Compare commits
181 Commits
f7095ebd40
...
ec3d6f3e38
| Author | SHA1 | Date | |
|---|---|---|---|
| ec3d6f3e38 | |||
| e800dbfcd6 | |||
| 42d12f31a9 | |||
| 02d87d50f7 | |||
| af4b094d37 | |||
| 31299a884f | |||
| f985499bb4 | |||
| c742918f18 | |||
| afc9fe5d70 | |||
| 22337e6ba2 | |||
| e8334554c8 | |||
| a9ced14ed1 | |||
| 46c0e1bc1a | |||
| c263abf74d | |||
| 9b489e7fad | |||
| 4fab6f5db1 | |||
| 5943830a1f | |||
| b89ea953e0 | |||
| 655c7e3aa5 | |||
| deba2b91a6 | |||
| 7de3c6fa53 | |||
| 7e6d7c4faa | |||
| 5766470050 | |||
| 9104378ba1 | |||
|
|
f05c4c54ce | ||
|
|
84c7889853 | ||
| 38cd74a81c | |||
| 3bb614a6b3 | |||
| ba7329c804 | |||
| da13365fc0 | |||
| 6bc8179766 | |||
| f7a79ba36d | |||
| a674eb2fe3 | |||
| 879185015b | |||
| f3d249a967 | |||
| 2f9fb32678 | |||
| 4c67398034 | |||
| 9cd5ed656b | |||
| 27d565be52 | |||
| 1b1e761c62 | |||
| 6524c3717c | |||
| 9872b04b4d | |||
| 427637cab6 | |||
| c0bc3e79ff | |||
| 20af20df04 | |||
| 68e618981b | |||
| c7105014c0 | |||
| a0bfe80c53 | |||
| 177c95dd7f | |||
| 6d69d5cf93 | |||
| bdfb0de1dd | |||
| 9fc28b9b01 | |||
| ab3967a332 | |||
| 73305bcafa | |||
| 8742dd4d75 | |||
| c464ea36e7 | |||
| 383d916c47 | |||
| d68b809b11 | |||
| 55180079b3 | |||
| 71d5607f57 | |||
| 2008edad41 | |||
| ee582a4be3 | |||
| 7faa6e8038 | |||
| 5a6e193461 | |||
| 3d1f4d5e83 | |||
| 63dbc1d954 | |||
| d936b83f36 | |||
| b89bb05ce9 | |||
| c5926e8fcc | |||
| 713945d2a0 | |||
| 91e69d903b | |||
| 41724f6e6b | |||
| 0396591ec8 | |||
| f143ec30b6 | |||
| 8c8920c432 | |||
| bd4d7ec6fc | |||
| 3db9543c38 | |||
| 436c0d9ebb | |||
| c9884d8221 | |||
| 8ea61fbc88 | |||
| 81b01a7f7e | |||
| a93b564ec9 | |||
| 644e1a4d25 | |||
| ecfdd37aa8 | |||
| e1f8f2c1b2 | |||
| dea2d8b9e5 | |||
| cbc0898b98 | |||
| e136d8110e | |||
| d3ec641628 | |||
| c809bca6b6 | |||
| 2896e58274 | |||
| 80f07d2d8c | |||
| 5835f76719 | |||
| 6831a6ad66 | |||
| 8e98530a57 | |||
| beb9ead403 | |||
| 35ed647159 | |||
| 627097ecdb | |||
| 293834ff79 | |||
| 8f529bf6db | |||
| a8899d0a33 | |||
| d4f6b949ca | |||
| 75d44bfb49 | |||
| 871a424228 | |||
| 7acb8be445 | |||
| 0aa0e014d6 | |||
| e964003387 | |||
| 0bd39def2f | |||
| cde170e179 | |||
| b6c3567201 | |||
| 4ad8414731 | |||
| 1ffc75c15b | |||
| d807e86ee7 | |||
| 31192879b5 | |||
| 03f84b414f | |||
| b616f51c4c | |||
| 9c0ba0e208 | |||
| 783fe3df08 | |||
| 15af8630f4 | |||
| c4a9673c4e | |||
| 5e941b5bba | |||
| d317cf8578 | |||
| d9e056c22f | |||
| bdf9d358f0 | |||
| aaada54097 | |||
| f4e1135d04 | |||
| fcb382a7b5 | |||
| c897ad348f | |||
| 016862e7c1 | |||
| 2901506bd8 | |||
| 4b1ae2ee69 | |||
| ef38d75727 | |||
| 24bf51a60f | |||
| 2e40061171 | |||
| b7d1861d8e | |||
| 13d169982c | |||
| 22b06869b7 | |||
| 496565e8ba | |||
| b6bbc29d64 | |||
| 67776b0157 | |||
| c4bde80ea3 | |||
| f5b9fbe813 | |||
| 763d40b70a | |||
| 6afaf45f91 | |||
| 33c637689a | |||
| 38bc3ae48e | |||
| 926f9f343a | |||
| fce0398772 | |||
| 04f97183ca | |||
| d98a93a50d | |||
| af5ed3ddc0 | |||
| 19b3d55dbf | |||
| 549579c379 | |||
| 9be473d4ce | |||
| cb86dedac2 | |||
| ead875f395 | |||
| e128f45052 | |||
| 4d5aacd498 | |||
| af71ca8206 | |||
| eeafdd3aea | |||
| 651b5a0ac9 | |||
| 0d3e73c299 | |||
| 030f7e6a3d | |||
| b1ead01e14 | |||
| 72c11c57f6 | |||
| 63023d7012 | |||
| 9c0dd012b8 | |||
| 2ee0729378 | |||
| cc78fb6b07 | |||
| 50da4b2e67 | |||
| a93a8566f9 | |||
| bdb05d9ecc | |||
| 74d02d1855 | |||
| 412d1a2360 | |||
| e182f47a6d | |||
| 682c9b1b0a | |||
| 160133cb12 | |||
| 2df810da24 | |||
| 19c4335040 | |||
| 603011d11a | |||
| 1b1294efce |
13
.gitignore
vendored
13
.gitignore
vendored
@ -4,6 +4,10 @@
|
||||
*.toc
|
||||
*.fdb_latexmk
|
||||
*.fls
|
||||
*.synctex.gz
|
||||
|
||||
# LaTeX results
|
||||
svg/**/*.pdf
|
||||
|
||||
# From Reveal.js
|
||||
.idea/
|
||||
@ -112,3 +116,12 @@ typings/
|
||||
*/_minted*
|
||||
*.pygtex
|
||||
*.pygstyle
|
||||
|
||||
# onPoint
|
||||
slides.*.html
|
||||
**/.onpoint/
|
||||
|
||||
*.swp
|
||||
|
||||
# VS Code
|
||||
**/.vscode
|
||||
7
.gitmodules
vendored
Normal file
7
.gitmodules
vendored
Normal file
@ -0,0 +1,7 @@
|
||||
[submodule "onpoint"]
|
||||
path = onpoint
|
||||
url = git@git.stuve-bamberg.de:ckremitzl/onpoint.git
|
||||
branch = release
|
||||
[submodule "lib/mathjax"]
|
||||
path = lib/mathjax
|
||||
url = https://github.com/mathjax/MathJax.git
|
||||
@ -1,5 +0,0 @@
|
||||
language: node_js
|
||||
node_js:
|
||||
- 4
|
||||
after_script:
|
||||
- npm run build -- retire
|
||||
19
Dockerfile
19
Dockerfile
@ -1,19 +0,0 @@
|
||||
FROM alpine:3.9
|
||||
RUN apk add --update --no-cache npm texlive poppler cairo bash texmf-dist-full ghostscript
|
||||
RUN apk add --update --no-cache --virtual .build-deps poppler-dev cairo-dev wget build-base pkgconf
|
||||
|
||||
ADD . /latex
|
||||
WORKDIR /latex
|
||||
RUN npm install && \
|
||||
cd /tmp && \
|
||||
wget https://github.com/dawbarton/pdf2svg/archive/v0.2.3.tar.gz && \
|
||||
tar -xzf v0.2.3.tar.gz && \
|
||||
cd pdf2svg-0.2.3/ && \
|
||||
./configure && make && make install && \
|
||||
cd / && \
|
||||
rm -rf /tmp/pdf2svg-0.2.3/ && \
|
||||
echo "cd /latex" > /start.sh && \
|
||||
echo "bash tex2svg.sh" > /start.sh && \
|
||||
echo "npm start" >> /start.sh
|
||||
|
||||
CMD ["bash", "/start.sh"]
|
||||
228
Gruntfile.js
228
Gruntfile.js
@ -1,228 +0,0 @@
|
||||
/* global module:false */
|
||||
module.exports = function(grunt) {
|
||||
var port = grunt.option('port') || 8000;
|
||||
var root = grunt.option('root') || '.';
|
||||
|
||||
if (!Array.isArray(root)) root = [root];
|
||||
|
||||
// Project configuration
|
||||
grunt.initConfig({
|
||||
pkg: grunt.file.readJSON('package.json'),
|
||||
meta: {
|
||||
banner:
|
||||
'/*!\n' +
|
||||
' * reveal.js <%= pkg.version %> (<%= grunt.template.today("yyyy-mm-dd, HH:MM") %>)\n' +
|
||||
' * http://revealjs.com\n' +
|
||||
' * MIT licensed\n' +
|
||||
' *\n' +
|
||||
' * Copyright (C) 2018 Hakim El Hattab, http://hakim.se\n' +
|
||||
' */'
|
||||
},
|
||||
|
||||
qunit: {
|
||||
files: [ 'test/*.html' ]
|
||||
},
|
||||
|
||||
uglify: {
|
||||
options: {
|
||||
banner: '<%= meta.banner %>\n',
|
||||
ie8: true
|
||||
},
|
||||
build: {
|
||||
src: 'js/reveal.js',
|
||||
dest: 'js/reveal.min.js'
|
||||
}
|
||||
},
|
||||
|
||||
sass: {
|
||||
core: {
|
||||
src: 'css/reveal.scss',
|
||||
dest: 'css/reveal.css'
|
||||
},
|
||||
themes: {
|
||||
expand: true,
|
||||
cwd: 'css/theme/source',
|
||||
src: ['*.sass', '*.scss'],
|
||||
dest: 'css/theme',
|
||||
ext: '.css'
|
||||
}
|
||||
},
|
||||
|
||||
autoprefixer: {
|
||||
core: {
|
||||
src: 'css/reveal.css'
|
||||
}
|
||||
},
|
||||
|
||||
cssmin: {
|
||||
options: {
|
||||
compatibility: 'ie9'
|
||||
},
|
||||
compress: {
|
||||
src: 'css/reveal.css',
|
||||
dest: 'css/reveal.min.css'
|
||||
}
|
||||
},
|
||||
|
||||
jshint: {
|
||||
options: {
|
||||
curly: false,
|
||||
eqeqeq: true,
|
||||
immed: true,
|
||||
esnext: true,
|
||||
latedef: 'nofunc',
|
||||
newcap: true,
|
||||
noarg: true,
|
||||
sub: true,
|
||||
undef: true,
|
||||
eqnull: true,
|
||||
browser: true,
|
||||
expr: true,
|
||||
loopfunc: true,
|
||||
globals: {
|
||||
head: false,
|
||||
module: false,
|
||||
console: false,
|
||||
unescape: false,
|
||||
define: false,
|
||||
exports: false
|
||||
}
|
||||
},
|
||||
files: [ 'Gruntfile.js', 'js/reveal.js' ]
|
||||
},
|
||||
|
||||
connect: {
|
||||
server: {
|
||||
options: {
|
||||
port: port,
|
||||
base: root,
|
||||
livereload: true,
|
||||
open: true,
|
||||
useAvailablePort: true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
zip: {
|
||||
bundle: {
|
||||
src: [
|
||||
'index.html',
|
||||
'css/**',
|
||||
'js/**',
|
||||
'lib/**',
|
||||
'images/**',
|
||||
'plugin/**',
|
||||
'**.md'
|
||||
],
|
||||
dest: 'reveal-js-presentation.zip'
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
js: {
|
||||
files: [ 'Gruntfile.js', 'js/reveal.js' ],
|
||||
tasks: 'js'
|
||||
},
|
||||
theme: {
|
||||
files: [
|
||||
'css/theme/source/*.sass',
|
||||
'css/theme/source/*.scss',
|
||||
'css/theme/template/*.sass',
|
||||
'css/theme/template/*.scss'
|
||||
],
|
||||
tasks: 'css-themes'
|
||||
},
|
||||
css: {
|
||||
files: [ 'css/reveal.scss' ],
|
||||
tasks: 'css-core'
|
||||
},
|
||||
html: {
|
||||
files: root.map(path => path + '/*.html')
|
||||
},
|
||||
markdown: {
|
||||
files: root.map(path => path + '/*.md')
|
||||
},
|
||||
options: {
|
||||
livereload: true
|
||||
},
|
||||
// Fachschaft WIAI: Convert TeX to SVG once a file changes
|
||||
tex: {
|
||||
files: [
|
||||
'sections/*/*/*.tex',
|
||||
'!sections/*/*/tmp-pdfcrop*'
|
||||
],
|
||||
tasks: 'tex2svg',
|
||||
options: { nospawn: true }
|
||||
}
|
||||
},
|
||||
|
||||
retire: {
|
||||
js: [ 'js/reveal.js', 'lib/js/*.js', 'plugin/**/*.js' ],
|
||||
node: [ '.' ]
|
||||
},
|
||||
|
||||
// Fachschaft WIAI: Necessary for tex2svg
|
||||
|
||||
texFilepath: '',
|
||||
|
||||
shell: {
|
||||
tex2svg: {
|
||||
command: './tex2svg-single.sh <%= texFilepath %>'
|
||||
},
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
// Dependencies
|
||||
grunt.loadNpmTasks( 'grunt-contrib-connect' );
|
||||
grunt.loadNpmTasks( 'grunt-contrib-cssmin' );
|
||||
grunt.loadNpmTasks( 'grunt-contrib-jshint' );
|
||||
grunt.loadNpmTasks( 'grunt-contrib-qunit' );
|
||||
grunt.loadNpmTasks( 'grunt-contrib-uglify' );
|
||||
grunt.loadNpmTasks( 'grunt-contrib-watch' );
|
||||
grunt.loadNpmTasks( 'grunt-autoprefixer' );
|
||||
grunt.loadNpmTasks( 'grunt-retire' );
|
||||
grunt.loadNpmTasks( 'grunt-sass' );
|
||||
grunt.loadNpmTasks( 'grunt-zip' );
|
||||
|
||||
// Fachschaft WIAI dependency:
|
||||
grunt.loadNpmTasks( 'grunt-shell' );
|
||||
|
||||
// Default task
|
||||
grunt.registerTask( 'default', [ 'css', 'js' ] );
|
||||
|
||||
// JS task
|
||||
grunt.registerTask( 'js', [ 'jshint', 'uglify', 'qunit' ] );
|
||||
|
||||
// Theme CSS
|
||||
grunt.registerTask( 'css-themes', [ 'sass:themes' ] );
|
||||
|
||||
// Core framework CSS
|
||||
grunt.registerTask( 'css-core', [ 'sass:core', 'autoprefixer', 'cssmin' ] );
|
||||
|
||||
// All CSS
|
||||
grunt.registerTask( 'css', [ 'sass', 'autoprefixer', 'cssmin' ] );
|
||||
|
||||
// Package presentation to archive
|
||||
grunt.registerTask( 'package', [ 'default', 'zip' ] );
|
||||
|
||||
// Serve presentation locally
|
||||
grunt.registerTask( 'serve', [ 'connect', 'watch' ] );
|
||||
|
||||
// Run tests
|
||||
grunt.registerTask( 'test', [ 'jshint', 'qunit' ] );
|
||||
|
||||
// Fachschaft WIAI Adaption
|
||||
// ========================
|
||||
|
||||
grunt.event.on('watch', function (action, filepath) {
|
||||
if (/.*\.tex$/.test(filepath)) {
|
||||
grunt.config.set('texFilepath', grunt.config.escape(filepath));
|
||||
}
|
||||
});
|
||||
|
||||
grunt.registerTask( 'tex2svg', 'Convert TeX to SVG', function(a) {
|
||||
grunt.task.run('shell:tex2svg');
|
||||
});
|
||||
|
||||
};
|
||||
27
README.md
27
README.md
@ -1,13 +1,26 @@
|
||||
# LaTeX-Wochenende
|
||||
|
||||
In diesem Repository befinden sich die Präsentation und die Materialien für das LaTeX-Wochenende der Fachschaft WIAI. Für die Präsentation wurde auf [Reveal.js](https://revealjs.com) zurückgegriffen, dieses Repository ist ein Fork von Reveal.js.
|
||||
In diesem Repository befinden sich die Präsentation und die Materialien für das LaTeX-Wochenende der Fachschaft WIAI.
|
||||
|
||||
### Verwendung der Präsentation
|
||||
## Verwendung der Präsentation
|
||||
|
||||
Die Präsentation benötigt eine aktuelle Version von [Node.js](https://nodejs.org/en/). Im Anschluss müssen untenstehende Befehle ausgeführt werden, um einen lokalen Server unter http://localhost:8000 zu starten.
|
||||
Zum Zeigen der Präsentation wird ein aktueller Browser benötigt. In diesem muss lediglich die Datei `slides.de.html` (bzw. `slides.en.html` für die englische Version) geöffnet werden.
|
||||
|
||||
## Anpassungen vornehmen
|
||||
|
||||
Um Inhalte der Präsentationen abzuändern oder zu ergänzen, muss zunächst das Repository geklont werden. Hierbei ist zu beachten, dass wir ein Submodul verwenden und deshalb eine zusätzliche Option beim Klonen notwendig ist:
|
||||
|
||||
```sh
|
||||
$ cd path/to/latex-wochenende/presentation
|
||||
$ npm install
|
||||
$ npm start
|
||||
```
|
||||
$ git clone -b 6-convert-to-onpoint --recurse-submodules https://git.stuve-bamberg.de/latex/latex-wochenende.git
|
||||
```
|
||||
|
||||
Zum Kompilieren der Präsentation werden python3 und pandoc (empfohlene Version: [2.5](https://github.com/jgm/pandoc/releases/tag/2.5)) verwendet. Als nächstes müssen alle benötigten Python-Pakete geladen werden.
|
||||
|
||||
```sh
|
||||
$ cd latex-wochenende/onpoint
|
||||
$ pip3 install -r requirements.txt
|
||||
```
|
||||
|
||||
Damit sind alle benötigten Komponenten installiert. Mittels `python3 main.py ..` können alle Sprachversionen kompiliert werden. Danach stehen sie wie oben beschrieben als HTML-Dateien zur Verfügung.
|
||||
|
||||
Die Präsentation baut auf dem von uns entwickelten [onPoint-Präsentationswerkzeug](https://git.stuve-bamberg.de/ckremitzl/onpoint/) auf. Einen Überblick über die Verzeichnisstruktur und eine Anleitung zum automatischen Kompilieren bei jeder Änderung (unter Linux) finden sich [im zugehörigen README](https://git.stuve-bamberg.de/ckremitzl/onpoint/src/branch/master/README.md#the-project-structure).
|
||||
|
||||
27
bower.json
27
bower.json
@ -1,27 +0,0 @@
|
||||
{
|
||||
"name": "reveal.js",
|
||||
"version": "3.7.0",
|
||||
"main": [
|
||||
"js/reveal.js",
|
||||
"css/reveal.css"
|
||||
],
|
||||
"homepage": "http://revealjs.com",
|
||||
"license": "MIT",
|
||||
"description": "The HTML Presentation Framework",
|
||||
"authors": [
|
||||
"Hakim El Hattab <hakim.elhattab@gmail.com>"
|
||||
],
|
||||
"dependencies": {
|
||||
"headjs": "~1.0.3"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/hakimel/reveal.js.git"
|
||||
},
|
||||
"ignore": [
|
||||
"**/.*",
|
||||
"node_modules",
|
||||
"bower_components",
|
||||
"test"
|
||||
]
|
||||
}
|
||||
@ -8,6 +8,9 @@ section {
|
||||
* {
|
||||
line-height: inherit; }
|
||||
|
||||
input {
|
||||
font-size: inherit; }
|
||||
|
||||
/* config */
|
||||
:root {
|
||||
--primary: #f8f281;
|
||||
@ -16,10 +19,17 @@ section {
|
||||
--secondary-dark: #3f5d75;
|
||||
--secondary-light: #eaf2f9;
|
||||
--margin: 0.1; }
|
||||
:root:lang(de) {
|
||||
--opening-double-quote: '»';
|
||||
--closing-double-quote: '«'; }
|
||||
:root:lang(en) {
|
||||
--opening-double-quote: '“';
|
||||
--closing-double-quote: '”'; }
|
||||
|
||||
/* basic layout */
|
||||
:root {
|
||||
--square: 100vw; }
|
||||
--square: 100vw;
|
||||
overflow: hidden; }
|
||||
@media (min-aspect-ratio: 1 / 1) {
|
||||
:root {
|
||||
--square: 50vw; } }
|
||||
@ -29,6 +39,8 @@ section {
|
||||
|
||||
body {
|
||||
font-size: calc(0.035 * var(--square)); }
|
||||
body article {
|
||||
position: relative; }
|
||||
body .layout-content-and-preview,
|
||||
body .layout-content-only,
|
||||
body .layout-preview-only,
|
||||
@ -103,12 +115,13 @@ body {
|
||||
right: calc(var(--margin) * var(--square));
|
||||
width: calc(.3 * var(--square));
|
||||
height: calc(.3 * var(--square));
|
||||
background-image: url(../../images/logo-fachschaft.png);
|
||||
background-image: url(../images/logo-fachschaft.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain; }
|
||||
body .layout-preview {
|
||||
grid-area: preview;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--secondary);
|
||||
@ -201,24 +214,20 @@ body {
|
||||
/* content layout */
|
||||
@font-face {
|
||||
font-family: 'Fira Sans';
|
||||
src: url("../../lib/font/fira-sans/FiraSans-Regular.ttf");
|
||||
src: url("../lib/font/fira-sans/FiraSans-Regular.ttf");
|
||||
font-weight: 400; }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Sans';
|
||||
src: url("../../lib/font/fira-sans/FiraSans-Bold.ttf");
|
||||
src: url("../lib/font/fira-sans/FiraSans-Bold.ttf");
|
||||
font-weight: 700; }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url("../../lib/font/fira-code/FiraCode-Regular.otf");
|
||||
src: url("../lib/font/fira-code/FiraCode-Regular.otf");
|
||||
font-weight: 400; }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url("../../lib/font/fira-code/FiraCode-Bold.otf");
|
||||
src: url("../lib/font/fira-code/FiraCode-Bold.otf");
|
||||
font-weight: 700; }
|
||||
|
||||
body {
|
||||
font-family: 'Fira Sans';
|
||||
margin: 0;
|
||||
@ -315,7 +324,6 @@ body {
|
||||
padding: calc(0.3 * var(--margin) * var(--square)) calc(var(--margin) * var(--square)); }
|
||||
.layout-two-columns .layout-title h2 {
|
||||
line-height: 1.15em; }
|
||||
|
||||
.layout-two-columns .layout-column-one,
|
||||
.layout-two-columns .layout-column-two {
|
||||
padding: calc(var(--margin) * var(--square));
|
||||
@ -410,11 +418,14 @@ h3[data-category]::before {
|
||||
padding-left: calc(var(--margin) * var(--square));
|
||||
margin-right: .5em; }
|
||||
|
||||
h2[data-category=Aufgabe]::before {
|
||||
h2[data-category=Aufgabe]::before,
|
||||
h2[data-category=Task]::before {
|
||||
content: attr(data-category) " " attr(data-task); }
|
||||
|
||||
.layout-content-only h2[data-category=Aufgabe]::after,
|
||||
.layout-wide-content h2[data-category=Aufgabe]::after {
|
||||
.layout-content-only h2[data-category=Task]::after,
|
||||
.layout-wide-content h2[data-category=Aufgabe]::after,
|
||||
.layout-wide-content h2[data-category=Task]::after {
|
||||
content: attr(data-task);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -431,16 +442,25 @@ h2[data-category=Aufgabe]::before {
|
||||
opacity: .2; }
|
||||
@media (min-aspect-ratio: 1 / 1) and (max-aspect-ratio: 2 / 1) {
|
||||
.layout-content-only h2[data-category=Aufgabe]::after,
|
||||
.layout-wide-content h2[data-category=Aufgabe]::after {
|
||||
.layout-content-only h2[data-category=Task]::after,
|
||||
.layout-wide-content h2[data-category=Aufgabe]::after,
|
||||
.layout-wide-content h2[data-category=Task]::after {
|
||||
--versatz: calc((100vh - var(--square)) / 2);
|
||||
top: var(--versatz);
|
||||
bottom: calc(-1 * var(--versatz)); } }
|
||||
|
||||
.layout-content-only h2.task-without-number::after,
|
||||
.layout-content-only h2.task-without-number::after,
|
||||
.layout-wide-content h2.task-without-number::after,
|
||||
.layout-wide-content h2.task-without-number::after {
|
||||
display: none; }
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
max-width: 100%; }
|
||||
|
||||
table {
|
||||
font-size: inherit;
|
||||
width: calc(var(--square) - var(--margin) * var(--square));
|
||||
margin-left: calc(-1 * var(--margin) * var(--square));
|
||||
border-spacing: 0; }
|
||||
@ -465,7 +485,7 @@ table {
|
||||
padding-left: .3rem;
|
||||
padding-right: .3rem; }
|
||||
|
||||
.box, blockquote {
|
||||
.box {
|
||||
margin-left: calc(-1 * var(--margin) * var(--square));
|
||||
padding: 0.8em 0.1em 0.1em calc(var(--margin) * var(--square)); }
|
||||
|
||||
@ -474,13 +494,28 @@ table {
|
||||
|
||||
blockquote {
|
||||
color: var(--secondary-dark);
|
||||
text-indent: -.55em;
|
||||
padding-bottom: .8em; }
|
||||
position: relative;
|
||||
padding-bottom: 1.8em;
|
||||
margin-left: 0;
|
||||
margin-right: 0; }
|
||||
blockquote p:first-of-type {
|
||||
/* probably bungle, but works for one <p> inside <blockquote> */
|
||||
display: contents; }
|
||||
blockquote p:first-of-type::after {
|
||||
content: " " var(--closing-double-quote); }
|
||||
blockquote::before {
|
||||
content: '»';
|
||||
color: var(--secondary-dark); }
|
||||
blockquote cite::before {
|
||||
content: ' – '; }
|
||||
content: var(--opening-double-quote) " ";
|
||||
color: var(--secondary-dark);
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
right: 100%; }
|
||||
blockquote cite {
|
||||
position: absolute;
|
||||
bottom: 0.6em;
|
||||
left: calc(0.4 * var(--square));
|
||||
width: calc(0.4 * var(--square)); }
|
||||
blockquote cite::before {
|
||||
content: "— "; }
|
||||
|
||||
.layout-content figure {
|
||||
margin: 0 1em 1em 0; }
|
||||
@ -535,8 +570,7 @@ kbd {
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Twemoji';
|
||||
src: url("../../lib/font/twemoji/TwitterColorEmoji-SVGinOT.ttf"); }
|
||||
|
||||
src: url("../lib/font/twemoji/TwitterColorEmoji-SVGinOT.ttf"); }
|
||||
.emoji {
|
||||
font-family: "Twemoji"; }
|
||||
|
||||
@ -560,7 +594,6 @@ p a:link, p a:hover, p a:active, p a:visited, li a:link, li a:hover, li a:active
|
||||
bottom: -5%;
|
||||
left: -1%;
|
||||
transition: .2s height ease; }
|
||||
|
||||
p a:hover::before, li a:hover::before, h2 a:hover::before, td a:hover::before, figcaption a:hover::before, div a:hover::before {
|
||||
height: 110%; }
|
||||
|
||||
@ -579,3 +612,82 @@ pre.small-text {
|
||||
pre.scroll-one-half {
|
||||
max-height: calc(.5 * var(--square));
|
||||
overflow: auto !important; }
|
||||
|
||||
/*
|
||||
* Fragments
|
||||
* =========
|
||||
*/
|
||||
.fragment {
|
||||
opacity: 0;
|
||||
transition: .3s opacity ease-in-out; }
|
||||
|
||||
.fragment.visible {
|
||||
opacity: 1; }
|
||||
|
||||
/*
|
||||
* Topic List
|
||||
* ==========
|
||||
*/
|
||||
.topic-list {
|
||||
box-shadow: 0 0px 50px rgba(0, 0, 0, 0.3);
|
||||
z-index: 500; }
|
||||
.topic-list .topic-list-search {
|
||||
display: block;
|
||||
width: 100%;
|
||||
border: none;
|
||||
padding: .5rem;
|
||||
margin-bottom: 1rem;
|
||||
border-bottom: 1px solid var(--secondary);
|
||||
text-align: center; }
|
||||
.topic-list .topic-link {
|
||||
font-weight: normal; }
|
||||
.topic-list .topic-link.active-topic-link {
|
||||
font-weight: bold; }
|
||||
.topic-list .topic-link.not-matching-search-terms {
|
||||
opacity: .2; }
|
||||
|
||||
/*
|
||||
* Help Menu
|
||||
* ==========
|
||||
*/
|
||||
#help-menu-wrapper {
|
||||
display: none;
|
||||
max-width: 90vw;
|
||||
width: 800px;
|
||||
height: 80vh;
|
||||
box-sizing: border-box;
|
||||
padding: 2rem;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
z-index: 500;
|
||||
background: white;
|
||||
box-shadow: 0 0px 50px rgba(0, 0, 0, 0.3);
|
||||
opacity: 0;
|
||||
transition: .2s opacity ease-in-out; }
|
||||
|
||||
#help-menu-checkbox:checked ~ #help-menu-wrapper {
|
||||
opacity: 1;
|
||||
display: block; }
|
||||
|
||||
#help-menu-checkbox {
|
||||
position: fixed;
|
||||
right: 150vw; }
|
||||
|
||||
#help-menu-toggle {
|
||||
position: fixed;
|
||||
right: 1rem;
|
||||
bottom: 1rem;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
transition: .1s background-color ease-in-out;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center; }
|
||||
#help-menu-toggle:hover {
|
||||
background-color: rgba(0, 0, 0, 0.5); }
|
||||
|
||||
/*# sourceMappingURL=latex.css.map */
|
||||
7
css/latex.css.map
Normal file
7
css/latex.css.map
Normal file
File diff suppressed because one or more lines are too long
@ -8,6 +8,10 @@ section {
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
input {
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
/* config */
|
||||
:root {
|
||||
--primary: #f8f281;
|
||||
@ -16,6 +20,14 @@ section {
|
||||
--secondary-dark: #3f5d75;
|
||||
--secondary-light: #eaf2f9;
|
||||
--margin: 0.1;
|
||||
&:lang(de) {
|
||||
--opening-double-quote: '»';
|
||||
--closing-double-quote: '«';
|
||||
}
|
||||
&:lang(en) {
|
||||
--opening-double-quote: '“';
|
||||
--closing-double-quote: '”';
|
||||
}
|
||||
}
|
||||
|
||||
/* basic layout */
|
||||
@ -27,11 +39,16 @@ section {
|
||||
@media (min-aspect-ratio: 2/1) {
|
||||
--square: 100vh;
|
||||
}
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: calc(0.035 * var(--square));
|
||||
|
||||
article {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.layout-content-and-preview,
|
||||
.layout-content-only,
|
||||
.layout-preview-only,
|
||||
@ -153,7 +170,7 @@ body {
|
||||
right: calc(var(--margin) * var(--square));
|
||||
width: calc(.3 * var(--square));
|
||||
height: calc(.3 * var(--square));
|
||||
background-image: url(../../images/logo-fachschaft.png);
|
||||
background-image: url(../images/logo-fachschaft.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
}
|
||||
@ -163,6 +180,7 @@ body {
|
||||
.layout-preview {
|
||||
grid-area: preview;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--secondary);
|
||||
@ -292,22 +310,22 @@ body {
|
||||
|
||||
@font-face {
|
||||
font-family: 'Fira Sans';
|
||||
src: url('../../lib/font/fira-sans/FiraSans-Regular.ttf');
|
||||
src: url('../lib/font/fira-sans/FiraSans-Regular.ttf');
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Fira Sans';
|
||||
src: url('../../lib/font/fira-sans/FiraSans-Bold.ttf');
|
||||
src: url('../lib/font/fira-sans/FiraSans-Bold.ttf');
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url('../../lib/font/fira-code/FiraCode-Regular.otf');
|
||||
src: url('../lib/font/fira-code/FiraCode-Regular.otf');
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'Fira Code';
|
||||
src: url('../../lib/font/fira-code/FiraCode-Bold.otf');
|
||||
src: url('../lib/font/fira-code/FiraCode-Bold.otf');
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@ -506,11 +524,14 @@ h3[data-category]::before {
|
||||
padding-left: calc(var(--margin) * var(--square));
|
||||
margin-right: .5em;
|
||||
}
|
||||
h2[data-category=Aufgabe]::before {
|
||||
h2[data-category=Aufgabe]::before,
|
||||
h2[data-category=Task]::before {
|
||||
content: attr(data-category) ' ' attr(data-task);
|
||||
}
|
||||
.layout-content-only h2[data-category=Aufgabe]::after,
|
||||
.layout-wide-content h2[data-category=Aufgabe]::after {
|
||||
.layout-content-only h2[data-category=Task]::after,
|
||||
.layout-wide-content h2[data-category=Aufgabe]::after,
|
||||
.layout-wide-content h2[data-category=Task]::after {
|
||||
content: attr(data-task);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -532,12 +553,21 @@ h2[data-category=Aufgabe]::before {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.layout-content-only h2.task-without-number::after,
|
||||
.layout-content-only h2.task-without-number::after,
|
||||
.layout-wide-content h2.task-without-number::after,
|
||||
.layout-wide-content h2.task-without-number::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
img {
|
||||
width: auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
table {
|
||||
font-size: inherit;
|
||||
width: calc(var(--square) - var(--margin) * var(--square));
|
||||
margin-left: calc(-1 * var(--margin) * var(--square));
|
||||
border-spacing: 0;
|
||||
@ -570,7 +600,7 @@ table {
|
||||
}
|
||||
}
|
||||
|
||||
.box, blockquote {
|
||||
.box /*, blockquote*/ {
|
||||
margin-left: calc(-1 * var(--margin) * var(--square));
|
||||
padding: .8em .1em .1em calc(var(--margin) * var(--square));
|
||||
}
|
||||
@ -579,16 +609,35 @@ table {
|
||||
background: var(--primary);
|
||||
}
|
||||
|
||||
|
||||
|
||||
blockquote {
|
||||
color: var(--secondary-dark);
|
||||
text-indent: -.55em;
|
||||
padding-bottom: .8em;
|
||||
&::before {
|
||||
content: '»';
|
||||
color: var(--secondary-dark);
|
||||
position: relative;
|
||||
padding-bottom: 1.8em;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
p:first-of-type { /* probably bungle, but works for one <p> inside <blockquote> */
|
||||
display: contents;
|
||||
&::after {
|
||||
content: '\200a' var(--closing-double-quote);
|
||||
}
|
||||
}
|
||||
cite::before {
|
||||
content: ' – '
|
||||
&::before {
|
||||
content: var(--opening-double-quote) '\200a';
|
||||
color: var(--secondary-dark);
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
right: 100%;
|
||||
}
|
||||
cite {
|
||||
position: absolute;
|
||||
bottom: 0.6em;
|
||||
left: calc(0.4 * var(--square));
|
||||
width: calc(0.4 * var(--square));
|
||||
&::before {
|
||||
content: '— '
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -654,7 +703,7 @@ kbd {
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Twemoji';
|
||||
src: url('../../lib/font/twemoji/TwitterColorEmoji-SVGinOT.ttf');
|
||||
src: url('../lib/font/twemoji/TwitterColorEmoji-SVGinOT.ttf');
|
||||
}
|
||||
|
||||
.emoji {
|
||||
@ -723,3 +772,99 @@ pre.scroll-one-half {
|
||||
max-height: calc(.5 * var(--square));
|
||||
overflow: auto !important;
|
||||
}
|
||||
|
||||
/*
|
||||
* Fragments
|
||||
* =========
|
||||
*/
|
||||
|
||||
.fragment {
|
||||
opacity: 0;
|
||||
transition: .3s opacity ease-in-out;
|
||||
}
|
||||
|
||||
.fragment.visible {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Topic List
|
||||
* ==========
|
||||
*/
|
||||
.topic-list {
|
||||
box-shadow: 0 0px 50px rgba(0, 0, 0, 0.3);
|
||||
z-index: 500;
|
||||
|
||||
.topic-list-search {
|
||||
display: block;
|
||||
width: 100%;
|
||||
border: none;
|
||||
padding: .5rem;
|
||||
margin-bottom: 1rem;
|
||||
border-bottom: 1px solid var(--secondary);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.topic-link {
|
||||
font-weight: normal;
|
||||
|
||||
&.active-topic-link {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&.not-matching-search-terms {
|
||||
opacity: .2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Help Menu
|
||||
* ==========
|
||||
*/
|
||||
|
||||
#help-menu-wrapper {
|
||||
display: none;
|
||||
max-width: 90vw;
|
||||
width: 800px;
|
||||
height: 80vh;
|
||||
box-sizing: border-box;
|
||||
padding: 2rem;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
z-index: 500;
|
||||
background: white;
|
||||
box-shadow: 0 0px 50px rgba(0, 0, 0, 0.3);
|
||||
opacity: 0;
|
||||
transition: .2s opacity ease-in-out;
|
||||
}
|
||||
|
||||
#help-menu-checkbox:checked ~ #help-menu-wrapper {
|
||||
opacity: 1;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#help-menu-checkbox {
|
||||
position: fixed;
|
||||
right: 150vw;
|
||||
}
|
||||
|
||||
#help-menu-toggle {
|
||||
position: fixed;
|
||||
right: 1rem;
|
||||
bottom: 1rem;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
color: white;
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
transition: .1s background-color ease-in-out;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
}
|
||||
}
|
||||
1416
css/reveal.css
1416
css/reveal.css
File diff suppressed because it is too large
Load Diff
1764
css/reveal.scss
1764
css/reveal.scss
File diff suppressed because it is too large
Load Diff
@ -1,21 +0,0 @@
|
||||
## Dependencies
|
||||
|
||||
Themes are written using Sass to keep things modular and reduce the need for repeated selectors across files. Make sure that you have the reveal.js development environment including the Grunt dependencies installed before proceeding: https://github.com/hakimel/reveal.js#full-setup
|
||||
|
||||
## Creating a Theme
|
||||
|
||||
To create your own theme, start by duplicating a ```.scss``` file in [/css/theme/source](https://github.com/hakimel/reveal.js/blob/master/css/theme/source). It will be automatically compiled by Grunt from Sass to CSS (see the [Gruntfile](https://github.com/hakimel/reveal.js/blob/master/Gruntfile.js)) when you run `npm run build -- css-themes`.
|
||||
|
||||
Each theme file does four things in the following order:
|
||||
|
||||
1. **Include [/css/theme/template/mixins.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/mixins.scss)**
|
||||
Shared utility functions.
|
||||
|
||||
2. **Include [/css/theme/template/settings.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/settings.scss)**
|
||||
Declares a set of custom variables that the template file (step 4) expects. Can be overridden in step 3.
|
||||
|
||||
3. **Override**
|
||||
This is where you override the default theme. Either by specifying variables (see [settings.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/settings.scss) for reference) or by adding any selectors and styles you please.
|
||||
|
||||
4. **Include [/css/theme/template/theme.scss](https://github.com/hakimel/reveal.js/blob/master/css/theme/template/theme.scss)**
|
||||
The template theme file which will generate final CSS output based on the currently defined variables.
|
||||
@ -1,277 +0,0 @@
|
||||
/**
|
||||
* Beige theme for reveal.js.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #f7f2d3;
|
||||
background: -moz-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%);
|
||||
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #f7f2d3));
|
||||
background: -webkit-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%);
|
||||
background: -o-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%);
|
||||
background: -ms-radial-gradient(center, circle cover, white 0%, #f7f2d3 100%);
|
||||
background: radial-gradient(center, circle cover, white 0%, #f7f2d3 100%);
|
||||
background-color: #f7f3de; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #333; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: rgba(79, 64, 28, 0.99);
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: rgba(79, 64, 28, 0.99);
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #333;
|
||||
font-family: "League Gothic", Impact, sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #8b743d;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #c0a86e;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #564826; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #333;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #8b743d;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #8b743d; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #8b743d; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #f7f3de; } }
|
||||
@ -1,273 +0,0 @@
|
||||
/**
|
||||
* Black theme for reveal.js. This is the opposite of the 'white' theme.
|
||||
*
|
||||
* By Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(../../lib/font/source-sans-pro/source-sans-pro.css);
|
||||
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 {
|
||||
color: #222; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #222;
|
||||
background-color: #222; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
||||
font-size: 42px;
|
||||
font-weight: normal;
|
||||
color: #fff; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #bee4fd;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #bee4fd;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #fff;
|
||||
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 2.5em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 1.6em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.3em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #42affa;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #8dcffc;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #068de9; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #fff;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #42affa;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #42affa; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #42affa; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #222; } }
|
||||
@ -1,296 +0,0 @@
|
||||
/**
|
||||
* Blood theme for reveal.js
|
||||
* Author: Walther http://github.com/Walther
|
||||
*
|
||||
* Designed to be used with highlight.js theme
|
||||
* "monokai_sublime.css" available from
|
||||
* https://github.com/isagalaev/highlight.js/
|
||||
*
|
||||
* For other themes, change $codeBackground accordingly.
|
||||
*
|
||||
*/
|
||||
@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,700,300italic,700italic);
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #222;
|
||||
background-color: #222; }
|
||||
|
||||
.reveal {
|
||||
font-family: Ubuntu, "sans-serif";
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #eee; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #a23;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #a23;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #eee;
|
||||
font-family: Ubuntu, "sans-serif";
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: 2px 2px 2px #222;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #a23;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #dd5566;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #6a1520; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #eee;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #a23;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #a23; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #a23; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #222; } }
|
||||
|
||||
.reveal p {
|
||||
font-weight: 300;
|
||||
text-shadow: 1px 1px #222; }
|
||||
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
font-weight: 700; }
|
||||
|
||||
.reveal p code {
|
||||
background-color: #23241f;
|
||||
display: inline-block;
|
||||
border-radius: 7px; }
|
||||
|
||||
.reveal small code {
|
||||
vertical-align: baseline; }
|
||||
@ -1,279 +0,0 @@
|
||||
/**
|
||||
* League theme for reveal.js.
|
||||
*
|
||||
* This was the default theme pre-3.0.0.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #1c1e20;
|
||||
background: -moz-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%);
|
||||
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #555a5f), color-stop(100%, #1c1e20));
|
||||
background: -webkit-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%);
|
||||
background: -o-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%);
|
||||
background: -ms-radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%);
|
||||
background: radial-gradient(center, circle cover, #555a5f 0%, #1c1e20 100%);
|
||||
background-color: #2b2b2b; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #eee; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #FF5E99;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #FF5E99;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #eee;
|
||||
font-family: "League Gothic", Impact, sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2);
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #13DAEC;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #71e9f4;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #0d99a5; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #eee;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #13DAEC;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #13DAEC; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #13DAEC; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #2b2b2b; } }
|
||||
@ -1,277 +0,0 @@
|
||||
/**
|
||||
* Solarized Dark theme for reveal.js.
|
||||
* Author: Achim Staebler
|
||||
*/
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
/**
|
||||
* Solarized colors by Ethan Schoonover
|
||||
*/
|
||||
html * {
|
||||
color-profile: sRGB;
|
||||
rendering-intent: auto; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #002b36;
|
||||
background-color: #002b36; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #93a1a1; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #d33682;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #d33682;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #eee8d5;
|
||||
font-family: "League Gothic", Impact, sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #268bd2;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #78b9e6;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #1a6091; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #93a1a1;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #268bd2;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #268bd2; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #268bd2; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #002b36; } }
|
||||
@ -1,271 +0,0 @@
|
||||
/**
|
||||
* Black theme for reveal.js.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(https://fonts.googleapis.com/css?family=Montserrat:700);
|
||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic);
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #111;
|
||||
background-color: #111; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Open Sans", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #eee; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #e7ad52;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #e7ad52;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #eee;
|
||||
font-family: "Montserrat", Impact, sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: -0.03em;
|
||||
text-transform: none;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #e7ad52;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #f3d7ac;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #d08a1d; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #eee;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #e7ad52;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #e7ad52; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #e7ad52; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #111; } }
|
||||
@ -1,273 +0,0 @@
|
||||
/**
|
||||
* A simple theme for reveal.js presentations, similar
|
||||
* to the default theme. The accent color is brown.
|
||||
*
|
||||
* This theme is Copyright (C) 2012-2013 Owen Versteeg, http://owenversteeg.com - it is MIT licensed.
|
||||
*/
|
||||
.reveal a {
|
||||
line-height: 1.3em; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #F0F1EB;
|
||||
background-color: #F0F1EB; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #000; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #26351C;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #26351C;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #383D3D;
|
||||
font-family: "Palatino Linotype", "Book Antiqua", Palatino, FreeSerif, serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #51483D;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #8b7c69;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #25211c; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #000;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #51483D;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #51483D; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #51483D; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #F0F1EB; } }
|
||||
@ -1,276 +0,0 @@
|
||||
/**
|
||||
* A simple theme for reveal.js presentations, similar
|
||||
* to the default theme. The accent color is darkblue.
|
||||
*
|
||||
* This theme is Copyright (C) 2012 Owen Versteeg, https://github.com/StereotypicalApps. It is MIT licensed.
|
||||
* reveal.js is Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 {
|
||||
color: #fff; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #fff;
|
||||
background-color: #fff; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #000; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.99);
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: rgba(0, 0, 0, 0.99);
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #000;
|
||||
font-family: "News Cycle", Impact, sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #00008B;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #0000f1;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #00003f; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #000;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #00008B;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #00008B; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #00008B; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #fff; } }
|
||||
@ -1,280 +0,0 @@
|
||||
/**
|
||||
* Sky theme for reveal.js.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700,400italic,700italic);
|
||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700);
|
||||
.reveal a {
|
||||
line-height: 1.3em; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #add9e4;
|
||||
background: -moz-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%);
|
||||
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #f7fbfc), color-stop(100%, #add9e4));
|
||||
background: -webkit-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%);
|
||||
background: -o-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%);
|
||||
background: -ms-radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%);
|
||||
background: radial-gradient(center, circle cover, #f7fbfc 0%, #add9e4 100%);
|
||||
background-color: #f7fbfc; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Open Sans", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #333; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #134674;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #134674;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #333;
|
||||
font-family: "Quicksand", sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: -0.08em;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #3b759e;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #74a7cb;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #264c66; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #333;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #3b759e;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #3b759e; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #3b759e; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #f7fbfc; } }
|
||||
@ -1,277 +0,0 @@
|
||||
/**
|
||||
* Solarized Light theme for reveal.js.
|
||||
* Author: Achim Staebler
|
||||
*/
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
/**
|
||||
* Solarized colors by Ethan Schoonover
|
||||
*/
|
||||
html * {
|
||||
color-profile: sRGB;
|
||||
rendering-intent: auto; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #fdf6e3;
|
||||
background-color: #fdf6e3; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Lato", sans-serif;
|
||||
font-size: 40px;
|
||||
font-weight: normal;
|
||||
color: #657b83; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #d33682;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #d33682;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #586e75;
|
||||
font-family: "League Gothic", Impact, sans-serif;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 3.77em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 2.11em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.55em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #268bd2;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #78b9e6;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #1a6091; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #657b83;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #268bd2;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #268bd2; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #268bd2; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #fdf6e3; } }
|
||||
@ -1,39 +0,0 @@
|
||||
/**
|
||||
* Beige theme for reveal.js.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$mainColor: #333;
|
||||
$headingColor: #333;
|
||||
$headingTextShadow: none;
|
||||
$backgroundColor: #f7f3de;
|
||||
$linkColor: #8b743d;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$selectionBackgroundColor: rgba(79, 64, 28, 0.99);
|
||||
$heading1TextShadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 20px 20px rgba(0,0,0,.15);
|
||||
|
||||
// Background generator
|
||||
@mixin bodyBackground() {
|
||||
@include radial-gradient( rgba(247,242,211,1), rgba(255,255,255,1) );
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,49 +0,0 @@
|
||||
/**
|
||||
* Black theme for reveal.js. This is the opposite of the 'white' theme.
|
||||
*
|
||||
* By Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(../../lib/font/source-sans-pro/source-sans-pro.css);
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$backgroundColor: #222;
|
||||
|
||||
$mainColor: #fff;
|
||||
$headingColor: #fff;
|
||||
|
||||
$mainFontSize: 42px;
|
||||
$mainFont: 'Source Sans Pro', Helvetica, sans-serif;
|
||||
$headingFont: 'Source Sans Pro', Helvetica, sans-serif;
|
||||
$headingTextShadow: none;
|
||||
$headingLetterSpacing: normal;
|
||||
$headingTextTransform: uppercase;
|
||||
$headingFontWeight: 600;
|
||||
$linkColor: #42affa;
|
||||
$linkColorHover: lighten( $linkColor, 15% );
|
||||
$selectionBackgroundColor: lighten( $linkColor, 25% );
|
||||
|
||||
$heading1Size: 2.5em;
|
||||
$heading2Size: 1.6em;
|
||||
$heading3Size: 1.3em;
|
||||
$heading4Size: 1.0em;
|
||||
|
||||
section.has-light-background {
|
||||
&, h1, h2, h3, h4, h5, h6 {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,78 +0,0 @@
|
||||
/**
|
||||
* Blood theme for reveal.js
|
||||
* Author: Walther http://github.com/Walther
|
||||
*
|
||||
* Designed to be used with highlight.js theme
|
||||
* "monokai_sublime.css" available from
|
||||
* https://github.com/isagalaev/highlight.js/
|
||||
*
|
||||
* For other themes, change $codeBackground accordingly.
|
||||
*
|
||||
*/
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
// Include theme-specific fonts
|
||||
|
||||
@import url(https://fonts.googleapis.com/css?family=Ubuntu:300,700,300italic,700italic);
|
||||
|
||||
// Colors used in the theme
|
||||
$blood: #a23;
|
||||
$coal: #222;
|
||||
$codeBackground: #23241f;
|
||||
|
||||
$backgroundColor: $coal;
|
||||
|
||||
// Main text
|
||||
$mainFont: Ubuntu, 'sans-serif';
|
||||
$mainColor: #eee;
|
||||
|
||||
// Headings
|
||||
$headingFont: Ubuntu, 'sans-serif';
|
||||
$headingTextShadow: 2px 2px 2px $coal;
|
||||
|
||||
// h1 shadow, borrowed humbly from
|
||||
// (c) Default theme by Hakim El Hattab
|
||||
$heading1TextShadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 20px 20px rgba(0,0,0,.15);
|
||||
|
||||
// Links
|
||||
$linkColor: $blood;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
|
||||
// Text selection
|
||||
$selectionBackgroundColor: $blood;
|
||||
$selectionColor: #fff;
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
|
||||
// some overrides after theme template import
|
||||
|
||||
.reveal p {
|
||||
font-weight: 300;
|
||||
text-shadow: 1px 1px $coal;
|
||||
}
|
||||
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.reveal p code {
|
||||
background-color: $codeBackground;
|
||||
display: inline-block;
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.reveal small code {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
@ -1,34 +0,0 @@
|
||||
/**
|
||||
* League theme for reveal.js.
|
||||
*
|
||||
* This was the default theme pre-3.0.0.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$headingTextShadow: 0px 0px 6px rgba(0,0,0,0.2);
|
||||
$heading1TextShadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 20px 20px rgba(0,0,0,.15);
|
||||
|
||||
// Background generator
|
||||
@mixin bodyBackground() {
|
||||
@include radial-gradient( rgba(28,30,32,1), rgba(85,90,95,1) );
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,57 +0,0 @@
|
||||
/**
|
||||
* Solarized Dark theme for reveal.js.
|
||||
* Author: Achim Staebler
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
|
||||
/**
|
||||
* Solarized colors by Ethan Schoonover
|
||||
*/
|
||||
html * {
|
||||
color-profile: sRGB;
|
||||
rendering-intent: auto;
|
||||
}
|
||||
|
||||
// Solarized colors
|
||||
$base03: #002b36;
|
||||
$base02: #073642;
|
||||
$base01: #586e75;
|
||||
$base00: #657b83;
|
||||
$base0: #839496;
|
||||
$base1: #93a1a1;
|
||||
$base2: #eee8d5;
|
||||
$base3: #fdf6e3;
|
||||
$yellow: #b58900;
|
||||
$orange: #cb4b16;
|
||||
$red: #dc322f;
|
||||
$magenta: #d33682;
|
||||
$violet: #6c71c4;
|
||||
$blue: #268bd2;
|
||||
$cyan: #2aa198;
|
||||
$green: #859900;
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$mainColor: $base1;
|
||||
$headingColor: $base2;
|
||||
$headingTextShadow: none;
|
||||
$backgroundColor: $base03;
|
||||
$linkColor: $blue;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$selectionBackgroundColor: $magenta;
|
||||
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,34 +0,0 @@
|
||||
/**
|
||||
* Black theme for reveal.js.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(https://fonts.googleapis.com/css?family=Montserrat:700);
|
||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic);
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$backgroundColor: #111;
|
||||
|
||||
$mainFont: 'Open Sans', sans-serif;
|
||||
$linkColor: #e7ad52;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$headingFont: 'Montserrat', Impact, sans-serif;
|
||||
$headingTextShadow: none;
|
||||
$headingLetterSpacing: -0.03em;
|
||||
$headingTextTransform: none;
|
||||
$selectionBackgroundColor: #e7ad52;
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,35 +0,0 @@
|
||||
/**
|
||||
* A simple theme for reveal.js presentations, similar
|
||||
* to the default theme. The accent color is brown.
|
||||
*
|
||||
* This theme is Copyright (C) 2012-2013 Owen Versteeg, http://owenversteeg.com - it is MIT licensed.
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$mainFont: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif;
|
||||
$mainColor: #000;
|
||||
$headingFont: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif;
|
||||
$headingColor: #383D3D;
|
||||
$headingTextShadow: none;
|
||||
$headingTextTransform: none;
|
||||
$backgroundColor: #F0F1EB;
|
||||
$linkColor: #51483D;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$selectionBackgroundColor: #26351C;
|
||||
|
||||
.reveal a {
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,43 +0,0 @@
|
||||
/**
|
||||
* A simple theme for reveal.js presentations, similar
|
||||
* to the default theme. The accent color is darkblue.
|
||||
*
|
||||
* This theme is Copyright (C) 2012 Owen Versteeg, https://github.com/StereotypicalApps. It is MIT licensed.
|
||||
* reveal.js is Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(https://fonts.googleapis.com/css?family=News+Cycle:400,700);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$mainFont: 'Lato', sans-serif;
|
||||
$mainColor: #000;
|
||||
$headingFont: 'News Cycle', Impact, sans-serif;
|
||||
$headingColor: #000;
|
||||
$headingTextShadow: none;
|
||||
$headingTextTransform: none;
|
||||
$backgroundColor: #fff;
|
||||
$linkColor: #00008B;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$selectionBackgroundColor: rgba(0, 0, 0, 0.99);
|
||||
|
||||
section.has-dark-background {
|
||||
&, h1, h2, h3, h4, h5, h6 {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,46 +0,0 @@
|
||||
/**
|
||||
* Sky theme for reveal.js.
|
||||
*
|
||||
* Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(https://fonts.googleapis.com/css?family=Quicksand:400,700,400italic,700italic);
|
||||
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700);
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$mainFont: 'Open Sans', sans-serif;
|
||||
$mainColor: #333;
|
||||
$headingFont: 'Quicksand', sans-serif;
|
||||
$headingColor: #333;
|
||||
$headingLetterSpacing: -0.08em;
|
||||
$headingTextShadow: none;
|
||||
$backgroundColor: #f7fbfc;
|
||||
$linkColor: #3b759e;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$selectionBackgroundColor: #134674;
|
||||
|
||||
// Fix links so they are not cut off
|
||||
.reveal a {
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
// Background generator
|
||||
@mixin bodyBackground() {
|
||||
@include radial-gradient( #add9e4, #f7fbfc );
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,63 +0,0 @@
|
||||
/**
|
||||
* Solarized Light theme for reveal.js.
|
||||
* Author: Achim Staebler
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(../../lib/font/league-gothic/league-gothic.css);
|
||||
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
|
||||
|
||||
|
||||
/**
|
||||
* Solarized colors by Ethan Schoonover
|
||||
*/
|
||||
html * {
|
||||
color-profile: sRGB;
|
||||
rendering-intent: auto;
|
||||
}
|
||||
|
||||
// Solarized colors
|
||||
$base03: #002b36;
|
||||
$base02: #073642;
|
||||
$base01: #586e75;
|
||||
$base00: #657b83;
|
||||
$base0: #839496;
|
||||
$base1: #93a1a1;
|
||||
$base2: #eee8d5;
|
||||
$base3: #fdf6e3;
|
||||
$yellow: #b58900;
|
||||
$orange: #cb4b16;
|
||||
$red: #dc322f;
|
||||
$magenta: #d33682;
|
||||
$violet: #6c71c4;
|
||||
$blue: #268bd2;
|
||||
$cyan: #2aa198;
|
||||
$green: #859900;
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$mainColor: $base00;
|
||||
$headingColor: $base01;
|
||||
$headingTextShadow: none;
|
||||
$backgroundColor: $base3;
|
||||
$linkColor: $blue;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
$selectionBackgroundColor: $magenta;
|
||||
|
||||
// Background generator
|
||||
// @mixin bodyBackground() {
|
||||
// @include radial-gradient( rgba($base3,1), rgba(lighten($base3, 20%),1) );
|
||||
// }
|
||||
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,49 +0,0 @@
|
||||
/**
|
||||
* White theme for reveal.js. This is the opposite of the 'black' theme.
|
||||
*
|
||||
* By Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
|
||||
|
||||
// Default mixins and settings -----------------
|
||||
@import "../template/mixins";
|
||||
@import "../template/settings";
|
||||
// ---------------------------------------------
|
||||
|
||||
|
||||
// Include theme-specific fonts
|
||||
@import url(../../lib/font/source-sans-pro/source-sans-pro.css);
|
||||
|
||||
|
||||
// Override theme settings (see ../template/settings.scss)
|
||||
$backgroundColor: #fff;
|
||||
|
||||
$mainColor: #222;
|
||||
$headingColor: #222;
|
||||
|
||||
$mainFontSize: 42px;
|
||||
$mainFont: 'Source Sans Pro', Helvetica, sans-serif;
|
||||
$headingFont: 'Source Sans Pro', Helvetica, sans-serif;
|
||||
$headingTextShadow: none;
|
||||
$headingLetterSpacing: normal;
|
||||
$headingTextTransform: uppercase;
|
||||
$headingFontWeight: 600;
|
||||
$linkColor: #2a76dd;
|
||||
$linkColorHover: lighten( $linkColor, 15% );
|
||||
$selectionBackgroundColor: lighten( $linkColor, 25% );
|
||||
|
||||
$heading1Size: 2.5em;
|
||||
$heading2Size: 1.6em;
|
||||
$heading3Size: 1.3em;
|
||||
$heading4Size: 1.0em;
|
||||
|
||||
section.has-dark-background {
|
||||
&, h1, h2, h3, h4, h5, h6 {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Theme template ------------------------------
|
||||
@import "../template/theme";
|
||||
// ---------------------------------------------
|
||||
@ -1,29 +0,0 @@
|
||||
@mixin vertical-gradient( $top, $bottom ) {
|
||||
background: $top;
|
||||
background: -moz-linear-gradient( top, $top 0%, $bottom 100% );
|
||||
background: -webkit-gradient( linear, left top, left bottom, color-stop(0%,$top), color-stop(100%,$bottom) );
|
||||
background: -webkit-linear-gradient( top, $top 0%, $bottom 100% );
|
||||
background: -o-linear-gradient( top, $top 0%, $bottom 100% );
|
||||
background: -ms-linear-gradient( top, $top 0%, $bottom 100% );
|
||||
background: linear-gradient( top, $top 0%, $bottom 100% );
|
||||
}
|
||||
|
||||
@mixin horizontal-gradient( $top, $bottom ) {
|
||||
background: $top;
|
||||
background: -moz-linear-gradient( left, $top 0%, $bottom 100% );
|
||||
background: -webkit-gradient( linear, left top, right top, color-stop(0%,$top), color-stop(100%,$bottom) );
|
||||
background: -webkit-linear-gradient( left, $top 0%, $bottom 100% );
|
||||
background: -o-linear-gradient( left, $top 0%, $bottom 100% );
|
||||
background: -ms-linear-gradient( left, $top 0%, $bottom 100% );
|
||||
background: linear-gradient( left, $top 0%, $bottom 100% );
|
||||
}
|
||||
|
||||
@mixin radial-gradient( $outer, $inner, $type: circle ) {
|
||||
background: $outer;
|
||||
background: -moz-radial-gradient( center, $type cover, $inner 0%, $outer 100% );
|
||||
background: -webkit-gradient( radial, center center, 0px, center center, 100%, color-stop(0%,$inner), color-stop(100%,$outer) );
|
||||
background: -webkit-radial-gradient( center, $type cover, $inner 0%, $outer 100% );
|
||||
background: -o-radial-gradient( center, $type cover, $inner 0%, $outer 100% );
|
||||
background: -ms-radial-gradient( center, $type cover, $inner 0%, $outer 100% );
|
||||
background: radial-gradient( center, $type cover, $inner 0%, $outer 100% );
|
||||
}
|
||||
@ -1,43 +0,0 @@
|
||||
// Base settings for all themes that can optionally be
|
||||
// overridden by the super-theme
|
||||
|
||||
// Background of the presentation
|
||||
$backgroundColor: #2b2b2b;
|
||||
|
||||
// Primary/body text
|
||||
$mainFont: 'Lato', sans-serif;
|
||||
$mainFontSize: 40px;
|
||||
$mainColor: #eee;
|
||||
|
||||
// Vertical spacing between blocks of text
|
||||
$blockMargin: 20px;
|
||||
|
||||
// Headings
|
||||
$headingMargin: 0 0 $blockMargin 0;
|
||||
$headingFont: 'League Gothic', Impact, sans-serif;
|
||||
$headingColor: #eee;
|
||||
$headingLineHeight: 1.2;
|
||||
$headingLetterSpacing: normal;
|
||||
$headingTextTransform: uppercase;
|
||||
$headingTextShadow: none;
|
||||
$headingFontWeight: normal;
|
||||
$heading1TextShadow: $headingTextShadow;
|
||||
|
||||
$heading1Size: 3.77em;
|
||||
$heading2Size: 2.11em;
|
||||
$heading3Size: 1.55em;
|
||||
$heading4Size: 1.00em;
|
||||
|
||||
// Links and actions
|
||||
$linkColor: #13DAEC;
|
||||
$linkColorHover: lighten( $linkColor, 20% );
|
||||
|
||||
// Text selection
|
||||
$selectionBackgroundColor: #FF5E99;
|
||||
$selectionColor: #fff;
|
||||
|
||||
// Generates the presentation background, can be overridden
|
||||
// to return a background image or gradient
|
||||
@mixin bodyBackground() {
|
||||
background: $backgroundColor;
|
||||
}
|
||||
@ -1,325 +0,0 @@
|
||||
// Base theme template for reveal.js
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
|
||||
body {
|
||||
@include bodyBackground();
|
||||
background-color: $backgroundColor;
|
||||
}
|
||||
|
||||
.reveal {
|
||||
font-family: $mainFont;
|
||||
font-size: $mainFontSize;
|
||||
font-weight: normal;
|
||||
color: $mainColor;
|
||||
}
|
||||
|
||||
::selection {
|
||||
color: $selectionColor;
|
||||
background: $selectionBackgroundColor;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
color: $selectionColor;
|
||||
background: $selectionBackgroundColor;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section>section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: $headingMargin;
|
||||
color: $headingColor;
|
||||
|
||||
font-family: $headingFont;
|
||||
font-weight: $headingFontWeight;
|
||||
line-height: $headingLineHeight;
|
||||
letter-spacing: $headingLetterSpacing;
|
||||
|
||||
text-transform: $headingTextTransform;
|
||||
text-shadow: $headingTextShadow;
|
||||
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.reveal h1 {font-size: $heading1Size; }
|
||||
.reveal h2 {font-size: $heading2Size; }
|
||||
.reveal h3 {font-size: $heading3Size; }
|
||||
.reveal h4 {font-size: $heading4Size; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: $heading1TextShadow;
|
||||
}
|
||||
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
|
||||
.reveal p {
|
||||
margin: $blockMargin 0;
|
||||
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%;
|
||||
}
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.reveal em {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em;
|
||||
}
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc;
|
||||
}
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square;
|
||||
}
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle;
|
||||
}
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: $blockMargin auto;
|
||||
padding: 5px;
|
||||
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
|
||||
}
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.reveal q {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: $blockMargin auto;
|
||||
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
|
||||
word-wrap: break-word;
|
||||
|
||||
box-shadow: 0px 0px 6px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal;
|
||||
}
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.reveal table th {
|
||||
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;
|
||||
}
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller;
|
||||
}
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller;
|
||||
}
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
|
||||
.reveal a {
|
||||
color: $linkColor;
|
||||
text-decoration: none;
|
||||
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease;
|
||||
}
|
||||
.reveal a:hover {
|
||||
color: $linkColorHover;
|
||||
|
||||
text-shadow: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: darken( $linkColor, 15% );
|
||||
}
|
||||
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255,255,255,0.12);
|
||||
border: 4px solid $mainColor;
|
||||
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear;
|
||||
}
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255,255,255,0.2);
|
||||
border-color: $linkColor;
|
||||
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
|
||||
.reveal .controls {
|
||||
color: $linkColor;
|
||||
}
|
||||
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
|
||||
.reveal .progress {
|
||||
background: rgba(0,0,0,0.2);
|
||||
color: $linkColor;
|
||||
}
|
||||
.reveal .progress span {
|
||||
-webkit-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
||||
-moz-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
||||
transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985);
|
||||
}
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: $backgroundColor;
|
||||
}
|
||||
}
|
||||
@ -1,273 +0,0 @@
|
||||
/**
|
||||
* White theme for reveal.js. This is the opposite of the 'black' theme.
|
||||
*
|
||||
* By Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
@import url(../../lib/font/source-sans-pro/source-sans-pro.css);
|
||||
section.has-dark-background, section.has-dark-background h1, section.has-dark-background h2, section.has-dark-background h3, section.has-dark-background h4, section.has-dark-background h5, section.has-dark-background h6 {
|
||||
color: #fff; }
|
||||
|
||||
/*********************************************
|
||||
* GLOBAL STYLES
|
||||
*********************************************/
|
||||
body {
|
||||
background: #fff;
|
||||
background-color: #fff; }
|
||||
|
||||
.reveal {
|
||||
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
||||
font-size: 42px;
|
||||
font-weight: normal;
|
||||
color: #222; }
|
||||
|
||||
::selection {
|
||||
color: #fff;
|
||||
background: #98bdef;
|
||||
text-shadow: none; }
|
||||
|
||||
::-moz-selection {
|
||||
color: #fff;
|
||||
background: #98bdef;
|
||||
text-shadow: none; }
|
||||
|
||||
.reveal .slides section,
|
||||
.reveal .slides section > section {
|
||||
line-height: 1.3;
|
||||
font-weight: inherit; }
|
||||
|
||||
/*********************************************
|
||||
* HEADERS
|
||||
*********************************************/
|
||||
.reveal h1,
|
||||
.reveal h2,
|
||||
.reveal h3,
|
||||
.reveal h4,
|
||||
.reveal h5,
|
||||
.reveal h6 {
|
||||
margin: 0 0 20px 0;
|
||||
color: #222;
|
||||
font-family: "Source Sans Pro", Helvetica, sans-serif;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
letter-spacing: normal;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
word-wrap: break-word; }
|
||||
|
||||
.reveal h1 {
|
||||
font-size: 2.5em; }
|
||||
|
||||
.reveal h2 {
|
||||
font-size: 1.6em; }
|
||||
|
||||
.reveal h3 {
|
||||
font-size: 1.3em; }
|
||||
|
||||
.reveal h4 {
|
||||
font-size: 1em; }
|
||||
|
||||
.reveal h1 {
|
||||
text-shadow: none; }
|
||||
|
||||
/*********************************************
|
||||
* OTHER
|
||||
*********************************************/
|
||||
.reveal p {
|
||||
margin: 20px 0;
|
||||
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%; }
|
||||
|
||||
.reveal strong,
|
||||
.reveal b {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal em {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal ol,
|
||||
.reveal dl,
|
||||
.reveal ul {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
margin: 0 0 0 1em; }
|
||||
|
||||
.reveal ol {
|
||||
list-style-type: decimal; }
|
||||
|
||||
.reveal ul {
|
||||
list-style-type: disc; }
|
||||
|
||||
.reveal ul ul {
|
||||
list-style-type: square; }
|
||||
|
||||
.reveal ul ul ul {
|
||||
list-style-type: circle; }
|
||||
|
||||
.reveal ul ul,
|
||||
.reveal ul ol,
|
||||
.reveal ol ol,
|
||||
.reveal ol ul {
|
||||
display: block;
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal dt {
|
||||
font-weight: bold; }
|
||||
|
||||
.reveal dd {
|
||||
margin-left: 40px; }
|
||||
|
||||
.reveal blockquote {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
|
||||
|
||||
.reveal blockquote p:first-child,
|
||||
.reveal blockquote p:last-child {
|
||||
display: inline-block; }
|
||||
|
||||
.reveal q {
|
||||
font-style: italic; }
|
||||
|
||||
.reveal pre {
|
||||
display: block;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 20px auto;
|
||||
text-align: left;
|
||||
font-size: 0.55em;
|
||||
font-family: monospace;
|
||||
line-height: 1.2em;
|
||||
word-wrap: break-word;
|
||||
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.reveal code {
|
||||
font-family: monospace;
|
||||
text-transform: none; }
|
||||
|
||||
.reveal pre code {
|
||||
display: block;
|
||||
padding: 5px;
|
||||
overflow: auto;
|
||||
max-height: 400px;
|
||||
word-wrap: normal; }
|
||||
|
||||
.reveal table {
|
||||
margin: auto;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
.reveal table th {
|
||||
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; }
|
||||
|
||||
.reveal table th[align="center"],
|
||||
.reveal table td[align="center"] {
|
||||
text-align: center; }
|
||||
|
||||
.reveal table th[align="right"],
|
||||
.reveal table td[align="right"] {
|
||||
text-align: right; }
|
||||
|
||||
.reveal table tbody tr:last-child th,
|
||||
.reveal table tbody tr:last-child td {
|
||||
border-bottom: none; }
|
||||
|
||||
.reveal sup {
|
||||
vertical-align: super;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal sub {
|
||||
vertical-align: sub;
|
||||
font-size: smaller; }
|
||||
|
||||
.reveal small {
|
||||
display: inline-block;
|
||||
font-size: 0.6em;
|
||||
line-height: 1.2em;
|
||||
vertical-align: top; }
|
||||
|
||||
.reveal small * {
|
||||
vertical-align: top; }
|
||||
|
||||
/*********************************************
|
||||
* LINKS
|
||||
*********************************************/
|
||||
.reveal a {
|
||||
color: #2a76dd;
|
||||
text-decoration: none;
|
||||
-webkit-transition: color .15s ease;
|
||||
-moz-transition: color .15s ease;
|
||||
transition: color .15s ease; }
|
||||
|
||||
.reveal a:hover {
|
||||
color: #6ca0e8;
|
||||
text-shadow: none;
|
||||
border: none; }
|
||||
|
||||
.reveal .roll span:after {
|
||||
color: #fff;
|
||||
background: #1a53a1; }
|
||||
|
||||
/*********************************************
|
||||
* IMAGES
|
||||
*********************************************/
|
||||
.reveal section img {
|
||||
margin: 15px 0px;
|
||||
background: rgba(255, 255, 255, 0.12);
|
||||
border: 4px solid #222;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
|
||||
|
||||
.reveal section img.plain {
|
||||
border: 0;
|
||||
box-shadow: none; }
|
||||
|
||||
.reveal a img {
|
||||
-webkit-transition: all .15s linear;
|
||||
-moz-transition: all .15s linear;
|
||||
transition: all .15s linear; }
|
||||
|
||||
.reveal a:hover img {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-color: #2a76dd;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
|
||||
|
||||
/*********************************************
|
||||
* NAVIGATION CONTROLS
|
||||
*********************************************/
|
||||
.reveal .controls {
|
||||
color: #2a76dd; }
|
||||
|
||||
/*********************************************
|
||||
* PROGRESS BAR
|
||||
*********************************************/
|
||||
.reveal .progress {
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
color: #2a76dd; }
|
||||
|
||||
.reveal .progress span {
|
||||
-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); }
|
||||
|
||||
/*********************************************
|
||||
* PRINT BACKGROUND
|
||||
*********************************************/
|
||||
@media print {
|
||||
.backgrounds {
|
||||
background-color: #fff; } }
|
||||
@ -5,9 +5,14 @@
|
||||
|
||||
dirname=latex-wochenende-$(date +"%Y%m%d%H%M%S")
|
||||
|
||||
echo "Compiling all slides …"
|
||||
python3 ./onpoint/main.py -i -f .
|
||||
|
||||
echo "Creating zip file …"
|
||||
mkdir $dirname
|
||||
for i in css images index.html js lib sections plugin; do
|
||||
mkdir $dirname/css
|
||||
mkdir $dirname/onpoint
|
||||
for i in css/latex.css css/print images slides.de.html slides.en.html js onpoint/onpoint.js lib svg; do
|
||||
cp -r $i $dirname/$i
|
||||
done;
|
||||
|
||||
@ -17,4 +22,4 @@ rm -rf $dirname
|
||||
echo -n "Enter scp destination: "
|
||||
read destination
|
||||
scp $dirname.zip $destination
|
||||
rm $dirname.zip
|
||||
rm $dirname.zip
|
||||
|
||||
@ -1,21 +0,0 @@
|
||||
version: "3"
|
||||
services:
|
||||
latesch:
|
||||
build: .
|
||||
image: docker.wiai.de/latex/build:0.4-alpine
|
||||
# volumes:
|
||||
# - ./:/latex
|
||||
ports:
|
||||
- "127.0.0.1:8000:8000"
|
||||
# networks:
|
||||
# - traefik_net
|
||||
# labels:
|
||||
# - "traefik.enable=true"
|
||||
# - "traefik.port=8000"
|
||||
# - "traefik.docker.network=traefik_net"
|
||||
# - "traefik.http.frontend.rule=Host:latesch.elli-valley.de"
|
||||
#
|
||||
#networks:
|
||||
# traefik_net:
|
||||
# external:
|
||||
# name: traefik_net
|
||||
105
index.html
105
index.html
@ -1,105 +0,0 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
|
||||
<title>LaTeX-Wochenende der Fachschaft WIAI</title>
|
||||
|
||||
<link rel="stylesheet" href="css/reveal.css">
|
||||
<link rel="stylesheet" href="css/theme/latex.css">
|
||||
|
||||
<!-- Theme used for syntax highlighting of code -->
|
||||
<link rel="stylesheet" href="lib/css/zenburn.css">
|
||||
|
||||
<!-- Printing and PDF exports -->
|
||||
<script>
|
||||
var link = document.createElement( 'link' );
|
||||
link.rel = 'stylesheet';
|
||||
link.type = 'text/css';
|
||||
link.href = window.location.search.match( /print-pdf/gi ) ? 'css/print/pdf.css' : 'css/print/paper.css';
|
||||
document.getElementsByTagName( 'head' )[0].appendChild( link );
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="reveal">
|
||||
<div class="slides">
|
||||
<section data-markdown="sections/german/00/00.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/01/01.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/02/02.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/03/03.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/04/04.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/05/05.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/06/06.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/07/07.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/08/08.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/09/09.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/10/10.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/11/11.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/12/12.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/13/13.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/14/14.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/15/15.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
<section data-markdown="sections/german/16/16.md" data-separator="^\r?\n===\r?\n$"
|
||||
data-separator-vertical="^\r?\n---\r?\n$"></section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="lib/js/head.min.js"></script>
|
||||
<script src="js/reveal.js"></script>
|
||||
|
||||
<script>
|
||||
// More info about config & dependencies:
|
||||
// - https://github.com/hakimel/reveal.js#configuration
|
||||
// - https://github.com/hakimel/reveal.js#dependencies
|
||||
Reveal.initialize({
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
minScale: 1,
|
||||
maxScale: 1,
|
||||
margin: 0,
|
||||
transition: 'none',
|
||||
math: {
|
||||
mathjax: 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js',
|
||||
config: 'TeX-AMS_HTML-full', // See http://docs.mathjax.org/en/latest/config-files.html
|
||||
},
|
||||
history: true,
|
||||
fragmentInURL: true,
|
||||
pdfSeparateFragments: false,
|
||||
pdfMaxPagesPerSlide: 1,
|
||||
dependencies: [
|
||||
{ src: 'plugin/markdown/marked.js' },
|
||||
{ src: 'plugin/markdown/markdown.js' },
|
||||
{ src: 'plugin/notes/notes.js', async: true },
|
||||
{ src: 'plugin/highlight/highlight.js', async: true, callback: function () { hljs.initHighlightingOnLoad(); } },
|
||||
{ src: 'plugin/math/math.js', async: true }
|
||||
]
|
||||
});
|
||||
|
||||
window.onload = function () {
|
||||
MathJax.Hub.Config({
|
||||
"HTML-CSS": {
|
||||
availableFonts: ["Latin Modern"],
|
||||
preferredFont: "Latin Modern"
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
41
js/lazyload-images.js
Normal file
41
js/lazyload-images.js
Normal file
@ -0,0 +1,41 @@
|
||||
// credit: https://www.sitepoint.com/five-techniques-lazy-load-images-website-performance/
|
||||
|
||||
// create config object: rootMargin and threshold
|
||||
// are two properties exposed by the interface
|
||||
// more information: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
|
||||
const config = {
|
||||
// margin around the root element defaulting to the viewport
|
||||
rootMargin: '500px 0px 500px 0px',
|
||||
// how much of the image has to be on screen to load the image
|
||||
threshold: 0
|
||||
};
|
||||
|
||||
// register the config object with an instance
|
||||
// of intersectionObserver
|
||||
let observer = new IntersectionObserver(onCloseToVisibleArea, config);
|
||||
|
||||
window.addEventListener("load", function () {
|
||||
const imgs = document.querySelectorAll('img[data-src]');
|
||||
imgs.forEach(img => {
|
||||
observer.observe(img);
|
||||
});
|
||||
})
|
||||
|
||||
function onCloseToVisibleArea(entries, self) {
|
||||
// iterate over each entry
|
||||
entries.forEach(entry => {
|
||||
// process just the images that are intersecting.
|
||||
// isIntersecting is a property exposed by the interface
|
||||
if (entry.isIntersecting) {
|
||||
// custom function that copies the path to the img
|
||||
// from data-src to src
|
||||
preloadImage(entry.target);
|
||||
// the image is now in place, stop watching
|
||||
self.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function preloadImage(imgTag) {
|
||||
imgTag.setAttribute("src", imgTag.getAttribute("data-src"));
|
||||
}
|
||||
5577
js/reveal.js
5577
js/reveal.js
File diff suppressed because it is too large
Load Diff
5
layouts/chapter-slide.html
Normal file
5
layouts/chapter-slide.html
Normal file
@ -0,0 +1,5 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>@title(inline)</h1>
|
||||
</div>
|
||||
</div>
|
||||
9
layouts/content-and-preview-with-category.html
Normal file
9
layouts/content-and-preview-with-category.html
Normal file
@ -0,0 +1,9 @@
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="@category(inline)">@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
@preview(inline)
|
||||
</div>
|
||||
</div>
|
||||
9
layouts/content-and-preview.html
Normal file
9
layouts/content-and-preview.html
Normal file
@ -0,0 +1,9 @@
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
@preview(inline)
|
||||
</div>
|
||||
</div>
|
||||
7
layouts/content-only-with-category.html
Normal file
7
layouts/content-only-with-category.html
Normal file
@ -0,0 +1,7 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="@category(inline)">@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
</div>
|
||||
|
||||
6
layouts/content-only.html
Normal file
6
layouts/content-only.html
Normal file
@ -0,0 +1,6 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
</div>
|
||||
5
layouts/preview-only.html
Normal file
5
layouts/preview-only.html
Normal file
@ -0,0 +1,5 @@
|
||||
<div class="layout-preview-only">
|
||||
<div class="layout-preview">
|
||||
@preview
|
||||
</div>
|
||||
</div>
|
||||
40
layouts/root.html
Normal file
40
layouts/root.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="@language">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
|
||||
|
||||
<title>@title</title>
|
||||
|
||||
<link rel="stylesheet" href="css/latex.css"/>
|
||||
<link rel="stylesheet" href="lib/highlightjs/zenburn.css"/>
|
||||
</head>
|
||||
<body>
|
||||
@slides
|
||||
<div id="progress-bar"></div>
|
||||
@help
|
||||
|
||||
<script src="onpoint/onpoint.js"></script>
|
||||
<script src="lib/highlightjs/highlight.pack.js"/>
|
||||
<script>
|
||||
hljs.initHighlightingOnLoad();
|
||||
</script>
|
||||
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
|
||||
<script id="MathJax-script" async="true" src="lib/mathjax/es5/tex-mml-chtml.js"></script>
|
||||
<script src="js/lazyload-images.js"></script>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js"></script>
|
||||
<script>
|
||||
MathJax = {
|
||||
tex: {
|
||||
inlineMath: [
|
||||
['$', '$'], ['\\(', '\\)']
|
||||
]
|
||||
},
|
||||
svg: {
|
||||
fontCache: 'global'
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
12
layouts/task-without-number.html
Normal file
12
layouts/task-without-number.html
Normal file
@ -0,0 +1,12 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2
|
||||
data-category="@task-name"
|
||||
data-task="@task-number(inline)"
|
||||
class="task-without-number"
|
||||
>
|
||||
@title(inline)
|
||||
</h2>
|
||||
@content
|
||||
</div>
|
||||
</div>
|
||||
6
layouts/task.html
Normal file
6
layouts/task.html
Normal file
@ -0,0 +1,6 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="@task-name" data-task="@task-number(inline)">@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
</div>
|
||||
10
layouts/titlepage.html
Normal file
10
layouts/titlepage.html
Normal file
@ -0,0 +1,10 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content titlepage">
|
||||
<h1>@presentation-title(inline)</h1>
|
||||
<small>
|
||||
@subscript
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
9
layouts/two-columns.html
Normal file
9
layouts/two-columns.html
Normal file
@ -0,0 +1,9 @@
|
||||
<div class="layout-two-columns">
|
||||
<h2 class="layout-title">@title(inline)</h2>
|
||||
<div class="layout-column-one">
|
||||
@column-one
|
||||
</div>
|
||||
<div class="layout-column-two">
|
||||
@column-two
|
||||
</div>
|
||||
</div>
|
||||
14
layouts/two-previews.html
Normal file
14
layouts/two-previews.html
Normal file
@ -0,0 +1,14 @@
|
||||
<div class="layout-two-previews">
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="@left-image(inline)"/>
|
||||
<figcaption>@left-caption(inline)</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="@right-image(inline)" />
|
||||
<figcaption>@right-caption(inline)</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
6
layouts/wide-content.html
Normal file
6
layouts/wide-content.html
Normal file
@ -0,0 +1,6 @@
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2>@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
</div>
|
||||
6
layouts/wide-task.html
Normal file
6
layouts/wide-task.html
Normal file
@ -0,0 +1,6 @@
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="@task-name" data-task="@task-number(inline)">@title(inline)</h2>
|
||||
@content
|
||||
</div>
|
||||
</div>
|
||||
2
lib/highlightjs/highlight.pack.js
Normal file
2
lib/highlightjs/highlight.pack.js
Normal file
File diff suppressed because one or more lines are too long
@ -1,2 +0,0 @@
|
||||
/*! @source http://purl.eligrey.com/github/classList.js/blob/master/classList.js*/
|
||||
if(typeof document!=="undefined"&&!("classList" in document.createElement("a"))){(function(j){var a="classList",f="prototype",m=(j.HTMLElement||j.Element)[f],b=Object,k=String[f].trim||function(){return this.replace(/^\s+|\s+$/g,"")},c=Array[f].indexOf||function(q){var p=0,o=this.length;for(;p<o;p++){if(p in this&&this[p]===q){return p}}return -1},n=function(o,p){this.name=o;this.code=DOMException[o];this.message=p},g=function(p,o){if(o===""){throw new n("SYNTAX_ERR","An invalid or illegal string was specified")}if(/\s/.test(o)){throw new n("INVALID_CHARACTER_ERR","String contains an invalid character")}return c.call(p,o)},d=function(s){var r=k.call(s.className),q=r?r.split(/\s+/):[],p=0,o=q.length;for(;p<o;p++){this.push(q[p])}this._updateClassName=function(){s.className=this.toString()}},e=d[f]=[],i=function(){return new d(this)};n[f]=Error[f];e.item=function(o){return this[o]||null};e.contains=function(o){o+="";return g(this,o)!==-1};e.add=function(o){o+="";if(g(this,o)===-1){this.push(o);this._updateClassName()}};e.remove=function(p){p+="";var o=g(this,p);if(o!==-1){this.splice(o,1);this._updateClassName()}};e.toggle=function(o){o+="";if(g(this,o)===-1){this.add(o)}else{this.remove(o)}};e.toString=function(){return this.join(" ")};if(b.defineProperty){var l={get:i,enumerable:true,configurable:true};try{b.defineProperty(m,a,l)}catch(h){if(h.number===-2146823252){l.enumerable=false;b.defineProperty(m,a,l)}}}else{if(b[f].__defineGetter__){m.__defineGetter__(a,i)}}}(self))};
|
||||
6
lib/js/head.min.js
vendored
6
lib/js/head.min.js
vendored
@ -1,6 +0,0 @@
|
||||
/*! head.core - v1.0.2 */
|
||||
(function(n,t){"use strict";function r(n){a[a.length]=n}function k(n){var t=new RegExp(" ?\\b"+n+"\\b");c.className=c.className.replace(t,"")}function p(n,t){for(var i=0,r=n.length;i<r;i++)t.call(n,n[i],i)}function tt(){var t,e,f,o;c.className=c.className.replace(/ (w-|eq-|gt-|gte-|lt-|lte-|portrait|no-portrait|landscape|no-landscape)\d+/g,"");t=n.innerWidth||c.clientWidth;e=n.outerWidth||n.screen.width;u.screen.innerWidth=t;u.screen.outerWidth=e;r("w-"+t);p(i.screens,function(n){t>n?(i.screensCss.gt&&r("gt-"+n),i.screensCss.gte&&r("gte-"+n)):t<n?(i.screensCss.lt&&r("lt-"+n),i.screensCss.lte&&r("lte-"+n)):t===n&&(i.screensCss.lte&&r("lte-"+n),i.screensCss.eq&&r("e-q"+n),i.screensCss.gte&&r("gte-"+n))});f=n.innerHeight||c.clientHeight;o=n.outerHeight||n.screen.height;u.screen.innerHeight=f;u.screen.outerHeight=o;u.feature("portrait",f>t);u.feature("landscape",f<t)}function it(){n.clearTimeout(b);b=n.setTimeout(tt,50)}var y=n.document,rt=n.navigator,ut=n.location,c=y.documentElement,a=[],i={screens:[240,320,480,640,768,800,1024,1280,1440,1680,1920],screensCss:{gt:!0,gte:!1,lt:!0,lte:!1,eq:!1},browsers:[{ie:{min:6,max:11}}],browserCss:{gt:!0,gte:!1,lt:!0,lte:!1,eq:!0},html5:!0,page:"-page",section:"-section",head:"head"},v,u,s,w,o,h,l,d,f,g,nt,e,b;if(n.head_conf)for(v in n.head_conf)n.head_conf[v]!==t&&(i[v]=n.head_conf[v]);u=n[i.head]=function(){u.ready.apply(null,arguments)};u.feature=function(n,t,i){return n?(Object.prototype.toString.call(t)==="[object Function]"&&(t=t.call()),r((t?"":"no-")+n),u[n]=!!t,i||(k("no-"+n),k(n),u.feature()),u):(c.className+=" "+a.join(" "),a=[],u)};u.feature("js",!0);s=rt.userAgent.toLowerCase();w=/mobile|android|kindle|silk|midp|phone|(windows .+arm|touch)/.test(s);u.feature("mobile",w,!0);u.feature("desktop",!w,!0);s=/(chrome|firefox)[ \/]([\w.]+)/.exec(s)||/(iphone|ipad|ipod)(?:.*version)?[ \/]([\w.]+)/.exec(s)||/(android)(?:.*version)?[ \/]([\w.]+)/.exec(s)||/(webkit|opera)(?:.*version)?[ \/]([\w.]+)/.exec(s)||/(msie) ([\w.]+)/.exec(s)||/(trident).+rv:(\w.)+/.exec(s)||[];o=s[1];h=parseFloat(s[2]);switch(o){case"msie":case"trident":o="ie";h=y.documentMode||h;break;case"firefox":o="ff";break;case"ipod":case"ipad":case"iphone":o="ios";break;case"webkit":o="safari"}for(u.browser={name:o,version:h},u.browser[o]=!0,l=0,d=i.browsers.length;l<d;l++)for(f in i.browsers[l])if(o===f)for(r(f),g=i.browsers[l][f].min,nt=i.browsers[l][f].max,e=g;e<=nt;e++)h>e?(i.browserCss.gt&&r("gt-"+f+e),i.browserCss.gte&&r("gte-"+f+e)):h<e?(i.browserCss.lt&&r("lt-"+f+e),i.browserCss.lte&&r("lte-"+f+e)):h===e&&(i.browserCss.lte&&r("lte-"+f+e),i.browserCss.eq&&r("eq-"+f+e),i.browserCss.gte&&r("gte-"+f+e));else r("no-"+f);r(o);r(o+parseInt(h,10));i.html5&&o==="ie"&&h<9&&p("abbr|article|aside|audio|canvas|details|figcaption|figure|footer|header|hgroup|main|mark|meter|nav|output|progress|section|summary|time|video".split("|"),function(n){y.createElement(n)});p(ut.pathname.split("/"),function(n,u){if(this.length>2&&this[u+1]!==t)u&&r(this.slice(u,u+1).join("-").toLowerCase()+i.section);else{var f=n||"index",e=f.indexOf(".");e>0&&(f=f.substring(0,e));c.id=f.toLowerCase()+i.page;u||r("root"+i.section)}});u.screen={height:n.screen.height,width:n.screen.width};tt();b=0;n.addEventListener?n.addEventListener("resize",it,!1):n.attachEvent("onresize",it)})(window);
|
||||
/*! head.css3 - v1.0.0 */
|
||||
(function(n,t){"use strict";function a(n){for(var r in n)if(i[n[r]]!==t)return!0;return!1}function r(n){var t=n.charAt(0).toUpperCase()+n.substr(1),i=(n+" "+c.join(t+" ")+t).split(" ");return!!a(i)}var h=n.document,o=h.createElement("i"),i=o.style,s=" -o- -moz- -ms- -webkit- -khtml- ".split(" "),c="Webkit Moz O ms Khtml".split(" "),l=n.head_conf&&n.head_conf.head||"head",u=n[l],f={gradient:function(){var n="background-image:";return i.cssText=(n+s.join("gradient(linear,left top,right bottom,from(#9f9),to(#fff));"+n)+s.join("linear-gradient(left top,#eee,#fff);"+n)).slice(0,-n.length),!!i.backgroundImage},rgba:function(){return i.cssText="background-color:rgba(0,0,0,0.5)",!!i.backgroundColor},opacity:function(){return o.style.opacity===""},textshadow:function(){return i.textShadow===""},multiplebgs:function(){i.cssText="background:url(https://),url(https://),red url(https://)";var n=(i.background||"").match(/url/g);return Object.prototype.toString.call(n)==="[object Array]"&&n.length===3},boxshadow:function(){return r("boxShadow")},borderimage:function(){return r("borderImage")},borderradius:function(){return r("borderRadius")},cssreflections:function(){return r("boxReflect")},csstransforms:function(){return r("transform")},csstransitions:function(){return r("transition")},touch:function(){return"ontouchstart"in n},retina:function(){return n.devicePixelRatio>1},fontface:function(){var t=u.browser.name,n=u.browser.version;switch(t){case"ie":return n>=9;case"chrome":return n>=13;case"ff":return n>=6;case"ios":return n>=5;case"android":return!1;case"webkit":return n>=5.1;case"opera":return n>=10;default:return!1}}};for(var e in f)f[e]&&u.feature(e,f[e].call(),!0);u.feature()})(window);
|
||||
/*! head.load - v1.0.3 */
|
||||
(function(n,t){"use strict";function w(){}function u(n,t){if(n){typeof n=="object"&&(n=[].slice.call(n));for(var i=0,r=n.length;i<r;i++)t.call(n,n[i],i)}}function it(n,i){var r=Object.prototype.toString.call(i).slice(8,-1);return i!==t&&i!==null&&r===n}function s(n){return it("Function",n)}function a(n){return it("Array",n)}function et(n){var i=n.split("/"),t=i[i.length-1],r=t.indexOf("?");return r!==-1?t.substring(0,r):t}function f(n){(n=n||w,n._done)||(n(),n._done=1)}function ot(n,t,r,u){var f=typeof n=="object"?n:{test:n,success:!t?!1:a(t)?t:[t],failure:!r?!1:a(r)?r:[r],callback:u||w},e=!!f.test;return e&&!!f.success?(f.success.push(f.callback),i.load.apply(null,f.success)):e||!f.failure?u():(f.failure.push(f.callback),i.load.apply(null,f.failure)),i}function v(n){var t={},i,r;if(typeof n=="object")for(i in n)!n[i]||(t={name:i,url:n[i]});else t={name:et(n),url:n};return(r=c[t.name],r&&r.url===t.url)?r:(c[t.name]=t,t)}function y(n){n=n||c;for(var t in n)if(n.hasOwnProperty(t)&&n[t].state!==l)return!1;return!0}function st(n){n.state=ft;u(n.onpreload,function(n){n.call()})}function ht(n){n.state===t&&(n.state=nt,n.onpreload=[],rt({url:n.url,type:"cache"},function(){st(n)}))}function ct(){var n=arguments,t=n[n.length-1],r=[].slice.call(n,1),f=r[0];return(s(t)||(t=null),a(n[0]))?(n[0].push(t),i.load.apply(null,n[0]),i):(f?(u(r,function(n){s(n)||!n||ht(v(n))}),b(v(n[0]),s(f)?f:function(){i.load.apply(null,r)})):b(v(n[0])),i)}function lt(){var n=arguments,t=n[n.length-1],r={};return(s(t)||(t=null),a(n[0]))?(n[0].push(t),i.load.apply(null,n[0]),i):(u(n,function(n){n!==t&&(n=v(n),r[n.name]=n)}),u(n,function(n){n!==t&&(n=v(n),b(n,function(){y(r)&&f(t)}))}),i)}function b(n,t){if(t=t||w,n.state===l){t();return}if(n.state===tt){i.ready(n.name,t);return}if(n.state===nt){n.onpreload.push(function(){b(n,t)});return}n.state=tt;rt(n,function(){n.state=l;t();u(h[n.name],function(n){f(n)});o&&y()&&u(h.ALL,function(n){f(n)})})}function at(n){n=n||"";var t=n.split("?")[0].split(".");return t[t.length-1].toLowerCase()}function rt(t,i){function e(t){t=t||n.event;u.onload=u.onreadystatechange=u.onerror=null;i()}function o(f){f=f||n.event;(f.type==="load"||/loaded|complete/.test(u.readyState)&&(!r.documentMode||r.documentMode<9))&&(n.clearTimeout(t.errorTimeout),n.clearTimeout(t.cssTimeout),u.onload=u.onreadystatechange=u.onerror=null,i())}function s(){if(t.state!==l&&t.cssRetries<=20){for(var i=0,f=r.styleSheets.length;i<f;i++)if(r.styleSheets[i].href===u.href){o({type:"load"});return}t.cssRetries++;t.cssTimeout=n.setTimeout(s,250)}}var u,h,f;i=i||w;h=at(t.url);h==="css"?(u=r.createElement("link"),u.type="text/"+(t.type||"css"),u.rel="stylesheet",u.href=t.url,t.cssRetries=0,t.cssTimeout=n.setTimeout(s,500)):(u=r.createElement("script"),u.type="text/"+(t.type||"javascript"),u.src=t.url);u.onload=u.onreadystatechange=o;u.onerror=e;u.async=!1;u.defer=!1;t.errorTimeout=n.setTimeout(function(){e({type:"timeout"})},7e3);f=r.head||r.getElementsByTagName("head")[0];f.insertBefore(u,f.lastChild)}function vt(){for(var t,u=r.getElementsByTagName("script"),n=0,f=u.length;n<f;n++)if(t=u[n].getAttribute("data-headjs-load"),!!t){i.load(t);return}}function yt(n,t){var v,p,e;return n===r?(o?f(t):d.push(t),i):(s(n)&&(t=n,n="ALL"),a(n))?(v={},u(n,function(n){v[n]=c[n];i.ready(n,function(){y(v)&&f(t)})}),i):typeof n!="string"||!s(t)?i:(p=c[n],p&&p.state===l||n==="ALL"&&y()&&o)?(f(t),i):(e=h[n],e?e.push(t):e=h[n]=[t],i)}function e(){if(!r.body){n.clearTimeout(i.readyTimeout);i.readyTimeout=n.setTimeout(e,50);return}o||(o=!0,vt(),u(d,function(n){f(n)}))}function k(){r.addEventListener?(r.removeEventListener("DOMContentLoaded",k,!1),e()):r.readyState==="complete"&&(r.detachEvent("onreadystatechange",k),e())}var r=n.document,d=[],h={},c={},ut="async"in r.createElement("script")||"MozAppearance"in r.documentElement.style||n.opera,o,g=n.head_conf&&n.head_conf.head||"head",i=n[g]=n[g]||function(){i.ready.apply(null,arguments)},nt=1,ft=2,tt=3,l=4,p;if(r.readyState==="complete")e();else if(r.addEventListener)r.addEventListener("DOMContentLoaded",k,!1),n.addEventListener("load",e,!1);else{r.attachEvent("onreadystatechange",k);n.attachEvent("onload",e);p=!1;try{p=!n.frameElement&&r.documentElement}catch(wt){}p&&p.doScroll&&function pt(){if(!o){try{p.doScroll("left")}catch(t){n.clearTimeout(i.readyTimeout);i.readyTimeout=n.setTimeout(pt,50);return}e()}}()}i.load=i.js=ut?lt:ct;i.test=ot;i.ready=yt;i.ready(r,function(){y()&&u(h.ALL,function(n){f(n)});i.feature&&i.feature("domloaded",!0)})})(window);
|
||||
7
lib/js/html5shiv.js
vendored
7
lib/js/html5shiv.js
vendored
@ -1,7 +0,0 @@
|
||||
document.createElement('header');
|
||||
document.createElement('nav');
|
||||
document.createElement('section');
|
||||
document.createElement('article');
|
||||
document.createElement('aside');
|
||||
document.createElement('footer');
|
||||
document.createElement('hgroup');
|
||||
1
lib/mathjax
Submodule
1
lib/mathjax
Submodule
@ -0,0 +1 @@
|
||||
Subproject commit 844ca9bade6d4aa7bbd455b0dd5cfbdc27fe3a5b
|
||||
9
meta.yml
Normal file
9
meta.yml
Normal file
@ -0,0 +1,9 @@
|
||||
language: # available language options and their value for the html lang attribute
|
||||
de: de
|
||||
en: en
|
||||
title:
|
||||
de: LaTeX-Wochenende der Fachschaft WIAI
|
||||
en: Fachschaft WIAI LaTeX Weekend
|
||||
task-name:
|
||||
de: Aufgabe
|
||||
en: Task
|
||||
1
onpoint
Submodule
1
onpoint
Submodule
@ -0,0 +1 @@
|
||||
Subproject commit ccad5282c56b31574321dd5a38e4a495cc11f206
|
||||
44
package.json
44
package.json
@ -1,44 +0,0 @@
|
||||
{
|
||||
"name": "reveal.js",
|
||||
"version": "3.7.0",
|
||||
"description": "The HTML Presentation Framework",
|
||||
"homepage": "http://revealjs.com",
|
||||
"subdomain": "revealjs",
|
||||
"main": "js/reveal.js",
|
||||
"scripts": {
|
||||
"test": "grunt test",
|
||||
"start": "grunt serve",
|
||||
"build": "grunt"
|
||||
},
|
||||
"author": {
|
||||
"name": "Hakim El Hattab",
|
||||
"email": "hakim.elhattab@gmail.com",
|
||||
"web": "http://hakim.se"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git://github.com/hakimel/reveal.js.git"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=4.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"express": "^4.16.2",
|
||||
"grunt": "^1.0.4",
|
||||
"grunt-autoprefixer": "^3.0.4",
|
||||
"grunt-cli": "^1.2.0",
|
||||
"grunt-contrib-connect": "^1.0.2",
|
||||
"grunt-contrib-cssmin": "^2.2.1",
|
||||
"grunt-contrib-jshint": "^1.1.0",
|
||||
"grunt-contrib-qunit": "^2.0.0",
|
||||
"grunt-contrib-uglify": "^3.3.0",
|
||||
"grunt-contrib-watch": "^1.0.0",
|
||||
"grunt-retire": "^1.0.7",
|
||||
"grunt-sass": "^2.0.0",
|
||||
"grunt-zip": "~0.17.1",
|
||||
"mustache": "^2.3.0",
|
||||
"socket.io": "^1.7.3",
|
||||
"grunt-shell": "^3.0.1"
|
||||
},
|
||||
"license": "MIT"
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@ -1,136 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>reveal.js - Markdown Demo</title>
|
||||
|
||||
<link rel="stylesheet" href="../../css/reveal.css">
|
||||
<link rel="stylesheet" href="../../css/theme/white.css" id="theme">
|
||||
|
||||
<link rel="stylesheet" href="../../lib/css/zenburn.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="reveal">
|
||||
|
||||
<div class="slides">
|
||||
|
||||
<!-- Use external markdown resource, separate slides by three newlines; vertical slides by two newlines -->
|
||||
<section data-markdown="example.md" data-separator="^\n\n\n" data-separator-vertical="^\n\n"></section>
|
||||
|
||||
<!-- Slides are separated by three dashes (quick 'n dirty regular expression) -->
|
||||
<section data-markdown data-separator="---">
|
||||
<script type="text/template">
|
||||
## Demo 1
|
||||
Slide 1
|
||||
---
|
||||
## Demo 1
|
||||
Slide 2
|
||||
---
|
||||
## Demo 1
|
||||
Slide 3
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<!-- Slides are separated by newline + three dashes + newline, vertical slides identical but two dashes -->
|
||||
<section data-markdown data-separator="^\n---\n$" data-separator-vertical="^\n--\n$">
|
||||
<script type="text/template">
|
||||
## Demo 2
|
||||
Slide 1.1
|
||||
|
||||
--
|
||||
|
||||
## Demo 2
|
||||
Slide 1.2
|
||||
|
||||
---
|
||||
|
||||
## Demo 2
|
||||
Slide 2
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<!-- No "extra" slides, since there are no separators defined (so they'll become horizontal rulers) -->
|
||||
<section data-markdown>
|
||||
<script type="text/template">
|
||||
A
|
||||
|
||||
---
|
||||
|
||||
B
|
||||
|
||||
---
|
||||
|
||||
C
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<!-- Slide attributes -->
|
||||
<section data-markdown>
|
||||
<script type="text/template">
|
||||
<!-- .slide: data-background="#000000" -->
|
||||
## Slide attributes
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<!-- Element attributes -->
|
||||
<section data-markdown>
|
||||
<script type="text/template">
|
||||
## Element attributes
|
||||
- Item 1 <!-- .element: class="fragment" data-fragment-index="2" -->
|
||||
- Item 2 <!-- .element: class="fragment" data-fragment-index="1" -->
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<!-- Code -->
|
||||
<section data-markdown>
|
||||
<script type="text/template">
|
||||
```php
|
||||
public function foo()
|
||||
{
|
||||
$foo = array(
|
||||
'bar' => 'bar'
|
||||
)
|
||||
}
|
||||
```
|
||||
</script>
|
||||
</section>
|
||||
|
||||
<!-- Images -->
|
||||
<section data-markdown>
|
||||
<script type="text/template">
|
||||

|
||||
</script>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="../../lib/js/head.min.js"></script>
|
||||
<script src="../../js/reveal.js"></script>
|
||||
|
||||
<script>
|
||||
|
||||
Reveal.initialize({
|
||||
controls: true,
|
||||
progress: true,
|
||||
history: true,
|
||||
center: true,
|
||||
|
||||
// Optional libraries used to extend on reveal.js
|
||||
dependencies: [
|
||||
{ src: '../../lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
||||
{ src: 'marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
||||
{ src: 'markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
||||
{ src: '../highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
|
||||
{ src: '../notes/notes.js' }
|
||||
]
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,36 +0,0 @@
|
||||
# Markdown Demo
|
||||
|
||||
|
||||
|
||||
## External 1.1
|
||||
|
||||
Content 1.1
|
||||
|
||||
Note: This will only appear in the speaker notes window.
|
||||
|
||||
|
||||
## External 1.2
|
||||
|
||||
Content 1.2
|
||||
|
||||
|
||||
|
||||
## External 2
|
||||
|
||||
Content 2.1
|
||||
|
||||
|
||||
|
||||
## External 3.1
|
||||
|
||||
Content 3.1
|
||||
|
||||
|
||||
## External 3.2
|
||||
|
||||
Content 3.2
|
||||
|
||||
|
||||
## External 3.3
|
||||
|
||||

|
||||
@ -1,412 +0,0 @@
|
||||
/**
|
||||
* The reveal.js markdown plugin. Handles parsing of
|
||||
* markdown inside of presentations as well as loading
|
||||
* of external markdown documents.
|
||||
*/
|
||||
(function( root, factory ) {
|
||||
if (typeof define === 'function' && define.amd) {
|
||||
root.marked = require( './marked' );
|
||||
root.RevealMarkdown = factory( root.marked );
|
||||
root.RevealMarkdown.initialize();
|
||||
} else if( typeof exports === 'object' ) {
|
||||
module.exports = factory( require( './marked' ) );
|
||||
} else {
|
||||
// Browser globals (root is window)
|
||||
root.RevealMarkdown = factory( root.marked );
|
||||
root.RevealMarkdown.initialize();
|
||||
}
|
||||
}( this, function( marked ) {
|
||||
|
||||
var DEFAULT_SLIDE_SEPARATOR = '^\r?\n---\r?\n$',
|
||||
DEFAULT_NOTES_SEPARATOR = 'notes?:',
|
||||
DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR = '\\\.element\\\s*?(.+?)$',
|
||||
DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR = '\\\.slide:\\\s*?(\\\S.+?)$';
|
||||
|
||||
var SCRIPT_END_PLACEHOLDER = '__SCRIPT_END__';
|
||||
|
||||
|
||||
/**
|
||||
* Retrieves the markdown contents of a slide section
|
||||
* element. Normalizes leading tabs/whitespace.
|
||||
*/
|
||||
function getMarkdownFromSlide( section ) {
|
||||
|
||||
// look for a <script> or <textarea data-template> wrapper
|
||||
var template = section.querySelector( '[data-template]' ) || section.querySelector( 'script' );
|
||||
|
||||
// strip leading whitespace so it isn't evaluated as code
|
||||
var text = ( template || section ).textContent;
|
||||
|
||||
// restore script end tags
|
||||
text = text.replace( new RegExp( SCRIPT_END_PLACEHOLDER, 'g' ), '</script>' );
|
||||
|
||||
var leadingWs = text.match( /^\n?(\s*)/ )[1].length,
|
||||
leadingTabs = text.match( /^\n?(\t*)/ )[1].length;
|
||||
|
||||
if( leadingTabs > 0 ) {
|
||||
text = text.replace( new RegExp('\\n?\\t{' + leadingTabs + '}','g'), '\n' );
|
||||
}
|
||||
else if( leadingWs > 1 ) {
|
||||
text = text.replace( new RegExp('\\n? {' + leadingWs + '}', 'g'), '\n' );
|
||||
}
|
||||
|
||||
return text;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Given a markdown slide section element, this will
|
||||
* return all arguments that aren't related to markdown
|
||||
* parsing. Used to forward any other user-defined arguments
|
||||
* to the output markdown slide.
|
||||
*/
|
||||
function getForwardedAttributes( section ) {
|
||||
|
||||
var attributes = section.attributes;
|
||||
var result = [];
|
||||
|
||||
for( var i = 0, len = attributes.length; i < len; i++ ) {
|
||||
var name = attributes[i].name,
|
||||
value = attributes[i].value;
|
||||
|
||||
// disregard attributes that are used for markdown loading/parsing
|
||||
if( /data\-(markdown|separator|vertical|notes)/gi.test( name ) ) continue;
|
||||
|
||||
if( value ) {
|
||||
result.push( name + '="' + value + '"' );
|
||||
}
|
||||
else {
|
||||
result.push( name );
|
||||
}
|
||||
}
|
||||
|
||||
return result.join( ' ' );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Inspects the given options and fills out default
|
||||
* values for what's not defined.
|
||||
*/
|
||||
function getSlidifyOptions( options ) {
|
||||
|
||||
options = options || {};
|
||||
options.separator = options.separator || DEFAULT_SLIDE_SEPARATOR;
|
||||
options.notesSeparator = options.notesSeparator || DEFAULT_NOTES_SEPARATOR;
|
||||
options.attributes = options.attributes || '';
|
||||
|
||||
return options;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Helper function for constructing a markdown slide.
|
||||
*/
|
||||
function createMarkdownSlide( content, options ) {
|
||||
|
||||
options = getSlidifyOptions( options );
|
||||
|
||||
var notesMatch = content.split( new RegExp( options.notesSeparator, 'mgi' ) );
|
||||
|
||||
if( notesMatch.length === 2 ) {
|
||||
content = notesMatch[0] + '<aside class="notes">' + marked(notesMatch[1].trim()) + '</aside>';
|
||||
}
|
||||
|
||||
// prevent script end tags in the content from interfering
|
||||
// with parsing
|
||||
content = content.replace( /<\/script>/g, SCRIPT_END_PLACEHOLDER );
|
||||
|
||||
return '<script type="text/template">' + content + '</script>';
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Parses a data string into multiple slides based
|
||||
* on the passed in separator arguments.
|
||||
*/
|
||||
function slidify( markdown, options ) {
|
||||
|
||||
options = getSlidifyOptions( options );
|
||||
|
||||
var separatorRegex = new RegExp( options.separator + ( options.verticalSeparator ? '|' + options.verticalSeparator : '' ), 'mg' ),
|
||||
horizontalSeparatorRegex = new RegExp( options.separator );
|
||||
|
||||
var matches,
|
||||
lastIndex = 0,
|
||||
isHorizontal,
|
||||
wasHorizontal = true,
|
||||
content,
|
||||
sectionStack = [];
|
||||
|
||||
// iterate until all blocks between separators are stacked up
|
||||
while( matches = separatorRegex.exec( markdown ) ) {
|
||||
notes = null;
|
||||
|
||||
// determine direction (horizontal by default)
|
||||
isHorizontal = horizontalSeparatorRegex.test( matches[0] );
|
||||
|
||||
if( !isHorizontal && wasHorizontal ) {
|
||||
// create vertical stack
|
||||
sectionStack.push( [] );
|
||||
}
|
||||
|
||||
// pluck slide content from markdown input
|
||||
content = markdown.substring( lastIndex, matches.index );
|
||||
|
||||
if( isHorizontal && wasHorizontal ) {
|
||||
// add to horizontal stack
|
||||
sectionStack.push( content );
|
||||
}
|
||||
else {
|
||||
// add to vertical stack
|
||||
sectionStack[sectionStack.length-1].push( content );
|
||||
}
|
||||
|
||||
lastIndex = separatorRegex.lastIndex;
|
||||
wasHorizontal = isHorizontal;
|
||||
}
|
||||
|
||||
// add the remaining slide
|
||||
( wasHorizontal ? sectionStack : sectionStack[sectionStack.length-1] ).push( markdown.substring( lastIndex ) );
|
||||
|
||||
var markdownSections = '';
|
||||
|
||||
// flatten the hierarchical stack, and insert <section data-markdown> tags
|
||||
for( var i = 0, len = sectionStack.length; i < len; i++ ) {
|
||||
// vertical
|
||||
if( sectionStack[i] instanceof Array ) {
|
||||
markdownSections += '<section '+ options.attributes +'>';
|
||||
|
||||
sectionStack[i].forEach( function( child ) {
|
||||
markdownSections += '<section data-markdown>' + createMarkdownSlide( child, options ) + '</section>';
|
||||
} );
|
||||
|
||||
markdownSections += '</section>';
|
||||
}
|
||||
else {
|
||||
markdownSections += '<section '+ options.attributes +' data-markdown>' + createMarkdownSlide( sectionStack[i], options ) + '</section>';
|
||||
}
|
||||
}
|
||||
|
||||
return markdownSections;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Parses any current data-markdown slides, splits
|
||||
* multi-slide markdown into separate sections and
|
||||
* handles loading of external markdown.
|
||||
*/
|
||||
function processSlides() {
|
||||
|
||||
var sections = document.querySelectorAll( '[data-markdown]'),
|
||||
section;
|
||||
|
||||
for( var i = 0, len = sections.length; i < len; i++ ) {
|
||||
|
||||
section = sections[i];
|
||||
|
||||
if( section.getAttribute( 'data-markdown' ).length ) {
|
||||
|
||||
var xhr = new XMLHttpRequest(),
|
||||
url = section.getAttribute( 'data-markdown' );
|
||||
|
||||
datacharset = section.getAttribute( 'data-charset' );
|
||||
|
||||
// see https://developer.mozilla.org/en-US/docs/Web/API/element.getAttribute#Notes
|
||||
if( datacharset != null && datacharset != '' ) {
|
||||
xhr.overrideMimeType( 'text/html; charset=' + datacharset );
|
||||
}
|
||||
|
||||
xhr.onreadystatechange = function() {
|
||||
if( xhr.readyState === 4 ) {
|
||||
// file protocol yields status code 0 (useful for local debug, mobile applications etc.)
|
||||
if ( ( xhr.status >= 200 && xhr.status < 300 ) || xhr.status === 0 ) {
|
||||
|
||||
section.outerHTML = slidify( xhr.responseText, {
|
||||
separator: section.getAttribute( 'data-separator' ),
|
||||
verticalSeparator: section.getAttribute( 'data-separator-vertical' ),
|
||||
notesSeparator: section.getAttribute( 'data-separator-notes' ),
|
||||
attributes: getForwardedAttributes( section )
|
||||
});
|
||||
|
||||
}
|
||||
else {
|
||||
|
||||
section.outerHTML = '<section data-state="alert">' +
|
||||
'ERROR: The attempt to fetch ' + url + ' failed with HTTP status ' + xhr.status + '.' +
|
||||
'Check your browser\'s JavaScript console for more details.' +
|
||||
'<p>Remember that you need to serve the presentation HTML from a HTTP server.</p>' +
|
||||
'</section>';
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
xhr.open( 'GET', url, false );
|
||||
|
||||
try {
|
||||
xhr.send();
|
||||
}
|
||||
catch ( e ) {
|
||||
alert( 'Failed to get the Markdown file ' + url + '. Make sure that the presentation and the file are served by a HTTP server and the file can be found there. ' + e );
|
||||
}
|
||||
|
||||
}
|
||||
else if( section.getAttribute( 'data-separator' ) || section.getAttribute( 'data-separator-vertical' ) || section.getAttribute( 'data-separator-notes' ) ) {
|
||||
|
||||
section.outerHTML = slidify( getMarkdownFromSlide( section ), {
|
||||
separator: section.getAttribute( 'data-separator' ),
|
||||
verticalSeparator: section.getAttribute( 'data-separator-vertical' ),
|
||||
notesSeparator: section.getAttribute( 'data-separator-notes' ),
|
||||
attributes: getForwardedAttributes( section )
|
||||
});
|
||||
|
||||
}
|
||||
else {
|
||||
section.innerHTML = createMarkdownSlide( getMarkdownFromSlide( section ) );
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if a node value has the attributes pattern.
|
||||
* If yes, extract it and add that value as one or several attributes
|
||||
* the the terget element.
|
||||
*
|
||||
* You need Cache Killer on Chrome to see the effect on any FOM transformation
|
||||
* directly on refresh (F5)
|
||||
* http://stackoverflow.com/questions/5690269/disabling-chrome-cache-for-website-development/7000899#answer-11786277
|
||||
*/
|
||||
function addAttributeInElement( node, elementTarget, separator ) {
|
||||
|
||||
var mardownClassesInElementsRegex = new RegExp( separator, 'mg' );
|
||||
var mardownClassRegex = new RegExp( "([^\"= ]+?)=\"([^\"=]+?)\"", 'mg' );
|
||||
var nodeValue = node.nodeValue;
|
||||
if( matches = mardownClassesInElementsRegex.exec( nodeValue ) ) {
|
||||
|
||||
var classes = matches[1];
|
||||
nodeValue = nodeValue.substring( 0, matches.index ) + nodeValue.substring( mardownClassesInElementsRegex.lastIndex );
|
||||
node.nodeValue = nodeValue;
|
||||
while( matchesClass = mardownClassRegex.exec( classes ) ) {
|
||||
elementTarget.setAttribute( matchesClass[1], matchesClass[2] );
|
||||
}
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add attributes to the parent element of a text node,
|
||||
* or the element of an attribute node.
|
||||
*/
|
||||
function addAttributes( section, element, previousElement, separatorElementAttributes, separatorSectionAttributes ) {
|
||||
|
||||
if ( element != null && element.childNodes != undefined && element.childNodes.length > 0 ) {
|
||||
previousParentElement = element;
|
||||
for( var i = 0; i < element.childNodes.length; i++ ) {
|
||||
childElement = element.childNodes[i];
|
||||
if ( i > 0 ) {
|
||||
j = i - 1;
|
||||
while ( j >= 0 ) {
|
||||
aPreviousChildElement = element.childNodes[j];
|
||||
if ( typeof aPreviousChildElement.setAttribute == 'function' && aPreviousChildElement.tagName != "BR" ) {
|
||||
previousParentElement = aPreviousChildElement;
|
||||
break;
|
||||
}
|
||||
j = j - 1;
|
||||
}
|
||||
}
|
||||
parentSection = section;
|
||||
if( childElement.nodeName == "section" ) {
|
||||
parentSection = childElement ;
|
||||
previousParentElement = childElement ;
|
||||
}
|
||||
if ( typeof childElement.setAttribute == 'function' || childElement.nodeType == Node.COMMENT_NODE ) {
|
||||
addAttributes( parentSection, childElement, previousParentElement, separatorElementAttributes, separatorSectionAttributes );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ( element.nodeType == Node.COMMENT_NODE ) {
|
||||
if ( addAttributeInElement( element, previousElement, separatorElementAttributes ) == false ) {
|
||||
addAttributeInElement( element, section, separatorSectionAttributes );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts any current data-markdown slides in the
|
||||
* DOM to HTML.
|
||||
*/
|
||||
function convertSlides() {
|
||||
|
||||
var sections = document.querySelectorAll( '[data-markdown]');
|
||||
|
||||
for( var i = 0, len = sections.length; i < len; i++ ) {
|
||||
|
||||
var section = sections[i];
|
||||
|
||||
// Only parse the same slide once
|
||||
if( !section.getAttribute( 'data-markdown-parsed' ) ) {
|
||||
|
||||
section.setAttribute( 'data-markdown-parsed', true )
|
||||
|
||||
var notes = section.querySelector( 'aside.notes' );
|
||||
var markdown = getMarkdownFromSlide( section );
|
||||
|
||||
section.innerHTML = marked( markdown );
|
||||
addAttributes( section, section, null, section.getAttribute( 'data-element-attributes' ) ||
|
||||
section.parentNode.getAttribute( 'data-element-attributes' ) ||
|
||||
DEFAULT_ELEMENT_ATTRIBUTES_SEPARATOR,
|
||||
section.getAttribute( 'data-attributes' ) ||
|
||||
section.parentNode.getAttribute( 'data-attributes' ) ||
|
||||
DEFAULT_SLIDE_ATTRIBUTES_SEPARATOR);
|
||||
|
||||
// If there were notes, we need to re-add them after
|
||||
// having overwritten the section's HTML
|
||||
if( notes ) {
|
||||
section.appendChild( notes );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// API
|
||||
return {
|
||||
|
||||
initialize: function() {
|
||||
if( typeof marked === 'undefined' ) {
|
||||
throw 'The reveal.js Markdown plugin requires marked to be loaded';
|
||||
}
|
||||
|
||||
if( typeof hljs !== 'undefined' ) {
|
||||
marked.setOptions({
|
||||
highlight: function( code, lang ) {
|
||||
return hljs.highlightAuto( code, [lang] ).value;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var options = Reveal.getConfig().markdown;
|
||||
|
||||
if ( options ) {
|
||||
marked.setOptions( options );
|
||||
}
|
||||
|
||||
processSlides();
|
||||
convertSlides();
|
||||
},
|
||||
|
||||
// TODO: Do these belong in the API?
|
||||
processSlides: processSlides,
|
||||
convertSlides: convertSlides,
|
||||
slidify: slidify
|
||||
|
||||
};
|
||||
|
||||
}));
|
||||
File diff suppressed because one or more lines are too long
@ -1,67 +0,0 @@
|
||||
/**
|
||||
* A plugin which enables rendering of math equations inside
|
||||
* of reveal.js slides. Essentially a thin wrapper for MathJax.
|
||||
*
|
||||
* @author Hakim El Hattab
|
||||
*/
|
||||
var RevealMath = window.RevealMath || (function(){
|
||||
|
||||
var options = Reveal.getConfig().math || {};
|
||||
options.mathjax = options.mathjax || 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js';
|
||||
options.config = options.config || 'TeX-AMS_HTML-full';
|
||||
options.tex2jax = options.tex2jax || {
|
||||
inlineMath: [['$','$'],['\\(','\\)']] ,
|
||||
skipTags: ['script','noscript','style','textarea','pre'] };
|
||||
|
||||
loadScript( options.mathjax + '?config=' + options.config, function() {
|
||||
|
||||
MathJax.Hub.Config({
|
||||
messageStyle: 'none',
|
||||
tex2jax: options.tex2jax,
|
||||
skipStartupTypeset: true
|
||||
});
|
||||
|
||||
// Typeset followed by an immediate reveal.js layout since
|
||||
// the typesetting process could affect slide height
|
||||
MathJax.Hub.Queue( [ 'Typeset', MathJax.Hub ] );
|
||||
MathJax.Hub.Queue( Reveal.layout );
|
||||
|
||||
// Reprocess equations in slides when they turn visible
|
||||
Reveal.addEventListener( 'slidechanged', function( event ) {
|
||||
|
||||
MathJax.Hub.Queue( [ 'Typeset', MathJax.Hub, event.currentSlide ] );
|
||||
|
||||
} );
|
||||
|
||||
} );
|
||||
|
||||
function loadScript( url, callback ) {
|
||||
|
||||
var head = document.querySelector( 'head' );
|
||||
var script = document.createElement( 'script' );
|
||||
script.type = 'text/javascript';
|
||||
script.src = url;
|
||||
|
||||
// Wrapper for callback to make sure it only fires once
|
||||
var finish = function() {
|
||||
if( typeof callback === 'function' ) {
|
||||
callback.call();
|
||||
callback = null;
|
||||
}
|
||||
}
|
||||
|
||||
script.onload = finish;
|
||||
|
||||
// IE
|
||||
script.onreadystatechange = function() {
|
||||
if ( this.readyState === 'loaded' ) {
|
||||
finish();
|
||||
}
|
||||
}
|
||||
|
||||
// Normal browsers
|
||||
head.appendChild( script );
|
||||
|
||||
}
|
||||
|
||||
})();
|
||||
@ -1,13 +0,0 @@
|
||||
(function() {
|
||||
var multiplex = Reveal.getConfig().multiplex;
|
||||
var socketId = multiplex.id;
|
||||
var socket = io.connect(multiplex.url);
|
||||
|
||||
socket.on(multiplex.id, function(data) {
|
||||
// ignore data from sockets that aren't ours
|
||||
if (data.socketId !== socketId) { return; }
|
||||
if( window.location.host === 'localhost:1947' ) return;
|
||||
|
||||
Reveal.setState(data.state);
|
||||
});
|
||||
}());
|
||||
@ -1,64 +0,0 @@
|
||||
var http = require('http');
|
||||
var express = require('express');
|
||||
var fs = require('fs');
|
||||
var io = require('socket.io');
|
||||
var crypto = require('crypto');
|
||||
|
||||
var app = express();
|
||||
var staticDir = express.static;
|
||||
var server = http.createServer(app);
|
||||
|
||||
io = io(server);
|
||||
|
||||
var opts = {
|
||||
port: process.env.PORT || 1948,
|
||||
baseDir : __dirname + '/../../'
|
||||
};
|
||||
|
||||
io.on( 'connection', function( socket ) {
|
||||
socket.on('multiplex-statechanged', function(data) {
|
||||
if (typeof data.secret == 'undefined' || data.secret == null || data.secret === '') return;
|
||||
if (createHash(data.secret) === data.socketId) {
|
||||
data.secret = null;
|
||||
socket.broadcast.emit(data.socketId, data);
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
[ 'css', 'js', 'plugin', 'lib' ].forEach(function(dir) {
|
||||
app.use('/' + dir, staticDir(opts.baseDir + dir));
|
||||
});
|
||||
|
||||
app.get("/", function(req, res) {
|
||||
res.writeHead(200, {'Content-Type': 'text/html'});
|
||||
|
||||
var stream = fs.createReadStream(opts.baseDir + '/index.html');
|
||||
stream.on('error', function( error ) {
|
||||
res.write('<style>body{font-family: sans-serif;}</style><h2>reveal.js multiplex server.</h2><a href="/token">Generate token</a>');
|
||||
res.end();
|
||||
});
|
||||
stream.on('readable', function() {
|
||||
stream.pipe(res);
|
||||
});
|
||||
});
|
||||
|
||||
app.get("/token", function(req,res) {
|
||||
var ts = new Date().getTime();
|
||||
var rand = Math.floor(Math.random()*9999999);
|
||||
var secret = ts.toString() + rand.toString();
|
||||
res.send({secret: secret, socketId: createHash(secret)});
|
||||
});
|
||||
|
||||
var createHash = function(secret) {
|
||||
var cipher = crypto.createCipher('blowfish', secret);
|
||||
return(cipher.final('hex'));
|
||||
};
|
||||
|
||||
// Actually listen
|
||||
server.listen( opts.port || null );
|
||||
|
||||
var brown = '\033[33m',
|
||||
green = '\033[32m',
|
||||
reset = '\033[0m';
|
||||
|
||||
console.log( brown + "reveal.js:" + reset + " Multiplex running on port " + green + opts.port + reset );
|
||||
@ -1,34 +0,0 @@
|
||||
(function() {
|
||||
|
||||
// Don't emit events from inside of notes windows
|
||||
if ( window.location.search.match( /receiver/gi ) ) { return; }
|
||||
|
||||
var multiplex = Reveal.getConfig().multiplex;
|
||||
|
||||
var socket = io.connect( multiplex.url );
|
||||
|
||||
function post() {
|
||||
|
||||
var messageData = {
|
||||
state: Reveal.getState(),
|
||||
secret: multiplex.secret,
|
||||
socketId: multiplex.id
|
||||
};
|
||||
|
||||
socket.emit( 'multiplex-statechanged', messageData );
|
||||
|
||||
};
|
||||
|
||||
// post once the page is loaded, so the client follows also on "open URL".
|
||||
window.addEventListener( 'load', post );
|
||||
|
||||
// Monitor events that trigger a change in state
|
||||
Reveal.addEventListener( 'slidechanged', post );
|
||||
Reveal.addEventListener( 'fragmentshown', post );
|
||||
Reveal.addEventListener( 'fragmenthidden', post );
|
||||
Reveal.addEventListener( 'overviewhidden', post );
|
||||
Reveal.addEventListener( 'overviewshown', post );
|
||||
Reveal.addEventListener( 'paused', post );
|
||||
Reveal.addEventListener( 'resumed', post );
|
||||
|
||||
}());
|
||||
@ -1,19 +0,0 @@
|
||||
{
|
||||
"name": "reveal-js-multiplex",
|
||||
"version": "1.0.0",
|
||||
"description": "reveal.js multiplex server",
|
||||
"homepage": "http://revealjs.com",
|
||||
"scripts": {
|
||||
"start": "node index.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": "~4.1.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"express": "~4.13.3",
|
||||
"grunt-cli": "~0.1.13",
|
||||
"mustache": "~2.2.1",
|
||||
"socket.io": "~1.3.7"
|
||||
},
|
||||
"license": "MIT"
|
||||
}
|
||||
@ -1,65 +0,0 @@
|
||||
(function() {
|
||||
|
||||
// don't emit events from inside the previews themselves
|
||||
if( window.location.search.match( /receiver/gi ) ) { return; }
|
||||
|
||||
var socket = io.connect( window.location.origin ),
|
||||
socketId = Math.random().toString().slice( 2 );
|
||||
|
||||
console.log( 'View slide notes at ' + window.location.origin + '/notes/' + socketId );
|
||||
|
||||
window.open( window.location.origin + '/notes/' + socketId, 'notes-' + socketId );
|
||||
|
||||
/**
|
||||
* Posts the current slide data to the notes window
|
||||
*/
|
||||
function post() {
|
||||
|
||||
var slideElement = Reveal.getCurrentSlide(),
|
||||
notesElement = slideElement.querySelector( 'aside.notes' );
|
||||
|
||||
var messageData = {
|
||||
notes: '',
|
||||
markdown: false,
|
||||
socketId: socketId,
|
||||
state: Reveal.getState()
|
||||
};
|
||||
|
||||
// Look for notes defined in a slide attribute
|
||||
if( slideElement.hasAttribute( 'data-notes' ) ) {
|
||||
messageData.notes = slideElement.getAttribute( 'data-notes' );
|
||||
}
|
||||
|
||||
// Look for notes defined in an aside element
|
||||
if( notesElement ) {
|
||||
messageData.notes = notesElement.innerHTML;
|
||||
messageData.markdown = typeof notesElement.getAttribute( 'data-markdown' ) === 'string';
|
||||
}
|
||||
|
||||
socket.emit( 'statechanged', messageData );
|
||||
|
||||
}
|
||||
|
||||
// When a new notes window connects, post our current state
|
||||
socket.on( 'new-subscriber', function( data ) {
|
||||
post();
|
||||
} );
|
||||
|
||||
// When the state changes from inside of the speaker view
|
||||
socket.on( 'statechanged-speaker', function( data ) {
|
||||
Reveal.setState( data.state );
|
||||
} );
|
||||
|
||||
// Monitor events that trigger a change in state
|
||||
Reveal.addEventListener( 'slidechanged', post );
|
||||
Reveal.addEventListener( 'fragmentshown', post );
|
||||
Reveal.addEventListener( 'fragmenthidden', post );
|
||||
Reveal.addEventListener( 'overviewhidden', post );
|
||||
Reveal.addEventListener( 'overviewshown', post );
|
||||
Reveal.addEventListener( 'paused', post );
|
||||
Reveal.addEventListener( 'resumed', post );
|
||||
|
||||
// Post the initial state
|
||||
post();
|
||||
|
||||
}());
|
||||
@ -1,69 +0,0 @@
|
||||
var http = require('http');
|
||||
var express = require('express');
|
||||
var fs = require('fs');
|
||||
var io = require('socket.io');
|
||||
var Mustache = require('mustache');
|
||||
|
||||
var app = express();
|
||||
var staticDir = express.static;
|
||||
var server = http.createServer(app);
|
||||
|
||||
io = io(server);
|
||||
|
||||
var opts = {
|
||||
port : 1947,
|
||||
baseDir : __dirname + '/../../'
|
||||
};
|
||||
|
||||
io.on( 'connection', function( socket ) {
|
||||
|
||||
socket.on( 'new-subscriber', function( data ) {
|
||||
socket.broadcast.emit( 'new-subscriber', data );
|
||||
});
|
||||
|
||||
socket.on( 'statechanged', function( data ) {
|
||||
delete data.state.overview;
|
||||
socket.broadcast.emit( 'statechanged', data );
|
||||
});
|
||||
|
||||
socket.on( 'statechanged-speaker', function( data ) {
|
||||
delete data.state.overview;
|
||||
socket.broadcast.emit( 'statechanged-speaker', data );
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
[ 'css', 'js', 'images', 'plugin', 'lib' ].forEach( function( dir ) {
|
||||
app.use( '/' + dir, staticDir( opts.baseDir + dir ) );
|
||||
});
|
||||
|
||||
app.get('/', function( req, res ) {
|
||||
|
||||
res.writeHead( 200, { 'Content-Type': 'text/html' } );
|
||||
fs.createReadStream( opts.baseDir + '/index.html' ).pipe( res );
|
||||
|
||||
});
|
||||
|
||||
app.get( '/notes/:socketId', function( req, res ) {
|
||||
|
||||
fs.readFile( opts.baseDir + 'plugin/notes-server/notes.html', function( err, data ) {
|
||||
res.send( Mustache.to_html( data.toString(), {
|
||||
socketId : req.params.socketId
|
||||
}));
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// Actually listen
|
||||
server.listen( opts.port || null );
|
||||
|
||||
var brown = '\033[33m',
|
||||
green = '\033[32m',
|
||||
reset = '\033[0m';
|
||||
|
||||
var slidesLocation = 'http://localhost' + ( opts.port ? ( ':' + opts.port ) : '' );
|
||||
|
||||
console.log( brown + 'reveal.js - Speaker Notes' + reset );
|
||||
console.log( '1. Open the slides at ' + green + slidesLocation + reset );
|
||||
console.log( '2. Click on the link in your JS console to go to the notes page' );
|
||||
console.log( '3. Advance through your slides and your notes will advance automatically' );
|
||||
@ -1,585 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>reveal.js - Slide Notes</title>
|
||||
|
||||
<style>
|
||||
body {
|
||||
font-family: Helvetica;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#current-slide,
|
||||
#upcoming-slide,
|
||||
#speaker-controls {
|
||||
padding: 6px;
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
}
|
||||
|
||||
#current-slide iframe,
|
||||
#upcoming-slide iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
#current-slide .label,
|
||||
#upcoming-slide .label {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.overlay-element {
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
padding: 0 10px;
|
||||
text-shadow: none;
|
||||
background: rgba( 220, 220, 220, 0.8 );
|
||||
color: #222;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.overlay-element.interactive:hover {
|
||||
background: rgba( 220, 220, 220, 1 );
|
||||
}
|
||||
|
||||
#current-slide {
|
||||
position: absolute;
|
||||
width: 60%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
#upcoming-slide {
|
||||
position: absolute;
|
||||
width: 40%;
|
||||
height: 40%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* Speaker controls */
|
||||
#speaker-controls {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
right: 0;
|
||||
width: 40%;
|
||||
height: 60%;
|
||||
overflow: auto;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.speaker-controls-time.hidden,
|
||||
.speaker-controls-notes.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.speaker-controls-time .label,
|
||||
.speaker-controls-notes .label {
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
font-size: 0.66em;
|
||||
color: #666;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.speaker-controls-time {
|
||||
border-bottom: 1px solid rgba( 200, 200, 200, 0.5 );
|
||||
margin-bottom: 10px;
|
||||
padding: 10px 16px;
|
||||
padding-bottom: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.speaker-controls-time .reset-button {
|
||||
opacity: 0;
|
||||
float: right;
|
||||
color: #666;
|
||||
text-decoration: none;
|
||||
}
|
||||
.speaker-controls-time:hover .reset-button {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.speaker-controls-time .timer,
|
||||
.speaker-controls-time .clock {
|
||||
width: 50%;
|
||||
font-size: 1.9em;
|
||||
}
|
||||
|
||||
.speaker-controls-time .timer {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.speaker-controls-time .clock {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.speaker-controls-time span.mute {
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.speaker-controls-notes {
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
.speaker-controls-notes .value {
|
||||
margin-top: 5px;
|
||||
line-height: 1.4;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
/* Layout selector */
|
||||
#speaker-layout {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
color: #222;
|
||||
z-index: 10;
|
||||
}
|
||||
#speaker-layout select {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border: 0;
|
||||
box-shadow: 0;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
|
||||
font-size: 1em;
|
||||
background-color: transparent;
|
||||
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
#speaker-layout select:focus {
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* Speaker layout: Wide */
|
||||
body[data-speaker-layout="wide"] #current-slide,
|
||||
body[data-speaker-layout="wide"] #upcoming-slide {
|
||||
width: 50%;
|
||||
height: 45%;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="wide"] #current-slide {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="wide"] #upcoming-slide {
|
||||
top: 0;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="wide"] #speaker-controls {
|
||||
top: 45%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
/* Speaker layout: Tall */
|
||||
body[data-speaker-layout="tall"] #current-slide,
|
||||
body[data-speaker-layout="tall"] #upcoming-slide {
|
||||
width: 45%;
|
||||
height: 50%;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="tall"] #current-slide {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="tall"] #upcoming-slide {
|
||||
top: 50%;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="tall"] #speaker-controls {
|
||||
padding-top: 40px;
|
||||
top: 0;
|
||||
left: 45%;
|
||||
width: 55%;
|
||||
height: 100%;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
/* Speaker layout: Notes only */
|
||||
body[data-speaker-layout="notes-only"] #current-slide,
|
||||
body[data-speaker-layout="notes-only"] #upcoming-slide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="notes-only"] #speaker-controls {
|
||||
padding-top: 40px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="current-slide"></div>
|
||||
<div id="upcoming-slide"><span class="overlay-element label">Upcoming</span></div>
|
||||
<div id="speaker-controls">
|
||||
<div class="speaker-controls-time">
|
||||
<h4 class="label">Time <span class="reset-button">Click to Reset</span></h4>
|
||||
<div class="clock">
|
||||
<span class="clock-value">0:00 AM</span>
|
||||
</div>
|
||||
<div class="timer">
|
||||
<span class="hours-value">00</span><span class="minutes-value">:00</span><span class="seconds-value">:00</span>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
|
||||
<div class="speaker-controls-notes hidden">
|
||||
<h4 class="label">Notes</h4>
|
||||
<div class="value"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="speaker-layout" class="overlay-element interactive">
|
||||
<span class="speaker-layout-label"></span>
|
||||
<select class="speaker-layout-dropdown"></select>
|
||||
</div>
|
||||
|
||||
<script src="/socket.io/socket.io.js"></script>
|
||||
<script src="/plugin/markdown/marked.js"></script>
|
||||
|
||||
<script>
|
||||
(function() {
|
||||
|
||||
var notes,
|
||||
notesValue,
|
||||
currentState,
|
||||
currentSlide,
|
||||
upcomingSlide,
|
||||
layoutLabel,
|
||||
layoutDropdown,
|
||||
connected = false;
|
||||
|
||||
var socket = io.connect( window.location.origin ),
|
||||
socketId = '{{socketId}}';
|
||||
|
||||
var SPEAKER_LAYOUTS = {
|
||||
'default': 'Default',
|
||||
'wide': 'Wide',
|
||||
'tall': 'Tall',
|
||||
'notes-only': 'Notes only'
|
||||
};
|
||||
|
||||
socket.on( 'statechanged', function( data ) {
|
||||
|
||||
// ignore data from sockets that aren't ours
|
||||
if( data.socketId !== socketId ) { return; }
|
||||
|
||||
if( connected === false ) {
|
||||
connected = true;
|
||||
|
||||
setupKeyboard();
|
||||
setupNotes();
|
||||
setupTimer();
|
||||
|
||||
}
|
||||
|
||||
handleStateMessage( data );
|
||||
|
||||
} );
|
||||
|
||||
setupLayout();
|
||||
|
||||
// Load our presentation iframes
|
||||
setupIframes();
|
||||
|
||||
// Once the iframes have loaded, emit a signal saying there's
|
||||
// a new subscriber which will trigger a 'statechanged'
|
||||
// message to be sent back
|
||||
window.addEventListener( 'message', function( event ) {
|
||||
|
||||
var data = JSON.parse( event.data );
|
||||
|
||||
if( data && data.namespace === 'reveal' ) {
|
||||
if( /ready/.test( data.eventName ) ) {
|
||||
socket.emit( 'new-subscriber', { socketId: socketId } );
|
||||
}
|
||||
}
|
||||
|
||||
// Messages sent by reveal.js inside of the current slide preview
|
||||
if( data && data.namespace === 'reveal' ) {
|
||||
if( /slidechanged|fragmentshown|fragmenthidden|overviewshown|overviewhidden|paused|resumed/.test( data.eventName ) && currentState !== JSON.stringify( data.state ) ) {
|
||||
socket.emit( 'statechanged-speaker', { state: data.state } );
|
||||
}
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
/**
|
||||
* Called when the main window sends an updated state.
|
||||
*/
|
||||
function handleStateMessage( data ) {
|
||||
|
||||
// Store the most recently set state to avoid circular loops
|
||||
// applying the same state
|
||||
currentState = JSON.stringify( data.state );
|
||||
|
||||
// No need for updating the notes in case of fragment changes
|
||||
if ( data.notes ) {
|
||||
notes.classList.remove( 'hidden' );
|
||||
if( data.markdown ) {
|
||||
notesValue.innerHTML = marked( data.notes );
|
||||
}
|
||||
else {
|
||||
notesValue.innerHTML = data.notes;
|
||||
}
|
||||
}
|
||||
else {
|
||||
notes.classList.add( 'hidden' );
|
||||
}
|
||||
|
||||
// Update the note slides
|
||||
currentSlide.contentWindow.postMessage( JSON.stringify({ method: 'setState', args: [ data.state ] }), '*' );
|
||||
upcomingSlide.contentWindow.postMessage( JSON.stringify({ method: 'setState', args: [ data.state ] }), '*' );
|
||||
upcomingSlide.contentWindow.postMessage( JSON.stringify({ method: 'next' }), '*' );
|
||||
|
||||
}
|
||||
|
||||
// Limit to max one state update per X ms
|
||||
handleStateMessage = debounce( handleStateMessage, 200 );
|
||||
|
||||
/**
|
||||
* Forward keyboard events to the current slide window.
|
||||
* This enables keyboard events to work even if focus
|
||||
* isn't set on the current slide iframe.
|
||||
*/
|
||||
function setupKeyboard() {
|
||||
|
||||
document.addEventListener( 'keydown', function( event ) {
|
||||
currentSlide.contentWindow.postMessage( JSON.stringify({ method: 'triggerKey', args: [ event.keyCode ] }), '*' );
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates the preview iframes.
|
||||
*/
|
||||
function setupIframes() {
|
||||
|
||||
var params = [
|
||||
'receiver',
|
||||
'progress=false',
|
||||
'history=false',
|
||||
'transition=none',
|
||||
'backgroundTransition=none'
|
||||
].join( '&' );
|
||||
|
||||
var currentURL = '/?' + params + '&postMessageEvents=true';
|
||||
var upcomingURL = '/?' + params + '&controls=false';
|
||||
|
||||
currentSlide = document.createElement( 'iframe' );
|
||||
currentSlide.setAttribute( 'width', 1280 );
|
||||
currentSlide.setAttribute( 'height', 1024 );
|
||||
currentSlide.setAttribute( 'src', currentURL );
|
||||
document.querySelector( '#current-slide' ).appendChild( currentSlide );
|
||||
|
||||
upcomingSlide = document.createElement( 'iframe' );
|
||||
upcomingSlide.setAttribute( 'width', 640 );
|
||||
upcomingSlide.setAttribute( 'height', 512 );
|
||||
upcomingSlide.setAttribute( 'src', upcomingURL );
|
||||
document.querySelector( '#upcoming-slide' ).appendChild( upcomingSlide );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Setup the notes UI.
|
||||
*/
|
||||
function setupNotes() {
|
||||
|
||||
notes = document.querySelector( '.speaker-controls-notes' );
|
||||
notesValue = document.querySelector( '.speaker-controls-notes .value' );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Create the timer and clock and start updating them
|
||||
* at an interval.
|
||||
*/
|
||||
function setupTimer() {
|
||||
|
||||
var start = new Date(),
|
||||
timeEl = document.querySelector( '.speaker-controls-time' ),
|
||||
clockEl = timeEl.querySelector( '.clock-value' ),
|
||||
hoursEl = timeEl.querySelector( '.hours-value' ),
|
||||
minutesEl = timeEl.querySelector( '.minutes-value' ),
|
||||
secondsEl = timeEl.querySelector( '.seconds-value' );
|
||||
|
||||
function _updateTimer() {
|
||||
|
||||
var diff, hours, minutes, seconds,
|
||||
now = new Date();
|
||||
|
||||
diff = now.getTime() - start.getTime();
|
||||
hours = Math.floor( diff / ( 1000 * 60 * 60 ) );
|
||||
minutes = Math.floor( ( diff / ( 1000 * 60 ) ) % 60 );
|
||||
seconds = Math.floor( ( diff / 1000 ) % 60 );
|
||||
|
||||
clockEl.innerHTML = now.toLocaleTimeString( 'en-US', { hour12: true, hour: '2-digit', minute:'2-digit' } );
|
||||
hoursEl.innerHTML = zeroPadInteger( hours );
|
||||
hoursEl.className = hours > 0 ? '' : 'mute';
|
||||
minutesEl.innerHTML = ':' + zeroPadInteger( minutes );
|
||||
minutesEl.className = minutes > 0 ? '' : 'mute';
|
||||
secondsEl.innerHTML = ':' + zeroPadInteger( seconds );
|
||||
|
||||
}
|
||||
|
||||
// Update once directly
|
||||
_updateTimer();
|
||||
|
||||
// Then update every second
|
||||
setInterval( _updateTimer, 1000 );
|
||||
|
||||
timeEl.addEventListener( 'click', function() {
|
||||
start = new Date();
|
||||
_updateTimer();
|
||||
return false;
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets up the speaker view layout and layout selector.
|
||||
*/
|
||||
function setupLayout() {
|
||||
|
||||
layoutDropdown = document.querySelector( '.speaker-layout-dropdown' );
|
||||
layoutLabel = document.querySelector( '.speaker-layout-label' );
|
||||
|
||||
// Render the list of available layouts
|
||||
for( var id in SPEAKER_LAYOUTS ) {
|
||||
var option = document.createElement( 'option' );
|
||||
option.setAttribute( 'value', id );
|
||||
option.textContent = SPEAKER_LAYOUTS[ id ];
|
||||
layoutDropdown.appendChild( option );
|
||||
}
|
||||
|
||||
// Monitor the dropdown for changes
|
||||
layoutDropdown.addEventListener( 'change', function( event ) {
|
||||
|
||||
setLayout( layoutDropdown.value );
|
||||
|
||||
}, false );
|
||||
|
||||
// Restore any currently persisted layout
|
||||
setLayout( getLayout() );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets a new speaker view layout. The layout is persisted
|
||||
* in local storage.
|
||||
*/
|
||||
function setLayout( value ) {
|
||||
|
||||
var title = SPEAKER_LAYOUTS[ value ];
|
||||
|
||||
layoutLabel.innerHTML = 'Layout' + ( title ? ( ': ' + title ) : '' );
|
||||
layoutDropdown.value = value;
|
||||
|
||||
document.body.setAttribute( 'data-speaker-layout', value );
|
||||
|
||||
// Persist locally
|
||||
if( window.localStorage ) {
|
||||
window.localStorage.setItem( 'reveal-speaker-layout', value );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the ID of the most recently set speaker layout
|
||||
* or our default layout if none has been set.
|
||||
*/
|
||||
function getLayout() {
|
||||
|
||||
if( window.localStorage ) {
|
||||
var layout = window.localStorage.getItem( 'reveal-speaker-layout' );
|
||||
if( layout ) {
|
||||
return layout;
|
||||
}
|
||||
}
|
||||
|
||||
// Default to the first record in the layouts hash
|
||||
for( var id in SPEAKER_LAYOUTS ) {
|
||||
return id;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function zeroPadInteger( num ) {
|
||||
|
||||
var str = '00' + parseInt( num );
|
||||
return str.substring( str.length - 2 );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Limits the frequency at which a function can be called.
|
||||
*/
|
||||
function debounce( fn, ms ) {
|
||||
|
||||
var lastTime = 0,
|
||||
timeout;
|
||||
|
||||
return function() {
|
||||
|
||||
var args = arguments;
|
||||
var context = this;
|
||||
|
||||
clearTimeout( timeout );
|
||||
|
||||
var timeSinceLastCall = Date.now() - lastTime;
|
||||
if( timeSinceLastCall > ms ) {
|
||||
fn.apply( context, args );
|
||||
lastTime = Date.now();
|
||||
}
|
||||
else {
|
||||
timeout = setTimeout( function() {
|
||||
fn.apply( context, args );
|
||||
lastTime = Date.now();
|
||||
}, ms - timeSinceLastCall );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
})();
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,792 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>reveal.js - Slide Notes</title>
|
||||
|
||||
<style>
|
||||
body {
|
||||
font-family: Helvetica;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#current-slide,
|
||||
#upcoming-slide,
|
||||
#speaker-controls {
|
||||
padding: 6px;
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
}
|
||||
|
||||
#current-slide iframe,
|
||||
#upcoming-slide iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
#current-slide .label,
|
||||
#upcoming-slide .label {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#connection-status {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 20;
|
||||
padding: 30% 20% 20% 20%;
|
||||
font-size: 18px;
|
||||
color: #222;
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.overlay-element {
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
padding: 0 10px;
|
||||
text-shadow: none;
|
||||
background: rgba( 220, 220, 220, 0.8 );
|
||||
color: #222;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.overlay-element.interactive:hover {
|
||||
background: rgba( 220, 220, 220, 1 );
|
||||
}
|
||||
|
||||
#current-slide {
|
||||
position: absolute;
|
||||
width: 60%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
#upcoming-slide {
|
||||
position: absolute;
|
||||
width: 40%;
|
||||
height: 40%;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* Speaker controls */
|
||||
#speaker-controls {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
right: 0;
|
||||
width: 40%;
|
||||
height: 60%;
|
||||
overflow: auto;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.speaker-controls-time.hidden,
|
||||
.speaker-controls-notes.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.speaker-controls-time .label,
|
||||
.speaker-controls-pace .label,
|
||||
.speaker-controls-notes .label {
|
||||
text-transform: uppercase;
|
||||
font-weight: normal;
|
||||
font-size: 0.66em;
|
||||
color: #666;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.speaker-controls-time, .speaker-controls-pace {
|
||||
border-bottom: 1px solid rgba( 200, 200, 200, 0.5 );
|
||||
margin-bottom: 10px;
|
||||
padding: 10px 16px;
|
||||
padding-bottom: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.speaker-controls-time .reset-button {
|
||||
opacity: 0;
|
||||
float: right;
|
||||
color: #666;
|
||||
text-decoration: none;
|
||||
}
|
||||
.speaker-controls-time:hover .reset-button {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.speaker-controls-time .timer,
|
||||
.speaker-controls-time .clock {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.speaker-controls-time .timer,
|
||||
.speaker-controls-time .clock,
|
||||
.speaker-controls-time .pacing .hours-value,
|
||||
.speaker-controls-time .pacing .minutes-value,
|
||||
.speaker-controls-time .pacing .seconds-value {
|
||||
font-size: 1.9em;
|
||||
}
|
||||
|
||||
.speaker-controls-time .timer {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.speaker-controls-time .clock {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.speaker-controls-time span.mute {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.speaker-controls-time .pacing-title {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.speaker-controls-time .pacing.ahead {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.speaker-controls-time .pacing.on-track {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.speaker-controls-time .pacing.behind {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.speaker-controls-notes {
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
.speaker-controls-notes .value {
|
||||
margin-top: 5px;
|
||||
line-height: 1.4;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
/* Layout selector */
|
||||
#speaker-layout {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
color: #222;
|
||||
z-index: 10;
|
||||
}
|
||||
#speaker-layout select {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border: 0;
|
||||
box-shadow: 0;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
|
||||
font-size: 1em;
|
||||
background-color: transparent;
|
||||
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
#speaker-layout select:focus {
|
||||
outline: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* Speaker layout: Wide */
|
||||
body[data-speaker-layout="wide"] #current-slide,
|
||||
body[data-speaker-layout="wide"] #upcoming-slide {
|
||||
width: 50%;
|
||||
height: 45%;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="wide"] #current-slide {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="wide"] #upcoming-slide {
|
||||
top: 0;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="wide"] #speaker-controls {
|
||||
top: 45%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
/* Speaker layout: Tall */
|
||||
body[data-speaker-layout="tall"] #current-slide,
|
||||
body[data-speaker-layout="tall"] #upcoming-slide {
|
||||
width: 45%;
|
||||
height: 50%;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="tall"] #current-slide {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="tall"] #upcoming-slide {
|
||||
top: 50%;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="tall"] #speaker-controls {
|
||||
padding-top: 40px;
|
||||
top: 0;
|
||||
left: 45%;
|
||||
width: 55%;
|
||||
height: 100%;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
/* Speaker layout: Notes only */
|
||||
body[data-speaker-layout="notes-only"] #current-slide,
|
||||
body[data-speaker-layout="notes-only"] #upcoming-slide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body[data-speaker-layout="notes-only"] #speaker-controls {
|
||||
padding-top: 40px;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1080px) {
|
||||
body[data-speaker-layout="default"] #speaker-controls {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
body[data-speaker-layout="default"] #speaker-controls {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
body[data-speaker-layout="default"] #speaker-controls {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="connection-status">Loading speaker view...</div>
|
||||
|
||||
<div id="current-slide"></div>
|
||||
<div id="upcoming-slide"><span class="overlay-element label">Upcoming</span></div>
|
||||
<div id="speaker-controls">
|
||||
<div class="speaker-controls-time">
|
||||
<h4 class="label">Time <span class="reset-button">Click to Reset</span></h4>
|
||||
<div class="clock">
|
||||
<span class="clock-value">0:00 AM</span>
|
||||
</div>
|
||||
<div class="timer">
|
||||
<span class="hours-value">00</span><span class="minutes-value">:00</span><span class="seconds-value">:00</span>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
<h4 class="label pacing-title" style="display: none">Pacing – Time to finish current slide</h4>
|
||||
<div class="pacing" style="display: none">
|
||||
<span class="hours-value">00</span><span class="minutes-value">:00</span><span class="seconds-value">:00</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="speaker-controls-notes hidden">
|
||||
<h4 class="label">Notes</h4>
|
||||
<div class="value"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="speaker-layout" class="overlay-element interactive">
|
||||
<span class="speaker-layout-label"></span>
|
||||
<select class="speaker-layout-dropdown"></select>
|
||||
</div>
|
||||
|
||||
<script src="../../plugin/markdown/marked.js"></script>
|
||||
<script>
|
||||
|
||||
(function() {
|
||||
|
||||
var notes,
|
||||
notesValue,
|
||||
currentState,
|
||||
currentSlide,
|
||||
upcomingSlide,
|
||||
layoutLabel,
|
||||
layoutDropdown,
|
||||
connected = false;
|
||||
|
||||
var SPEAKER_LAYOUTS = {
|
||||
'default': 'Default',
|
||||
'wide': 'Wide',
|
||||
'tall': 'Tall',
|
||||
'notes-only': 'Notes only'
|
||||
};
|
||||
|
||||
setupLayout();
|
||||
|
||||
var connectionStatus = document.querySelector( '#connection-status' );
|
||||
var connectionTimeout = setTimeout( function() {
|
||||
connectionStatus.innerHTML = 'Error connecting to main window.<br>Please try closing and reopening the speaker view.';
|
||||
}, 5000 );
|
||||
|
||||
window.addEventListener( 'message', function( event ) {
|
||||
|
||||
clearTimeout( connectionTimeout );
|
||||
connectionStatus.style.display = 'none';
|
||||
|
||||
var data = JSON.parse( event.data );
|
||||
|
||||
// The overview mode is only useful to the reveal.js instance
|
||||
// where navigation occurs so we don't sync it
|
||||
if( data.state ) delete data.state.overview;
|
||||
|
||||
// Messages sent by the notes plugin inside of the main window
|
||||
if( data && data.namespace === 'reveal-notes' ) {
|
||||
if( data.type === 'connect' ) {
|
||||
handleConnectMessage( data );
|
||||
}
|
||||
else if( data.type === 'state' ) {
|
||||
handleStateMessage( data );
|
||||
}
|
||||
}
|
||||
// Messages sent by the reveal.js inside of the current slide preview
|
||||
else if( data && data.namespace === 'reveal' ) {
|
||||
if( /ready/.test( data.eventName ) ) {
|
||||
// Send a message back to notify that the handshake is complete
|
||||
window.opener.postMessage( JSON.stringify({ namespace: 'reveal-notes', type: 'connected'} ), '*' );
|
||||
}
|
||||
else if( /slidechanged|fragmentshown|fragmenthidden|paused|resumed/.test( data.eventName ) && currentState !== JSON.stringify( data.state ) ) {
|
||||
|
||||
window.opener.postMessage( JSON.stringify({ method: 'setState', args: [ data.state ]} ), '*' );
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
/**
|
||||
* Called when the main window is trying to establish a
|
||||
* connection.
|
||||
*/
|
||||
function handleConnectMessage( data ) {
|
||||
|
||||
if( connected === false ) {
|
||||
connected = true;
|
||||
|
||||
setupIframes( data );
|
||||
setupKeyboard();
|
||||
setupNotes();
|
||||
setupTimer();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Called when the main window sends an updated state.
|
||||
*/
|
||||
function handleStateMessage( data ) {
|
||||
|
||||
// Store the most recently set state to avoid circular loops
|
||||
// applying the same state
|
||||
currentState = JSON.stringify( data.state );
|
||||
|
||||
// No need for updating the notes in case of fragment changes
|
||||
if ( data.notes ) {
|
||||
notes.classList.remove( 'hidden' );
|
||||
notesValue.style.whiteSpace = data.whitespace;
|
||||
if( data.markdown ) {
|
||||
notesValue.innerHTML = marked( data.notes );
|
||||
}
|
||||
else {
|
||||
notesValue.innerHTML = data.notes;
|
||||
}
|
||||
}
|
||||
else {
|
||||
notes.classList.add( 'hidden' );
|
||||
}
|
||||
|
||||
// Update the note slides
|
||||
currentSlide.contentWindow.postMessage( JSON.stringify({ method: 'setState', args: [ data.state ] }), '*' );
|
||||
upcomingSlide.contentWindow.postMessage( JSON.stringify({ method: 'setState', args: [ data.state ] }), '*' );
|
||||
upcomingSlide.contentWindow.postMessage( JSON.stringify({ method: 'next' }), '*' );
|
||||
|
||||
}
|
||||
|
||||
// Limit to max one state update per X ms
|
||||
handleStateMessage = debounce( handleStateMessage, 200 );
|
||||
|
||||
/**
|
||||
* Forward keyboard events to the current slide window.
|
||||
* This enables keyboard events to work even if focus
|
||||
* isn't set on the current slide iframe.
|
||||
*
|
||||
* Block F5 default handling, it reloads and disconnects
|
||||
* the speaker notes window.
|
||||
*/
|
||||
function setupKeyboard() {
|
||||
|
||||
document.addEventListener( 'keydown', function( event ) {
|
||||
if( event.keyCode === 116 || ( event.metaKey && event.keyCode === 82 ) ) {
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
currentSlide.contentWindow.postMessage( JSON.stringify({ method: 'triggerKey', args: [ event.keyCode ] }), '*' );
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates the preview iframes.
|
||||
*/
|
||||
function setupIframes( data ) {
|
||||
|
||||
var params = [
|
||||
'receiver',
|
||||
'progress=false',
|
||||
'history=false',
|
||||
'transition=none',
|
||||
'autoSlide=0',
|
||||
'backgroundTransition=none'
|
||||
].join( '&' );
|
||||
|
||||
var urlSeparator = /\?/.test(data.url) ? '&' : '?';
|
||||
var hash = '#/' + data.state.indexh + '/' + data.state.indexv;
|
||||
var currentURL = data.url + urlSeparator + params + '&postMessageEvents=true' + hash;
|
||||
var upcomingURL = data.url + urlSeparator + params + '&controls=false' + hash;
|
||||
|
||||
currentSlide = document.createElement( 'iframe' );
|
||||
currentSlide.setAttribute( 'width', 1280 );
|
||||
currentSlide.setAttribute( 'height', 1024 );
|
||||
currentSlide.setAttribute( 'src', currentURL );
|
||||
document.querySelector( '#current-slide' ).appendChild( currentSlide );
|
||||
|
||||
upcomingSlide = document.createElement( 'iframe' );
|
||||
upcomingSlide.setAttribute( 'width', 640 );
|
||||
upcomingSlide.setAttribute( 'height', 512 );
|
||||
upcomingSlide.setAttribute( 'src', upcomingURL );
|
||||
document.querySelector( '#upcoming-slide' ).appendChild( upcomingSlide );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Setup the notes UI.
|
||||
*/
|
||||
function setupNotes() {
|
||||
|
||||
notes = document.querySelector( '.speaker-controls-notes' );
|
||||
notesValue = document.querySelector( '.speaker-controls-notes .value' );
|
||||
|
||||
}
|
||||
|
||||
function getTimings() {
|
||||
|
||||
var slides = Reveal.getSlides();
|
||||
var defaultTiming = Reveal.getConfig().defaultTiming;
|
||||
if (defaultTiming == null) {
|
||||
return null;
|
||||
}
|
||||
var timings = [];
|
||||
for ( var i in slides ) {
|
||||
var slide = slides[i];
|
||||
var timing = defaultTiming;
|
||||
if( slide.hasAttribute( 'data-timing' )) {
|
||||
var t = slide.getAttribute( 'data-timing' );
|
||||
timing = parseInt(t);
|
||||
if( isNaN(timing) ) {
|
||||
console.warn("Could not parse timing '" + t + "' of slide " + i + "; using default of " + defaultTiming);
|
||||
timing = defaultTiming;
|
||||
}
|
||||
}
|
||||
timings.push(timing);
|
||||
}
|
||||
return timings;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the number of seconds allocated for presenting
|
||||
* all slides up to and including this one.
|
||||
*/
|
||||
function getTimeAllocated(timings) {
|
||||
|
||||
var slides = Reveal.getSlides();
|
||||
var allocated = 0;
|
||||
var currentSlide = Reveal.getSlidePastCount();
|
||||
for (var i in slides.slice(0, currentSlide + 1)) {
|
||||
allocated += timings[i];
|
||||
}
|
||||
return allocated;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Create the timer and clock and start updating them
|
||||
* at an interval.
|
||||
*/
|
||||
function setupTimer() {
|
||||
|
||||
var start = new Date(),
|
||||
timeEl = document.querySelector( '.speaker-controls-time' ),
|
||||
clockEl = timeEl.querySelector( '.clock-value' ),
|
||||
hoursEl = timeEl.querySelector( '.hours-value' ),
|
||||
minutesEl = timeEl.querySelector( '.minutes-value' ),
|
||||
secondsEl = timeEl.querySelector( '.seconds-value' ),
|
||||
pacingTitleEl = timeEl.querySelector( '.pacing-title' ),
|
||||
pacingEl = timeEl.querySelector( '.pacing' ),
|
||||
pacingHoursEl = pacingEl.querySelector( '.hours-value' ),
|
||||
pacingMinutesEl = pacingEl.querySelector( '.minutes-value' ),
|
||||
pacingSecondsEl = pacingEl.querySelector( '.seconds-value' );
|
||||
|
||||
var timings = getTimings();
|
||||
if (timings !== null) {
|
||||
pacingTitleEl.style.removeProperty('display');
|
||||
pacingEl.style.removeProperty('display');
|
||||
}
|
||||
|
||||
function _displayTime( hrEl, minEl, secEl, time) {
|
||||
|
||||
var sign = Math.sign(time) == -1 ? "-" : "";
|
||||
time = Math.abs(Math.round(time / 1000));
|
||||
var seconds = time % 60;
|
||||
var minutes = Math.floor( time / 60 ) % 60 ;
|
||||
var hours = Math.floor( time / ( 60 * 60 )) ;
|
||||
hrEl.innerHTML = sign + zeroPadInteger( hours );
|
||||
if (hours == 0) {
|
||||
hrEl.classList.add( 'mute' );
|
||||
}
|
||||
else {
|
||||
hrEl.classList.remove( 'mute' );
|
||||
}
|
||||
minEl.innerHTML = ':' + zeroPadInteger( minutes );
|
||||
if (hours == 0 && minutes == 0) {
|
||||
minEl.classList.add( 'mute' );
|
||||
}
|
||||
else {
|
||||
minEl.classList.remove( 'mute' );
|
||||
}
|
||||
secEl.innerHTML = ':' + zeroPadInteger( seconds );
|
||||
}
|
||||
|
||||
function _updateTimer() {
|
||||
|
||||
var diff, hours, minutes, seconds,
|
||||
now = new Date();
|
||||
|
||||
diff = now.getTime() - start.getTime();
|
||||
|
||||
clockEl.innerHTML = now.toLocaleTimeString( 'en-US', { hour12: true, hour: '2-digit', minute:'2-digit' } );
|
||||
_displayTime( hoursEl, minutesEl, secondsEl, diff );
|
||||
if (timings !== null) {
|
||||
_updatePacing(diff);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function _updatePacing(diff) {
|
||||
|
||||
var slideEndTiming = getTimeAllocated(timings) * 1000;
|
||||
var currentSlide = Reveal.getSlidePastCount();
|
||||
var currentSlideTiming = timings[currentSlide] * 1000;
|
||||
var timeLeftCurrentSlide = slideEndTiming - diff;
|
||||
if (timeLeftCurrentSlide < 0) {
|
||||
pacingEl.className = 'pacing behind';
|
||||
}
|
||||
else if (timeLeftCurrentSlide < currentSlideTiming) {
|
||||
pacingEl.className = 'pacing on-track';
|
||||
}
|
||||
else {
|
||||
pacingEl.className = 'pacing ahead';
|
||||
}
|
||||
_displayTime( pacingHoursEl, pacingMinutesEl, pacingSecondsEl, timeLeftCurrentSlide );
|
||||
|
||||
}
|
||||
|
||||
// Update once directly
|
||||
_updateTimer();
|
||||
|
||||
// Then update every second
|
||||
setInterval( _updateTimer, 1000 );
|
||||
|
||||
function _resetTimer() {
|
||||
|
||||
if (timings == null) {
|
||||
start = new Date();
|
||||
}
|
||||
else {
|
||||
// Reset timer to beginning of current slide
|
||||
var slideEndTiming = getTimeAllocated(timings) * 1000;
|
||||
var currentSlide = Reveal.getSlidePastCount();
|
||||
var currentSlideTiming = timings[currentSlide] * 1000;
|
||||
var previousSlidesTiming = slideEndTiming - currentSlideTiming;
|
||||
var now = new Date();
|
||||
start = new Date(now.getTime() - previousSlidesTiming);
|
||||
}
|
||||
_updateTimer();
|
||||
|
||||
}
|
||||
|
||||
timeEl.addEventListener( 'click', function() {
|
||||
_resetTimer();
|
||||
return false;
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets up the speaker view layout and layout selector.
|
||||
*/
|
||||
function setupLayout() {
|
||||
|
||||
layoutDropdown = document.querySelector( '.speaker-layout-dropdown' );
|
||||
layoutLabel = document.querySelector( '.speaker-layout-label' );
|
||||
|
||||
// Render the list of available layouts
|
||||
for( var id in SPEAKER_LAYOUTS ) {
|
||||
var option = document.createElement( 'option' );
|
||||
option.setAttribute( 'value', id );
|
||||
option.textContent = SPEAKER_LAYOUTS[ id ];
|
||||
layoutDropdown.appendChild( option );
|
||||
}
|
||||
|
||||
// Monitor the dropdown for changes
|
||||
layoutDropdown.addEventListener( 'change', function( event ) {
|
||||
|
||||
setLayout( layoutDropdown.value );
|
||||
|
||||
}, false );
|
||||
|
||||
// Restore any currently persisted layout
|
||||
setLayout( getLayout() );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets a new speaker view layout. The layout is persisted
|
||||
* in local storage.
|
||||
*/
|
||||
function setLayout( value ) {
|
||||
|
||||
var title = SPEAKER_LAYOUTS[ value ];
|
||||
|
||||
layoutLabel.innerHTML = 'Layout' + ( title ? ( ': ' + title ) : '' );
|
||||
layoutDropdown.value = value;
|
||||
|
||||
document.body.setAttribute( 'data-speaker-layout', value );
|
||||
|
||||
// Persist locally
|
||||
if( supportsLocalStorage() ) {
|
||||
window.localStorage.setItem( 'reveal-speaker-layout', value );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the ID of the most recently set speaker layout
|
||||
* or our default layout if none has been set.
|
||||
*/
|
||||
function getLayout() {
|
||||
|
||||
if( supportsLocalStorage() ) {
|
||||
var layout = window.localStorage.getItem( 'reveal-speaker-layout' );
|
||||
if( layout ) {
|
||||
return layout;
|
||||
}
|
||||
}
|
||||
|
||||
// Default to the first record in the layouts hash
|
||||
for( var id in SPEAKER_LAYOUTS ) {
|
||||
return id;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function supportsLocalStorage() {
|
||||
|
||||
try {
|
||||
localStorage.setItem('test', 'test');
|
||||
localStorage.removeItem('test');
|
||||
return true;
|
||||
}
|
||||
catch( e ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function zeroPadInteger( num ) {
|
||||
|
||||
var str = '00' + parseInt( num );
|
||||
return str.substring( str.length - 2 );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Limits the frequency at which a function can be called.
|
||||
*/
|
||||
function debounce( fn, ms ) {
|
||||
|
||||
var lastTime = 0,
|
||||
timeout;
|
||||
|
||||
return function() {
|
||||
|
||||
var args = arguments;
|
||||
var context = this;
|
||||
|
||||
clearTimeout( timeout );
|
||||
|
||||
var timeSinceLastCall = Date.now() - lastTime;
|
||||
if( timeSinceLastCall > ms ) {
|
||||
fn.apply( context, args );
|
||||
lastTime = Date.now();
|
||||
}
|
||||
else {
|
||||
timeout = setTimeout( function() {
|
||||
fn.apply( context, args );
|
||||
lastTime = Date.now();
|
||||
}, ms - timeSinceLastCall );
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
})();
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,147 +0,0 @@
|
||||
/**
|
||||
* Handles opening of and synchronization with the reveal.js
|
||||
* notes window.
|
||||
*
|
||||
* Handshake process:
|
||||
* 1. This window posts 'connect' to notes window
|
||||
* - Includes URL of presentation to show
|
||||
* 2. Notes window responds with 'connected' when it is available
|
||||
* 3. This window proceeds to send the current presentation state
|
||||
* to the notes window
|
||||
*/
|
||||
var RevealNotes = (function() {
|
||||
|
||||
function openNotes( notesFilePath ) {
|
||||
|
||||
if( !notesFilePath ) {
|
||||
var jsFileLocation = document.querySelector('script[src$="notes.js"]').src; // this js file path
|
||||
jsFileLocation = jsFileLocation.replace(/notes\.js(\?.*)?$/, ''); // the js folder path
|
||||
notesFilePath = jsFileLocation + 'notes.html';
|
||||
}
|
||||
|
||||
var notesPopup = window.open( notesFilePath, 'reveal.js - Notes', 'width=1100,height=700' );
|
||||
|
||||
if( !notesPopup ) {
|
||||
alert( 'Speaker view popup failed to open. Please make sure popups are allowed and reopen the speaker view.' );
|
||||
return;
|
||||
}
|
||||
|
||||
// Allow popup window access to Reveal API
|
||||
notesPopup.Reveal = window.Reveal;
|
||||
|
||||
/**
|
||||
* Connect to the notes window through a postmessage handshake.
|
||||
* Using postmessage enables us to work in situations where the
|
||||
* origins differ, such as a presentation being opened from the
|
||||
* file system.
|
||||
*/
|
||||
function connect() {
|
||||
// Keep trying to connect until we get a 'connected' message back
|
||||
var connectInterval = setInterval( function() {
|
||||
notesPopup.postMessage( JSON.stringify( {
|
||||
namespace: 'reveal-notes',
|
||||
type: 'connect',
|
||||
url: window.location.protocol + '//' + window.location.host + window.location.pathname + window.location.search,
|
||||
state: Reveal.getState()
|
||||
} ), '*' );
|
||||
}, 500 );
|
||||
|
||||
window.addEventListener( 'message', function( event ) {
|
||||
var data = JSON.parse( event.data );
|
||||
if( data && data.namespace === 'reveal-notes' && data.type === 'connected' ) {
|
||||
clearInterval( connectInterval );
|
||||
onConnected();
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Posts the current slide data to the notes window
|
||||
*/
|
||||
function post( event ) {
|
||||
|
||||
var slideElement = Reveal.getCurrentSlide(),
|
||||
notesElement = slideElement.querySelector( 'aside.notes' ),
|
||||
fragmentElement = slideElement.querySelector( '.current-fragment' );
|
||||
|
||||
var messageData = {
|
||||
namespace: 'reveal-notes',
|
||||
type: 'state',
|
||||
notes: '',
|
||||
markdown: false,
|
||||
whitespace: 'normal',
|
||||
state: Reveal.getState()
|
||||
};
|
||||
|
||||
// Look for notes defined in a slide attribute
|
||||
if( slideElement.hasAttribute( 'data-notes' ) ) {
|
||||
messageData.notes = slideElement.getAttribute( 'data-notes' );
|
||||
messageData.whitespace = 'pre-wrap';
|
||||
}
|
||||
|
||||
// Look for notes defined in a fragment
|
||||
if( fragmentElement ) {
|
||||
var fragmentNotes = fragmentElement.querySelector( 'aside.notes' );
|
||||
if( fragmentNotes ) {
|
||||
notesElement = fragmentNotes;
|
||||
}
|
||||
else if( fragmentElement.hasAttribute( 'data-notes' ) ) {
|
||||
messageData.notes = fragmentElement.getAttribute( 'data-notes' );
|
||||
messageData.whitespace = 'pre-wrap';
|
||||
|
||||
// In case there are slide notes
|
||||
notesElement = null;
|
||||
}
|
||||
}
|
||||
|
||||
// Look for notes defined in an aside element
|
||||
if( notesElement ) {
|
||||
messageData.notes = notesElement.innerHTML;
|
||||
messageData.markdown = typeof notesElement.getAttribute( 'data-markdown' ) === 'string';
|
||||
}
|
||||
|
||||
notesPopup.postMessage( JSON.stringify( messageData ), '*' );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Called once we have established a connection to the notes
|
||||
* window.
|
||||
*/
|
||||
function onConnected() {
|
||||
|
||||
// Monitor events that trigger a change in state
|
||||
Reveal.addEventListener( 'slidechanged', post );
|
||||
Reveal.addEventListener( 'fragmentshown', post );
|
||||
Reveal.addEventListener( 'fragmenthidden', post );
|
||||
Reveal.addEventListener( 'overviewhidden', post );
|
||||
Reveal.addEventListener( 'overviewshown', post );
|
||||
Reveal.addEventListener( 'paused', post );
|
||||
Reveal.addEventListener( 'resumed', post );
|
||||
|
||||
// Post the initial state
|
||||
post();
|
||||
|
||||
}
|
||||
|
||||
connect();
|
||||
|
||||
}
|
||||
|
||||
if( !/receiver/i.test( window.location.search ) ) {
|
||||
|
||||
// If the there's a 'notes' query set, open directly
|
||||
if( window.location.search.match( /(\?|\&)notes/gi ) !== null ) {
|
||||
openNotes();
|
||||
}
|
||||
|
||||
// Open the notes when the 's' key is hit
|
||||
Reveal.addKeyBinding({keyCode: 83, key: 'S', description: 'Speaker notes view'}, function() {
|
||||
openNotes();
|
||||
} );
|
||||
|
||||
}
|
||||
|
||||
return { open: openNotes };
|
||||
|
||||
})();
|
||||
@ -1,67 +0,0 @@
|
||||
/**
|
||||
* phantomjs script for printing presentations to PDF.
|
||||
*
|
||||
* Example:
|
||||
* phantomjs print-pdf.js "http://revealjs.com?print-pdf" reveal-demo.pdf
|
||||
*
|
||||
* @author Manuel Bieh (https://github.com/manuelbieh)
|
||||
* @author Hakim El Hattab (https://github.com/hakimel)
|
||||
* @author Manuel Riezebosch (https://github.com/riezebosch)
|
||||
*/
|
||||
|
||||
// html2pdf.js
|
||||
var system = require( 'system' );
|
||||
|
||||
var probePage = new WebPage();
|
||||
var printPage = new WebPage();
|
||||
|
||||
var inputFile = system.args[1] || 'index.html?print-pdf';
|
||||
var outputFile = system.args[2] || 'slides.pdf';
|
||||
|
||||
if( outputFile.match( /\.pdf$/gi ) === null ) {
|
||||
outputFile += '.pdf';
|
||||
}
|
||||
|
||||
console.log( 'Export PDF: Reading reveal.js config [1/4]' );
|
||||
|
||||
probePage.open( inputFile, function( status ) {
|
||||
|
||||
console.log( 'Export PDF: Preparing print layout [2/4]' );
|
||||
|
||||
var config = probePage.evaluate( function() {
|
||||
return Reveal.getConfig();
|
||||
} );
|
||||
|
||||
if( config ) {
|
||||
|
||||
printPage.paperSize = {
|
||||
width: Math.floor( config.width * ( 1 + config.margin ) ),
|
||||
height: Math.floor( config.height * ( 1 + config.margin ) ),
|
||||
border: 0
|
||||
};
|
||||
|
||||
printPage.open( inputFile, function( status ) {
|
||||
console.log( 'Export PDF: Preparing pdf [3/4]')
|
||||
printPage.evaluate( function() {
|
||||
Reveal.isReady() ? window.callPhantom() : Reveal.addEventListener( 'pdf-ready', window.callPhantom );
|
||||
} );
|
||||
} );
|
||||
|
||||
printPage.onCallback = function( data ) {
|
||||
// For some reason we need to "jump the queue" for syntax highlighting to work.
|
||||
// See: http://stackoverflow.com/a/3580132/129269
|
||||
setTimeout( function() {
|
||||
console.log( 'Export PDF: Writing file [4/4]' );
|
||||
printPage.render( outputFile );
|
||||
console.log( 'Export PDF: Finished successfully!' );
|
||||
phantom.exit();
|
||||
}, 0 );
|
||||
};
|
||||
}
|
||||
else {
|
||||
|
||||
console.log( 'Export PDF: Unable to read reveal.js config. Make sure the input address points to a reveal.js page.' );
|
||||
phantom.exit( 1 );
|
||||
|
||||
}
|
||||
} );
|
||||
@ -1,206 +0,0 @@
|
||||
/*
|
||||
* Handles finding a text string anywhere in the slides and showing the next occurrence to the user
|
||||
* by navigatating to that slide and highlighting it.
|
||||
*
|
||||
* By Jon Snyder <snyder.jon@gmail.com>, February 2013
|
||||
*/
|
||||
|
||||
var RevealSearch = (function() {
|
||||
|
||||
var matchedSlides;
|
||||
var currentMatchedIndex;
|
||||
var searchboxDirty;
|
||||
var myHilitor;
|
||||
|
||||
// Original JavaScript code by Chirp Internet: www.chirp.com.au
|
||||
// Please acknowledge use of this code by including this header.
|
||||
// 2/2013 jon: modified regex to display any match, not restricted to word boundaries.
|
||||
|
||||
function Hilitor(id, tag)
|
||||
{
|
||||
|
||||
var targetNode = document.getElementById(id) || document.body;
|
||||
var hiliteTag = tag || "EM";
|
||||
var skipTags = new RegExp("^(?:" + hiliteTag + "|SCRIPT|FORM)$");
|
||||
var colors = ["#ff6", "#a0ffff", "#9f9", "#f99", "#f6f"];
|
||||
var wordColor = [];
|
||||
var colorIdx = 0;
|
||||
var matchRegex = "";
|
||||
var matchingSlides = [];
|
||||
|
||||
this.setRegex = function(input)
|
||||
{
|
||||
input = input.replace(/^[^\w]+|[^\w]+$/g, "").replace(/[^\w'-]+/g, "|");
|
||||
matchRegex = new RegExp("(" + input + ")","i");
|
||||
}
|
||||
|
||||
this.getRegex = function()
|
||||
{
|
||||
return matchRegex.toString().replace(/^\/\\b\(|\)\\b\/i$/g, "").replace(/\|/g, " ");
|
||||
}
|
||||
|
||||
// recursively apply word highlighting
|
||||
this.hiliteWords = function(node)
|
||||
{
|
||||
if(node == undefined || !node) return;
|
||||
if(!matchRegex) return;
|
||||
if(skipTags.test(node.nodeName)) return;
|
||||
|
||||
if(node.hasChildNodes()) {
|
||||
for(var i=0; i < node.childNodes.length; i++)
|
||||
this.hiliteWords(node.childNodes[i]);
|
||||
}
|
||||
if(node.nodeType == 3) { // NODE_TEXT
|
||||
if((nv = node.nodeValue) && (regs = matchRegex.exec(nv))) {
|
||||
//find the slide's section element and save it in our list of matching slides
|
||||
var secnode = node;
|
||||
while (secnode != null && secnode.nodeName != 'SECTION') {
|
||||
secnode = secnode.parentNode;
|
||||
}
|
||||
|
||||
var slideIndex = Reveal.getIndices(secnode);
|
||||
var slidelen = matchingSlides.length;
|
||||
var alreadyAdded = false;
|
||||
for (var i=0; i < slidelen; i++) {
|
||||
if ( (matchingSlides[i].h === slideIndex.h) && (matchingSlides[i].v === slideIndex.v) ) {
|
||||
alreadyAdded = true;
|
||||
}
|
||||
}
|
||||
if (! alreadyAdded) {
|
||||
matchingSlides.push(slideIndex);
|
||||
}
|
||||
|
||||
if(!wordColor[regs[0].toLowerCase()]) {
|
||||
wordColor[regs[0].toLowerCase()] = colors[colorIdx++ % colors.length];
|
||||
}
|
||||
|
||||
var match = document.createElement(hiliteTag);
|
||||
match.appendChild(document.createTextNode(regs[0]));
|
||||
match.style.backgroundColor = wordColor[regs[0].toLowerCase()];
|
||||
match.style.fontStyle = "inherit";
|
||||
match.style.color = "#000";
|
||||
|
||||
var after = node.splitText(regs.index);
|
||||
after.nodeValue = after.nodeValue.substring(regs[0].length);
|
||||
node.parentNode.insertBefore(match, after);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// remove highlighting
|
||||
this.remove = function()
|
||||
{
|
||||
var arr = document.getElementsByTagName(hiliteTag);
|
||||
while(arr.length && (el = arr[0])) {
|
||||
el.parentNode.replaceChild(el.firstChild, el);
|
||||
}
|
||||
};
|
||||
|
||||
// start highlighting at target node
|
||||
this.apply = function(input)
|
||||
{
|
||||
if(input == undefined || !input) return;
|
||||
this.remove();
|
||||
this.setRegex(input);
|
||||
this.hiliteWords(targetNode);
|
||||
return matchingSlides;
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
function openSearch() {
|
||||
//ensure the search term input dialog is visible and has focus:
|
||||
var inputboxdiv = document.getElementById("searchinputdiv");
|
||||
var inputbox = document.getElementById("searchinput");
|
||||
inputboxdiv.style.display = "inline";
|
||||
inputbox.focus();
|
||||
inputbox.select();
|
||||
}
|
||||
|
||||
function closeSearch() {
|
||||
var inputboxdiv = document.getElementById("searchinputdiv");
|
||||
inputboxdiv.style.display = "none";
|
||||
if(myHilitor) myHilitor.remove();
|
||||
}
|
||||
|
||||
function toggleSearch() {
|
||||
var inputboxdiv = document.getElementById("searchinputdiv");
|
||||
if (inputboxdiv.style.display !== "inline") {
|
||||
openSearch();
|
||||
}
|
||||
else {
|
||||
closeSearch();
|
||||
}
|
||||
}
|
||||
|
||||
function doSearch() {
|
||||
//if there's been a change in the search term, perform a new search:
|
||||
if (searchboxDirty) {
|
||||
var searchstring = document.getElementById("searchinput").value;
|
||||
|
||||
if (searchstring === '') {
|
||||
if(myHilitor) myHilitor.remove();
|
||||
matchedSlides = null;
|
||||
}
|
||||
else {
|
||||
//find the keyword amongst the slides
|
||||
myHilitor = new Hilitor("slidecontent");
|
||||
matchedSlides = myHilitor.apply(searchstring);
|
||||
currentMatchedIndex = 0;
|
||||
}
|
||||
}
|
||||
|
||||
if (matchedSlides) {
|
||||
//navigate to the next slide that has the keyword, wrapping to the first if necessary
|
||||
if (matchedSlides.length && (matchedSlides.length <= currentMatchedIndex)) {
|
||||
currentMatchedIndex = 0;
|
||||
}
|
||||
if (matchedSlides.length > currentMatchedIndex) {
|
||||
Reveal.slide(matchedSlides[currentMatchedIndex].h, matchedSlides[currentMatchedIndex].v);
|
||||
currentMatchedIndex++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var dom = {};
|
||||
dom.wrapper = document.querySelector( '.reveal' );
|
||||
|
||||
if( !dom.wrapper.querySelector( '.searchbox' ) ) {
|
||||
var searchElement = document.createElement( 'div' );
|
||||
searchElement.id = "searchinputdiv";
|
||||
searchElement.classList.add( 'searchdiv' );
|
||||
searchElement.style.position = 'absolute';
|
||||
searchElement.style.top = '10px';
|
||||
searchElement.style.right = '10px';
|
||||
searchElement.style.zIndex = 10;
|
||||
//embedded base64 search icon Designed by Sketchdock - http://www.sketchdock.com/:
|
||||
searchElement.innerHTML = '<span><input type="search" id="searchinput" class="searchinput" style="vertical-align: top;"/><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAJiSURBVHjatFZNaxNBGH5md+Mmu92NVdKDRipSAyqCghgQD4L4cRe86UUtAQ+eFCxoa4/25EXBFi8eBE+eRPoDhB6KgiiixdAPCEkx2pjvTXadd9yNsflwuyUDD/O+u8PzzDPvzOwyx3EwyCZhwG3gAkp7MnpjgbopjsltcD4gjuXZZKeAR348MYLYTm3LzOs/y3j3JTfZxgXWXmTuwPHIc4VmoOmv5IrI53+AO2DdHLjkDWQ3GoEEVFXtXQOvkSnPWcyUceviLhwbDYv8/XIVj97kse7TodLvZXxYxrPUHkQ1ufXs3FEdybEIxucySOesoNvUgWU1cP3MkCBfTFdw9fGaAMVmRELq7LBw2Q3/FaAxxWIRpw+ZIr/7IouPqzUBiqmdHAv7EuhRAwf1er2Vy4x1jW3b2d5Jfvu5IPp7l2LYbcgCFFNb+FoJ7oBqEAqFMPNqFcmEgVMJDfMT+1tvN0pNjERlMS6QA5pFOKxiKVPFhakPeL3It+WGJUDxt2wFR+JhzI7v5ctkd8DXOZAkCYYxhO+lKm4+Xfqz/rIixBuNBl7eOYzkQQNzqX249mRl6zUgEcYkaJrGhUwBinVdh6IouPzwE6/DL5w4oLkH8y981aDf+uq6hlKpJESiUdNfDZi7/ehG9K6KfiA3pml0PLcsq+cSMTj2NL9ukc4UOmz7AZ3+crkC4mHujFvXNaMFB3bEr8xPS6p5O+jXxq4VZtaen7/PwzrntjcLUE0iHPS1Ud1cdiEJl/8WivZk0wXd7zWOMkeF8s0CcAmkNrC2nvXZDbbbN73ccYnZoH9bfgswAFzAe9/h3dbKAAAAAElFTkSuQmCC" id="searchbutton" class="searchicon" style="vertical-align: top; margin-top: -1px;"/></span>';
|
||||
dom.wrapper.appendChild( searchElement );
|
||||
}
|
||||
|
||||
document.getElementById( 'searchbutton' ).addEventListener( 'click', function(event) {
|
||||
doSearch();
|
||||
}, false );
|
||||
|
||||
document.getElementById( 'searchinput' ).addEventListener( 'keyup', function( event ) {
|
||||
switch (event.keyCode) {
|
||||
case 13:
|
||||
event.preventDefault();
|
||||
doSearch();
|
||||
searchboxDirty = false;
|
||||
break;
|
||||
default:
|
||||
searchboxDirty = true;
|
||||
}
|
||||
}, false );
|
||||
|
||||
document.addEventListener( 'keydown', function( event ) {
|
||||
if( event.key == "F" && (event.ctrlKey || event.metaKey) ) { //Control+Shift+f
|
||||
event.preventDefault();
|
||||
toggleSearch();
|
||||
}
|
||||
}, false );
|
||||
if( window.Reveal ) Reveal.registerKeyboardShortcut( 'Ctrl-Shift-F', 'Search' );
|
||||
closeSearch();
|
||||
return { open: openSearch };
|
||||
})();
|
||||
@ -1,272 +0,0 @@
|
||||
// Custom reveal.js integration
|
||||
(function(){
|
||||
var revealElement = document.querySelector( '.reveal' );
|
||||
if( revealElement ) {
|
||||
|
||||
revealElement.addEventListener( 'mousedown', function( event ) {
|
||||
var defaultModifier = /Linux/.test( window.navigator.platform ) ? 'ctrl' : 'alt';
|
||||
|
||||
var modifier = ( Reveal.getConfig().zoomKey ? Reveal.getConfig().zoomKey : defaultModifier ) + 'Key';
|
||||
var zoomLevel = ( Reveal.getConfig().zoomLevel ? Reveal.getConfig().zoomLevel : 2 );
|
||||
|
||||
if( event[ modifier ] && !Reveal.isOverview() ) {
|
||||
event.preventDefault();
|
||||
|
||||
zoom.to({
|
||||
x: event.clientX,
|
||||
y: event.clientY,
|
||||
scale: zoomLevel,
|
||||
pan: false
|
||||
});
|
||||
}
|
||||
} );
|
||||
|
||||
}
|
||||
})();
|
||||
|
||||
/*!
|
||||
* zoom.js 0.3 (modified for use with reveal.js)
|
||||
* http://lab.hakim.se/zoom-js
|
||||
* MIT licensed
|
||||
*
|
||||
* Copyright (C) 2011-2014 Hakim El Hattab, http://hakim.se
|
||||
*/
|
||||
var zoom = (function(){
|
||||
|
||||
// The current zoom level (scale)
|
||||
var level = 1;
|
||||
|
||||
// The current mouse position, used for panning
|
||||
var mouseX = 0,
|
||||
mouseY = 0;
|
||||
|
||||
// Timeout before pan is activated
|
||||
var panEngageTimeout = -1,
|
||||
panUpdateInterval = -1;
|
||||
|
||||
// Check for transform support so that we can fallback otherwise
|
||||
var supportsTransforms = 'WebkitTransform' in document.body.style ||
|
||||
'MozTransform' in document.body.style ||
|
||||
'msTransform' in document.body.style ||
|
||||
'OTransform' in document.body.style ||
|
||||
'transform' in document.body.style;
|
||||
|
||||
if( supportsTransforms ) {
|
||||
// The easing that will be applied when we zoom in/out
|
||||
document.body.style.transition = 'transform 0.8s ease';
|
||||
document.body.style.OTransition = '-o-transform 0.8s ease';
|
||||
document.body.style.msTransition = '-ms-transform 0.8s ease';
|
||||
document.body.style.MozTransition = '-moz-transform 0.8s ease';
|
||||
document.body.style.WebkitTransition = '-webkit-transform 0.8s ease';
|
||||
}
|
||||
|
||||
// Zoom out if the user hits escape
|
||||
document.addEventListener( 'keyup', function( event ) {
|
||||
if( level !== 1 && event.keyCode === 27 ) {
|
||||
zoom.out();
|
||||
}
|
||||
} );
|
||||
|
||||
// Monitor mouse movement for panning
|
||||
document.addEventListener( 'mousemove', function( event ) {
|
||||
if( level !== 1 ) {
|
||||
mouseX = event.clientX;
|
||||
mouseY = event.clientY;
|
||||
}
|
||||
} );
|
||||
|
||||
/**
|
||||
* Applies the CSS required to zoom in, prefers the use of CSS3
|
||||
* transforms but falls back on zoom for IE.
|
||||
*
|
||||
* @param {Object} rect
|
||||
* @param {Number} scale
|
||||
*/
|
||||
function magnify( rect, scale ) {
|
||||
|
||||
var scrollOffset = getScrollOffset();
|
||||
|
||||
// Ensure a width/height is set
|
||||
rect.width = rect.width || 1;
|
||||
rect.height = rect.height || 1;
|
||||
|
||||
// Center the rect within the zoomed viewport
|
||||
rect.x -= ( window.innerWidth - ( rect.width * scale ) ) / 2;
|
||||
rect.y -= ( window.innerHeight - ( rect.height * scale ) ) / 2;
|
||||
|
||||
if( supportsTransforms ) {
|
||||
// Reset
|
||||
if( scale === 1 ) {
|
||||
document.body.style.transform = '';
|
||||
document.body.style.OTransform = '';
|
||||
document.body.style.msTransform = '';
|
||||
document.body.style.MozTransform = '';
|
||||
document.body.style.WebkitTransform = '';
|
||||
}
|
||||
// Scale
|
||||
else {
|
||||
var origin = scrollOffset.x +'px '+ scrollOffset.y +'px',
|
||||
transform = 'translate('+ -rect.x +'px,'+ -rect.y +'px) scale('+ scale +')';
|
||||
|
||||
document.body.style.transformOrigin = origin;
|
||||
document.body.style.OTransformOrigin = origin;
|
||||
document.body.style.msTransformOrigin = origin;
|
||||
document.body.style.MozTransformOrigin = origin;
|
||||
document.body.style.WebkitTransformOrigin = origin;
|
||||
|
||||
document.body.style.transform = transform;
|
||||
document.body.style.OTransform = transform;
|
||||
document.body.style.msTransform = transform;
|
||||
document.body.style.MozTransform = transform;
|
||||
document.body.style.WebkitTransform = transform;
|
||||
}
|
||||
}
|
||||
else {
|
||||
// Reset
|
||||
if( scale === 1 ) {
|
||||
document.body.style.position = '';
|
||||
document.body.style.left = '';
|
||||
document.body.style.top = '';
|
||||
document.body.style.width = '';
|
||||
document.body.style.height = '';
|
||||
document.body.style.zoom = '';
|
||||
}
|
||||
// Scale
|
||||
else {
|
||||
document.body.style.position = 'relative';
|
||||
document.body.style.left = ( - ( scrollOffset.x + rect.x ) / scale ) + 'px';
|
||||
document.body.style.top = ( - ( scrollOffset.y + rect.y ) / scale ) + 'px';
|
||||
document.body.style.width = ( scale * 100 ) + '%';
|
||||
document.body.style.height = ( scale * 100 ) + '%';
|
||||
document.body.style.zoom = scale;
|
||||
}
|
||||
}
|
||||
|
||||
level = scale;
|
||||
|
||||
if( document.documentElement.classList ) {
|
||||
if( level !== 1 ) {
|
||||
document.documentElement.classList.add( 'zoomed' );
|
||||
}
|
||||
else {
|
||||
document.documentElement.classList.remove( 'zoomed' );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Pan the document when the mosue cursor approaches the edges
|
||||
* of the window.
|
||||
*/
|
||||
function pan() {
|
||||
var range = 0.12,
|
||||
rangeX = window.innerWidth * range,
|
||||
rangeY = window.innerHeight * range,
|
||||
scrollOffset = getScrollOffset();
|
||||
|
||||
// Up
|
||||
if( mouseY < rangeY ) {
|
||||
window.scroll( scrollOffset.x, scrollOffset.y - ( 1 - ( mouseY / rangeY ) ) * ( 14 / level ) );
|
||||
}
|
||||
// Down
|
||||
else if( mouseY > window.innerHeight - rangeY ) {
|
||||
window.scroll( scrollOffset.x, scrollOffset.y + ( 1 - ( window.innerHeight - mouseY ) / rangeY ) * ( 14 / level ) );
|
||||
}
|
||||
|
||||
// Left
|
||||
if( mouseX < rangeX ) {
|
||||
window.scroll( scrollOffset.x - ( 1 - ( mouseX / rangeX ) ) * ( 14 / level ), scrollOffset.y );
|
||||
}
|
||||
// Right
|
||||
else if( mouseX > window.innerWidth - rangeX ) {
|
||||
window.scroll( scrollOffset.x + ( 1 - ( window.innerWidth - mouseX ) / rangeX ) * ( 14 / level ), scrollOffset.y );
|
||||
}
|
||||
}
|
||||
|
||||
function getScrollOffset() {
|
||||
return {
|
||||
x: window.scrollX !== undefined ? window.scrollX : window.pageXOffset,
|
||||
y: window.scrollY !== undefined ? window.scrollY : window.pageYOffset
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
/**
|
||||
* Zooms in on either a rectangle or HTML element.
|
||||
*
|
||||
* @param {Object} options
|
||||
* - element: HTML element to zoom in on
|
||||
* OR
|
||||
* - x/y: coordinates in non-transformed space to zoom in on
|
||||
* - width/height: the portion of the screen to zoom in on
|
||||
* - scale: can be used instead of width/height to explicitly set scale
|
||||
*/
|
||||
to: function( options ) {
|
||||
|
||||
// Due to an implementation limitation we can't zoom in
|
||||
// to another element without zooming out first
|
||||
if( level !== 1 ) {
|
||||
zoom.out();
|
||||
}
|
||||
else {
|
||||
options.x = options.x || 0;
|
||||
options.y = options.y || 0;
|
||||
|
||||
// If an element is set, that takes precedence
|
||||
if( !!options.element ) {
|
||||
// Space around the zoomed in element to leave on screen
|
||||
var padding = 20;
|
||||
var bounds = options.element.getBoundingClientRect();
|
||||
|
||||
options.x = bounds.left - padding;
|
||||
options.y = bounds.top - padding;
|
||||
options.width = bounds.width + ( padding * 2 );
|
||||
options.height = bounds.height + ( padding * 2 );
|
||||
}
|
||||
|
||||
// If width/height values are set, calculate scale from those values
|
||||
if( options.width !== undefined && options.height !== undefined ) {
|
||||
options.scale = Math.max( Math.min( window.innerWidth / options.width, window.innerHeight / options.height ), 1 );
|
||||
}
|
||||
|
||||
if( options.scale > 1 ) {
|
||||
options.x *= options.scale;
|
||||
options.y *= options.scale;
|
||||
|
||||
magnify( options, options.scale );
|
||||
|
||||
if( options.pan !== false ) {
|
||||
|
||||
// Wait with engaging panning as it may conflict with the
|
||||
// zoom transition
|
||||
panEngageTimeout = setTimeout( function() {
|
||||
panUpdateInterval = setInterval( pan, 1000 / 60 );
|
||||
}, 800 );
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Resets the document zoom state to its default.
|
||||
*/
|
||||
out: function() {
|
||||
clearTimeout( panEngageTimeout );
|
||||
clearInterval( panUpdateInterval );
|
||||
|
||||
magnify( { x: 0, y: 0 }, 1 );
|
||||
|
||||
level = 1;
|
||||
},
|
||||
|
||||
// Alias
|
||||
magnify: function( options ) { this.to( options ) },
|
||||
reset: function() { this.out() },
|
||||
|
||||
zoomLevel: function() {
|
||||
return level;
|
||||
}
|
||||
}
|
||||
|
||||
})();
|
||||
@ -1,11 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content titlepage">
|
||||
<h1>L<sup style="font-weight: bold; font-size: 73%; margin-left: -.25em; margin-right: -.05em; position: relative; top: .2em">A</sup>T<sub style="font-size: 100%; margin-left: -.1em">E</sub>X-Wochenende</h1>
|
||||
<small>
|
||||
Ein Workshop der Fachschaft WIAI.<br/>
|
||||
Erstellt von Anika Amma, Fabian Lamprecht, <br/>Florian Knoch, Christian Kremitzl und Anna Sauer.
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -1,178 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Was ist L<sup style="font-weight: bold; font-size: 73%; margin-left: -.25em; margin-right: -.05em; position: relative; top: .2em">A</sup>T<sub style="font-size: 100%; margin-left: -.1em">E</sub>X?</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-two-previews">
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/01/example-word-orig.svg">
|
||||
<figcaption class="fragment">Klassisches Word-Dokument</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/01/example-latex-orig.svg">
|
||||
<figcaption class="fragment">Klassisches LaTeX-Dokument</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Entstehung</h2>
|
||||
<ul>
|
||||
<li>Donald **Knuth**, 1977–1986: Textsatzsystem **TeX**<span class="bubble fragment">τεχ → /tɛç/</span> für The Art of Computer Programming</li>
|
||||
<li>Leslie **Lamport**, ab 1980er: Softwarepaket **LaTeX** zur einfacheren Benutzung von TeX</li>
|
||||
</ul>
|
||||
<div style="display: flex; justify-content: space-between; align-items: stretch;">
|
||||
<figure>
|
||||
<img src="sections/german/01/knuth.jpg" style="height: 13em">
|
||||
<figcaption>Donald Knuth</figcaption>
|
||||
</figure>
|
||||
<figure>
|
||||
<img src="sections/german/01/lamport.jpg" style="height: 13em">
|
||||
<figcaption>Leslie Lamport</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/01/taocp.jpg">
|
||||
<!-- https://in.pinterest.com/pin/813110907700064708/ -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-two-previews">
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/01/example-word-orig.svg">
|
||||
<figcaption>Klassisches Word-Dokument</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/01/example-latex-orig.svg">
|
||||
<figcaption>Klassisches LaTeX-Dokument</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Typografie</h2>
|
||||
<h3>Makrotypografie</h3>
|
||||
<ul>
|
||||
<li>Satzspiegel</li>
|
||||
<li>Zeilenlänge vs. -abstand</li>
|
||||
<li>Platzierung von Überschriften im Weißraum</li>
|
||||
<li>Platzierung von Bildern und Tabellen</li>
|
||||
<li>Schusterjungen / Hurenkinder</li>
|
||||
<li>Gleichmäßiger Grauwert</li>
|
||||
<li>…</li>
|
||||
</ul>
|
||||
<figure style="display: flex; justify-content: space-between; width: 100%; align-items: flex-end;">
|
||||
<img src="sections/german/01/satzspiegel.svg" style="height: 8em">
|
||||
<figcaption style="margin-left: 1em; font-size: .8em">Satzspiegel-Konstruktion nach Villard (<a class="dark-font" href="https://commons.wikimedia.org/wiki/File:Satzspiegel-4.svg">Quelle</a>)</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/01/vergleich-makro.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Typografie</h2>
|
||||
<h3>Mikrotypografie</h3>
|
||||
<ul>
|
||||
<li>Ligaturen</li>
|
||||
<li>Kerning</li>
|
||||
<li>echte Kursiven, Kapitälchen, Schriftgrade …</li>
|
||||
<li>Wortabstände</li>
|
||||
<li>…</li>
|
||||
</ul>
|
||||
<div style="display: flex; justify-content: space-between; align-items: flex-end;">
|
||||
<figure>
|
||||
<img src="sections/german/01/schriftschnitte-crop.svg" style="height: 1.7em;">
|
||||
<figcaption style="font-size: .8em;">Schriftschnitte:<br>gerade, schräg, kursiv</figcaption>
|
||||
</figure>
|
||||
<figure>
|
||||
<img src="sections/german/01/schriftgrade.svg" style="height: 2.2em;">
|
||||
<figcaption style="font-size: .8em">Schriftgrade:<br>klein, klein vergrößert, groß</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<ul>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/01/vergleich-mikro.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Weitere Vorteile</h2>
|
||||
<ul>
|
||||
<li>wesentlich bessere Standardeinstellungen<br>
|
||||
als in sämtlichen Textverarbeitungsprogrammen</li>
|
||||
<li>strukturiertes Arbeiten</li>
|
||||
<li>zuverlässiges Undo</li>
|
||||
<li>einfache Versionierung</li>
|
||||
<li>unabhängig von proprietären Programmen</li>
|
||||
<li>Quelltext und Ausgabe langfristig lesbar</li>
|
||||
<li>einfache Zusammenarbeit mit anderen Programmen</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Ablauf des Workshops</h2>
|
||||
<p><strong>Ziel:</strong> Ihr baut eure eigene LaTeX-Referenz<br>
|
||||
auf Basis von [l2kurz](https://www.ctan.org/tex-archive/info/lshort/german).</li>
|
||||
<ul>
|
||||
<li>Learning by Doing</li>
|
||||
<li>Verstehen, wie LaTeX funktioniert</li>
|
||||
<li>Einzelheiten später nachschlagen</li>
|
||||
</ul>
|
||||
<div class="fragment">
|
||||
<p><strong>Gliederung:</strong></p>
|
||||
<ol>
|
||||
<li><del>Was ist LaTeX?</del></li>
|
||||
<li>Wie funktioniert LaTeX?</li>
|
||||
<li>Grundstruktur eines LaTeX-Dokuments</li>
|
||||
<li>Projektstruktur</li>
|
||||
<li>Viele Features</li>
|
||||
<li>Literaturverwaltung</li>
|
||||
<li>Ausblick</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/01/l2kurz-orig.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
Leer
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
Leer
|
||||
</div>
|
||||
</div>
|
||||
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 242 KiB |
@ -1,152 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Wie funktioniert L<sup style="font-weight: bold; font-size: 73%; margin-left: -.25em; margin-right: -.05em; position: relative; top: .2em">A</sup>T<sub style="font-size: 100%; margin-left: -.1em">E</sub>X?</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<div>
|
||||
<h3 data-category="Word">What You See Is What You Get</h3>
|
||||
<ul>
|
||||
<li>Formatierung mit unmittelbarem optischen Feedback</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="fragment">
|
||||
<h3 data-category="LaTeX">What You See Is What You Mean</h3>
|
||||
<ul>
|
||||
<li>Trennung von Inhalt und Struktur</li>
|
||||
<li>Formatierung erst am Ende ersichtlich</li>
|
||||
</ul>
|
||||
</div>
|
||||
<p style="margin-top:calc(.25 * var(--square));" class="fragment">
|
||||
Bildquelle: <a href="https://xkcd.com/1341/">xkcd</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img class="fragment" src="sections/german/02/xkcd-types-of-editors.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-preview-only">
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/02/wysiwyg.svg" class="large">
|
||||
<figcaption>Der Weg zum fertigen Dokument</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-two-columns">
|
||||
<h2 class="layout-title">Was brauchen wir dazu?</h2>
|
||||
<div class="layout-column-one">
|
||||
<h3>Editor</h3>
|
||||
<p>enthält unseren Quelltext mit allen Befehlen zur semantischen Gliederung</p>
|
||||
<p><i>TeXstudio, TeXMaker</i></p>
|
||||
</div>
|
||||
<div class="layout-column-two">
|
||||
<h3>Compiler</h3>
|
||||
<p>erstellt aus dem Quelltext ein fertig formatiertes PDF-Dokument</p>
|
||||
<p><i>MiKTeX, TeX Live, MacTeX</i></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2>Befehle</h2>
|
||||
<p>Allgemeiner Aufbau eine Befehls:</p>
|
||||
<pre class="lang-txt hljs"><code>\<befehl>[<optionale_parameter>]{<obligatorische_parameter>}</code></pre>
|
||||
<p class="fragment">Ein paar Beispiele:</p>
|
||||
<pre class="lang-tex hljs fragment"><code>\newpage % fügt eine neue Seite ein
|
||||
\textbf{<text>} % schreibt den übergebenen Text fett
|
||||
\usepackage[utf8]{inputenc} % setzt die Textkodierung
|
||||
\frac{<zähler>}{<nenner>} % fügt den mathematischen Bruch ein</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Backslash</h2>
|
||||
<p>Den Backslash erzeugt ihr mit folgender Tastenkombination:</p>
|
||||
<p><kbd>AltGr</kbd> + <kbd>ß</kbd> (Windows/Linux)</p>
|
||||
<p><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>7</kbd> (MacOS)</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2>Optionale Parameter</h2>
|
||||
<p>In eckigen Klammern können verschieden viele optionale Parameter stehen:</p>
|
||||
<pre class="lang-tex hljs"><code>\usepackage[utf8]{inputenc}
|
||||
% setzt die Textkodierung
|
||||
|
||||
\documentclass[a4paper,12pt]{article}
|
||||
% setzt die Dokumentklasse
|
||||
|
||||
\includegraphics[width=12cm,height=4cm]{bild.png}
|
||||
% bindet das Bild "bild.png" ein</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Kommentare</h2>
|
||||
<p>Nach einem Prozentzeichen wird der Rest der Zeile vom Compiler ignoriert. Der Kommentartext erscheint also nicht im fertigen Dokument.</p>
|
||||
<pre class="lang-tex hljs"><code>% Beginn Steckbrief
|
||||
Name: Donald Knuth \\\\
|
||||
Geburtsdatum: \\\\ % TODO: einfügen
|
||||
Geburtsort: Milwaukee, Wisconsin
|
||||
% Ende Steckbrief</code></pre>
|
||||
<p>Tastenkombinationen: <kbd>Strg</kbd> + <kbd>T</kbd> und <kbd>Strg</kbd> + <kbd>U</kbd></p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/02/comments-crop.svg">
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Software-Installation</h2>
|
||||
<p>Bitte installiert **zuerst den Compiler**, also MikTeX (Windows), MacTeX (MacOS) bzw. TeX Live (Linux) und **danach den Editor**. In diesem Workshop verwenden wir TeXstudio.</p>
|
||||
|
||||
<ul>
|
||||
<li>MikTeX (Windows): https://miktex.org/ </li>
|
||||
<li>MacTeX (MacOS): http://tug.org/mactex/ </li>
|
||||
<li>TeX Live (Linux/alle BS): https://tug.org/texlive/ </li>
|
||||
<li>TeXstudio: https://www.texstudio.org/ </li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="1">Erste Schritte im Umgang mit LaTeX</h2>
|
||||
<ul>
|
||||
<li class="fragment">Falls nötig: Install now!</li>
|
||||
<li class="fragment">Ladet euch aus dem VC die Datei <code>aufgabe01.tex</code> herunter und speichert sie in einem eigenen Ordner.</li>
|
||||
<li class="fragment">Öffnet die Datei in TeXstudio.</li>
|
||||
<li class="fragment">Kompiliert die Datei durch Druck auf <span class="emoji">⏩</span>.</li>
|
||||
<li class="fragment">Was ist in dem Ordner passiert, in dem die Datei liegt?</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,344 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Grundstruktur eines L<sup style="font-weight: bold; font-size: 73%; margin-left: -.25em; margin-right: -.05em; position: relative; top: .2em">A</sup>T<sub style="font-size: 100%; margin-left: -.1em">E</sub>X-Dokuments</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Präambel & Dokumentumgebung</h2>
|
||||
<p style="text-indent: -1.3em"><span class="emoji">👁</span> Ein mit LaTeX gesetztes Dokument besteht aus:</p>
|
||||
<ul class="fragment">
|
||||
<li><strong>Präambel:</strong> globale Einstellungen (Dokumentklasse, Encoding, Sprache, Seitenformat, zusäzliche Pakete, ...) und</li>
|
||||
<li><strong>Dokumentumgebung:</strong> textueller Inhalt des Dokuments.</li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs fragment"><code>\documentclass{scrartcl}
|
||||
\usepackage[utf8]{inputenc}
|
||||
\usepackage[T1]{fontenc}
|
||||
\usepackage[ngerman]{babel}
|
||||
|
||||
\begin{document}
|
||||
Hallo, Welt!
|
||||
\end{document}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<figure>
|
||||
<img src="sections/german/03/hallo-crop.svg">
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2>Dokumentklasse</h2>
|
||||
<pre class="lang-tex hljs"><code>\documentclass[<parameter>]{<dokumentklasse>}</code></pre>
|
||||
<p>Konkret zum Beispiel</p>
|
||||
<pre class="lang-tex hljs"><code>\documentclass[10pt,a5paper,landscape]{scrartcl}</code></pre>
|
||||
<ul class="fragment">
|
||||
<li><strong><code>scrartcl</code>, <code>article</strong></code> für einfache Dokumente</li>
|
||||
<li><strong><code>scrreport</code>, <code>report</strong></code> für komplexere Dokumente</li>
|
||||
<li><strong><code>scrbook</code>, <code>book</strong></code> für Bücher</li>
|
||||
<li><strong><code>beamer</strong></code> für Präsentationen</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Pakete</h2>
|
||||
</p>
|
||||
<pre class="lang-tex hljs"><code>\usepackage[<optionen>]{<paketname>}</code></pre>
|
||||
<p>
|
||||
<ul>
|
||||
<li>Pakete stellen zusätzliche Befehle und Funktionalitäten zur Verfügung.</li>
|
||||
<li>Es existieren verschiedene Pakete für verschiedene Anwendungsfälle (z. B. Formelsatz, Listen, ...).
|
||||
</li>
|
||||
<li>Sie müssen vor der Nutzung **in der Präambel** eingebunden werden.
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Encoding</h2>
|
||||
<pre class="lang-tex hljs"><code>\usepackage[utf8]{inputenc}
|
||||
\usepackage[t1]{fontenc}</code></pre>
|
||||
<ul>
|
||||
<li class="fragment">Die Zeichenkodierung bestimmt, welche Zeichen verfügbar sind.</li>
|
||||
<li class="fragment"><strong>ASCII</strong> enthält kaum Sonderzeichen wie deutsche Umlaute.</li>
|
||||
<li class="fragment"><strong>UTF-8</strong> ist eine universelle Kodierung.</li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Sprache</h2>
|
||||
<pre class="lang-tex hljs"><code>\usepackage[ngerman]{babel}</code></pre>
|
||||
<ul>
|
||||
<li>Das Paket <strong><code>babel</code></strong> stellt sprachspezifische Informationen (z. B. Silbentrennung, Sonderzeichen, Wechsel zwischen Fonts, Übersetzung von Labels wie ›Kapitel‹, ›Inhaltsverzeichnis‹ oder ›Abbildung‹) bereit.</li>
|
||||
<li><strong><code>ngerman</code></strong> steht für die neue deutsche Rechschreibung.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2>Sprachen</h2>
|
||||
<p>Es können auch mehrere Sprachen im Dokument verwendet werden:</p>
|
||||
<pre class="lang-tex hljs"><code>\usepackage[ngerman, swedish, russian, greek, english]{babel}</code></pre>
|
||||
<div class="fragment">
|
||||
<p>Umschalten zwischen Sprachen:</p>
|
||||
<pre class="lang-tex hljs"><code>\selectlanguage{<sprache a>}
|
||||
\selectlanguage{<sprache b>}</code></pre>
|
||||
<p>Eingebetteter Text in anderer Sprache:</p>
|
||||
<pre class="lang-tex hljs"><code>\selectlanguage{<sprache a>}
|
||||
\foreignlanguage{<sprache b>}{Hier steht Text in Sprache B in einem Text in Sprache A}</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Sprachen – Ein Beispiel</h2>
|
||||
<pre class="lang-tex hljs"><code>\today
|
||||
\selectlanguage{ngerman}
|
||||
\today
|
||||
\selectlanguage{swedish}
|
||||
\today
|
||||
\selectlanguage{russian}
|
||||
\today
|
||||
\selectlanguage{greek}
|
||||
\today
|
||||
\selectlanguage{english}
|
||||
\today
|
||||
</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/languages-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Fließtext</h2>
|
||||
<pre class="lang-tex hljs"><code>Fließtext kann direkt in den Quelltext ↲
|
||||
geschrieben werden. ↲
|
||||
Einfache Zeilenumbrüche ↲
|
||||
werden dabei ignoriert, ↲
|
||||
genau wie mehrere Leerzeichen. ↲
|
||||
↲
|
||||
Leerzeilen erzeugen einen neuen Absatz,↲
|
||||
standardmäßig mit Einzug. ↲
|
||||
Manuelle Zeilenumbrüche können mit ↲
|
||||
zwei Backslashes erzwungen werden, ↲
|
||||
haben in Fließtext aber eigentlich \\\\ ↲
|
||||
nichts verloren.</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/absätze-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Achtung!">Reservierte Zeichen</h2>
|
||||
<p>Bestimmte Zeichen lösen in LaTeX Dinge aus:</p>
|
||||
<p>`# $ % ^ & _ { } ~ \`</p>
|
||||
<pre class="lang-tex hljs"><code>50% sind die Hälfte.</code></pre>
|
||||
<p>Lösung: »`\`« voranstellen:</p>
|
||||
<pre class="lang-tex hljs"><code>50\% sind die Hälfte.</code></pre>
|
||||
<p>Funktioniert nicht mit »`\\`«, Lösung dafür später.</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/reservierte-zeichen-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Abschnitte und Kapitel</h2>
|
||||
<p>Texte werden durch Überschriften in Abschnitte und Kapitel unterteilt. Immer verfügbar:</p>
|
||||
<pre class="lang-tex hljs"><code>\section{Ebene 1}
|
||||
\subsection{Ebene 2}
|
||||
\subsubsection{Ebene 3}
|
||||
\paragraph{Ebene 4}
|
||||
\subparagraph{Ebene 5}</code></pre>
|
||||
<p>Je nach Dokumentenklasse zusätzlich:</p>
|
||||
<pre class="lang-tex hljs"><code>\chapter{Kapitel}
|
||||
\part{Teil}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/abschnitte-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Abschnitte und Kapitel</h2>
|
||||
<p>Mit Sternchen fallen bei allen diesen Befehlen die Nummerierung und der Eintrag im Inhaltsverzeichnis weg:</p>
|
||||
<pre class="lang-tex hljs"><code>\section*{Kein Verzeichniseintrag}</code></pre>
|
||||
<p>Außerdem kann für das Inhaltsverzeichnis ein alternativer Titel angegeben werden:</p>
|
||||
<pre class="lang-tex hljs"><code>\section[Titel im Verzeichnis]
|
||||
{Kapitelüberschrift}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/abschnitte-anders-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2>Titelei</h2>
|
||||
<pre class="lang-tex hljs" data-source="title.tex"><code>\title{Die Welt der Trüffel}
|
||||
\author{Fooboar Rüssel \\\\ Fachschaft WIAI\thanks{WIe AIn Profi},
|
||||
Otto-Friedrich-Universität Bamberg}
|
||||
\date{\today}
|
||||
\begin{document}
|
||||
\maketitle
|
||||
\end{document}</code></pre>
|
||||
<ul>
|
||||
<li>In der Präambel werden die Werte für die Einträge gespeichert.</li>
|
||||
<li>Das Setzen des Titels erfolgt in der Dokumentumgebung mit dem Befehl <code>\maketitle</code>.</li>
|
||||
<li>Die genaue Gestaltung hängt ab von der verwendeten Dokumentklasse.</li>
|
||||
<li>Mehrere Autoren werden mit <code>\and</code> getrennt.</li>
|
||||
<li>Wird kein Datum angegeben, wird per default das aktuelle Datum gesetzt. Ein abweichendes Datum kann mit <code>\date{}</code> definiert werden.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Titelei</h2>
|
||||
<pre class="lang-tex hljs" data-source="title.tex"><code>\documentclass[ngerman]{scrartcl}
|
||||
\usepackage{babel}
|
||||
\title{Die Welt der Trüffel}
|
||||
\author{Fooboar Rüssel \\\\ Fachschaft
|
||||
WIAI\thanks{WIe AIn Profi},
|
||||
Otto-Friedrich-Universität Bamberg}
|
||||
\date{\today}
|
||||
\begin{document}
|
||||
\maketitle
|
||||
\section{Trüffelsuche}
|
||||
\subsection{Suche mit Schwein}
|
||||
\subsection{Suche ohne Schwein}
|
||||
Wer macht denn sowas?
|
||||
\section{Trüffelrezepte}
|
||||
Mein Lieblingsrezept
|
||||
\end{document}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/title-orig.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Inhaltsverzeichnis</h2>
|
||||
<p><pre class="lang-tex hljs"><code>\tableofcontents</code></pre>
|
||||
<ul>
|
||||
<li>Nummerierung erfolgt automatisch</li>
|
||||
<li>Viele Anpassungsmöglichkeiten (Aufzählungszeichen und -tiefe, automatische Benennung, …)</li>
|
||||
<li>(Unter-)Kapitel, die nicht im Verzeichnis aufgeführt werden sollen, werden mit einem »`*`« versehen, also z. B. <code>\section\*{}</code>.</li>
|
||||
<li>Am besten zweimal kompilieren</li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Inhaltsverzeichnis</h2>
|
||||
<pre class="lang-tex hljs" data-source="title.tex"><code>\documentclass[ngerman]{scrartcl}
|
||||
\usepackage{babel}
|
||||
\begin{document}
|
||||
\tableofcontents
|
||||
\section{Trüffelsuche}
|
||||
Der erste Abschnitt.
|
||||
\subsection{Suche mit Schwein}
|
||||
Ein Unterabschnitt.
|
||||
\subsection{Suche ohne Schwein}
|
||||
Ein weiterer Unterabschitt.
|
||||
\subsubsection[But why?]{Wer macht denn
|
||||
sowas?}
|
||||
Unter-Unterabschnitt.
|
||||
\section{Trüffelrezepte}
|
||||
Mein Lieblingsrezept
|
||||
\end{document}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/03/contents-orig.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Weitere Verzeichnisse</h2>
|
||||
<p>Abbildungsverzeichnis und Tabellenverzeichnis
|
||||
<pre class="lang-tex hljs"><code>\listoffigures
|
||||
\listoftables</code></pre>
|
||||
<ul>
|
||||
<li>Fügt das gewählte Verzeichnis an der entsprechenden Stelle ins Dokument ein.</li>
|
||||
<li>Es wird die jeweilige Bild- bzw. Tabellenunterschrift aufgeführt. Es kann aber auch ein Kurztitel angegeben werden, der dann für das Verzeichnis verwendet wird. </li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-wide-content">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="2">Dokument und Text gliedern</h2>
|
||||
<ul>
|
||||
<li>Ladet das Projektarchiv aus dem VC herunter, entpackt es und öffnet die Datei `allgemeines.tex` in TeXStudio.</li>
|
||||
<li class="fragment">Packt den gesamten Text (einschließlich Kommentare) in `allgemeines.tex` in eine **Document**-Umgebung und schreibt darüber folgende **Präambel**, damit das Dokument kompiliert werden kann:
|
||||
</li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs fragment"><code>\documentclass{scrartcl}
|
||||
\usepackage[utf8]{inputenc}
|
||||
\usepackage[T1]{fontenc}
|
||||
\usepackage[ngerman]{babel}
|
||||
\usepackage{hyperref}
|
||||
\usepackage{csquotes}</code></pre>
|
||||
<ul class="fragment">
|
||||
<li>Im nicht auskommentierten Teil wurden **Absätze** durch »`//`« markiert. Verwendet stattdessen echte Absätze.</li>
|
||||
<li class="fragment">Kommentiert den restlichen Text ein. Verwendet für alle **Überschriften** passende LaTeX-Befehle (`\section` bis `\subsubsection`).
|
||||
<li class="fragment">Fügt ein **Inhaltsverzeichnis** ein.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 125 KiB |
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 125 KiB |
@ -1,56 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="52pt" height="10pt" viewBox="0 0 52 10" version="1.1">
|
||||
<defs>
|
||||
<g>
|
||||
<symbol overflow="visible" id="glyph0-0">
|
||||
<path style="stroke:none;" d=""/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-1">
|
||||
<path style="stroke:none;" d="M 7.140625 0 L 7.140625 -0.3125 L 6.890625 -0.3125 C 6.125 -0.3125 6.109375 -0.421875 6.109375 -0.78125 L 6.109375 -6.03125 C 6.109375 -6.390625 6.125 -6.5 6.890625 -6.5 L 7.140625 -6.5 L 7.140625 -6.8125 C 6.78125 -6.78125 6.046875 -6.78125 5.671875 -6.78125 C 5.296875 -6.78125 4.546875 -6.78125 4.203125 -6.8125 L 4.203125 -6.5 L 4.4375 -6.5 C 5.203125 -6.5 5.21875 -6.390625 5.21875 -6.03125 L 5.21875 -3.703125 L 2.25 -3.703125 L 2.25 -6.03125 C 2.25 -6.390625 2.265625 -6.5 3.03125 -6.5 L 3.265625 -6.5 L 3.265625 -6.8125 C 2.921875 -6.78125 2.1875 -6.78125 1.796875 -6.78125 C 1.421875 -6.78125 0.671875 -6.78125 0.328125 -6.8125 L 0.328125 -6.5 L 0.5625 -6.5 C 1.328125 -6.5 1.359375 -6.390625 1.359375 -6.03125 L 1.359375 -0.78125 C 1.359375 -0.421875 1.328125 -0.3125 0.5625 -0.3125 L 0.328125 -0.3125 L 0.328125 0 C 0.671875 -0.03125 1.421875 -0.03125 1.796875 -0.03125 C 2.171875 -0.03125 2.921875 -0.03125 3.265625 0 L 3.265625 -0.3125 L 3.03125 -0.3125 C 2.265625 -0.3125 2.25 -0.421875 2.25 -0.78125 L 2.25 -3.390625 L 5.21875 -3.390625 L 5.21875 -0.78125 C 5.21875 -0.421875 5.203125 -0.3125 4.4375 -0.3125 L 4.203125 -0.3125 L 4.203125 0 C 4.546875 -0.03125 5.28125 -0.03125 5.65625 -0.03125 C 6.046875 -0.03125 6.78125 -0.03125 7.140625 0 Z M 7.140625 0 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-2">
|
||||
<path style="stroke:none;" d="M 4.8125 -0.890625 L 4.8125 -1.453125 L 4.5625 -1.453125 L 4.5625 -0.890625 C 4.5625 -0.3125 4.3125 -0.25 4.203125 -0.25 C 3.875 -0.25 3.84375 -0.703125 3.84375 -0.75 L 3.84375 -2.734375 C 3.84375 -3.15625 3.84375 -3.546875 3.484375 -3.921875 C 3.09375 -4.3125 2.59375 -4.46875 2.109375 -4.46875 C 1.296875 -4.46875 0.609375 -4 0.609375 -3.34375 C 0.609375 -3.046875 0.8125 -2.875 1.0625 -2.875 C 1.34375 -2.875 1.53125 -3.078125 1.53125 -3.328125 C 1.53125 -3.453125 1.46875 -3.78125 1.015625 -3.78125 C 1.28125 -4.140625 1.78125 -4.25 2.09375 -4.25 C 2.578125 -4.25 3.15625 -3.859375 3.15625 -2.96875 L 3.15625 -2.609375 C 2.640625 -2.578125 1.9375 -2.546875 1.3125 -2.25 C 0.5625 -1.90625 0.3125 -1.390625 0.3125 -0.953125 C 0.3125 -0.140625 1.28125 0.109375 1.90625 0.109375 C 2.578125 0.109375 3.03125 -0.296875 3.21875 -0.75 C 3.265625 -0.359375 3.53125 0.0625 4 0.0625 C 4.203125 0.0625 4.8125 -0.078125 4.8125 -0.890625 Z M 3.15625 -1.390625 C 3.15625 -0.453125 2.4375 -0.109375 1.984375 -0.109375 C 1.5 -0.109375 1.09375 -0.453125 1.09375 -0.953125 C 1.09375 -1.5 1.5 -2.328125 3.15625 -2.390625 Z M 3.15625 -1.390625 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-3">
|
||||
<path style="stroke:none;" d="M 2.546875 0 L 2.546875 -0.3125 C 1.875 -0.3125 1.765625 -0.3125 1.765625 -0.75 L 1.765625 -6.921875 L 0.328125 -6.8125 L 0.328125 -6.5 C 1.03125 -6.5 1.109375 -6.4375 1.109375 -5.9375 L 1.109375 -0.75 C 1.109375 -0.3125 1 -0.3125 0.328125 -0.3125 L 0.328125 0 L 1.4375 -0.03125 Z M 2.546875 0 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-4">
|
||||
<path style="stroke:none;" d="M 4.6875 -2.140625 C 4.6875 -3.40625 3.703125 -4.46875 2.5 -4.46875 C 1.25 -4.46875 0.28125 -3.375 0.28125 -2.140625 C 0.28125 -0.84375 1.3125 0.109375 2.484375 0.109375 C 3.6875 0.109375 4.6875 -0.875 4.6875 -2.140625 Z M 3.875 -2.21875 C 3.875 -1.859375 3.875 -1.3125 3.65625 -0.875 C 3.421875 -0.421875 2.984375 -0.140625 2.5 -0.140625 C 2.0625 -0.140625 1.625 -0.34375 1.359375 -0.8125 C 1.109375 -1.25 1.109375 -1.859375 1.109375 -2.21875 C 1.109375 -2.609375 1.109375 -3.140625 1.34375 -3.578125 C 1.609375 -4.03125 2.078125 -4.25 2.484375 -4.25 C 2.921875 -4.25 3.34375 -4.03125 3.609375 -3.59375 C 3.875 -3.171875 3.875 -2.59375 3.875 -2.21875 Z M 3.875 -2.21875 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-5">
|
||||
<path style="stroke:none;" d="M 2.03125 -0.015625 C 2.03125 -0.640625 1.78125 -1.0625 1.390625 -1.0625 C 1.03125 -1.0625 0.859375 -0.78125 0.859375 -0.53125 C 0.859375 -0.265625 1.03125 0 1.390625 0 C 1.53125 0 1.671875 -0.0625 1.78125 -0.15625 C 1.796875 0.625 1.53125 1.234375 1.09375 1.703125 C 1.03125 1.765625 1.015625 1.78125 1.015625 1.8125 C 1.015625 1.890625 1.0625 1.921875 1.109375 1.921875 C 1.234375 1.921875 2.03125 1.140625 2.03125 -0.015625 Z M 2.03125 -0.015625 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-6">
|
||||
<path style="stroke:none;" d="M 10.0625 -6.5 L 10.0625 -6.8125 C 9.765625 -6.78125 9.453125 -6.78125 9.15625 -6.78125 L 7.96875 -6.8125 L 7.96875 -6.5 C 8.640625 -6.484375 8.828125 -6.15625 8.828125 -5.96875 C 8.828125 -5.90625 8.796875 -5.828125 8.78125 -5.765625 L 7.28125 -1.171875 L 5.6875 -6.046875 C 5.6875 -6.09375 5.65625 -6.15625 5.65625 -6.203125 C 5.65625 -6.5 6.234375 -6.5 6.5 -6.5 L 6.5 -6.8125 C 6.140625 -6.78125 5.46875 -6.78125 5.078125 -6.78125 L 3.875 -6.8125 L 3.875 -6.5 C 4.4375 -6.5 4.640625 -6.5 4.765625 -6.140625 L 4.984375 -5.4375 L 3.59375 -1.171875 L 2 -6.078125 C 1.984375 -6.09375 1.96875 -6.171875 1.96875 -6.203125 C 1.96875 -6.5 2.546875 -6.5 2.8125 -6.5 L 2.8125 -6.8125 C 2.453125 -6.78125 1.78125 -6.78125 1.390625 -6.78125 L 0.171875 -6.8125 L 0.171875 -6.5 C 0.921875 -6.5 0.96875 -6.453125 1.09375 -6.078125 L 3.078125 0.03125 C 3.109375 0.125 3.140625 0.21875 3.265625 0.21875 C 3.40625 0.21875 3.421875 0.15625 3.46875 0.015625 L 5.109375 -5.046875 L 6.765625 0.03125 C 6.796875 0.125 6.828125 0.21875 6.953125 0.21875 C 7.09375 0.21875 7.125 0.15625 7.15625 0.015625 L 9.0625 -5.828125 C 9.234375 -6.40625 9.671875 -6.5 10.0625 -6.5 Z M 10.0625 -6.5 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-7">
|
||||
<path style="stroke:none;" d="M 4.140625 -1.1875 C 4.140625 -1.28125 4.0625 -1.3125 4 -1.3125 C 3.921875 -1.3125 3.890625 -1.25 3.875 -1.171875 C 3.53125 -0.140625 2.625 -0.140625 2.53125 -0.140625 C 2.03125 -0.140625 1.640625 -0.4375 1.40625 -0.8125 C 1.109375 -1.28125 1.109375 -1.9375 1.109375 -2.296875 L 3.890625 -2.296875 C 4.109375 -2.296875 4.140625 -2.296875 4.140625 -2.515625 C 4.140625 -3.5 3.59375 -4.46875 2.359375 -4.46875 C 1.203125 -4.46875 0.28125 -3.4375 0.28125 -2.1875 C 0.28125 -0.859375 1.328125 0.109375 2.46875 0.109375 C 3.6875 0.109375 4.140625 -1 4.140625 -1.1875 Z M 3.484375 -2.515625 L 1.109375 -2.515625 C 1.171875 -4 2.015625 -4.25 2.359375 -4.25 C 3.375 -4.25 3.484375 -2.90625 3.484375 -2.515625 Z M 3.484375 -2.515625 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-8">
|
||||
<path style="stroke:none;" d="M 3.3125 -1.234375 L 3.3125 -1.796875 L 3.0625 -1.796875 L 3.0625 -1.25 C 3.0625 -0.515625 2.765625 -0.140625 2.390625 -0.140625 C 1.71875 -0.140625 1.71875 -1.046875 1.71875 -1.21875 L 1.71875 -3.984375 L 3.15625 -3.984375 L 3.15625 -4.296875 L 1.71875 -4.296875 L 1.71875 -6.125 L 1.46875 -6.125 C 1.46875 -5.3125 1.171875 -4.25 0.1875 -4.203125 L 0.1875 -3.984375 L 1.03125 -3.984375 L 1.03125 -1.234375 C 1.03125 -0.015625 1.96875 0.109375 2.328125 0.109375 C 3.03125 0.109375 3.3125 -0.59375 3.3125 -1.234375 Z M 3.3125 -1.234375 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-9">
|
||||
<path style="stroke:none;" d="M 1.90625 -6.625 C 1.90625 -6.953125 1.640625 -7.140625 1.390625 -7.140625 C 1.125 -7.140625 0.859375 -6.953125 0.859375 -6.625 L 1.25 -2.09375 C 1.25 -1.9375 1.265625 -1.859375 1.390625 -1.859375 C 1.484375 -1.859375 1.515625 -1.90625 1.53125 -2.078125 Z M 1.90625 -0.53125 C 1.90625 -0.8125 1.671875 -1.0625 1.390625 -1.0625 C 1.09375 -1.0625 0.859375 -0.8125 0.859375 -0.53125 C 0.859375 -0.234375 1.09375 0 1.390625 0 C 1.671875 0 1.90625 -0.234375 1.90625 -0.53125 Z M 1.90625 -0.53125 "/>
|
||||
</symbol>
|
||||
</g>
|
||||
</defs>
|
||||
<g id="surface1">
|
||||
<g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
|
||||
<use xlink:href="#glyph0-1" x="-0.254" y="7.871"/>
|
||||
<use xlink:href="#glyph0-2" x="7.21795" y="7.871"/>
|
||||
<use xlink:href="#glyph0-3" x="12.19925" y="7.871"/>
|
||||
<use xlink:href="#glyph0-3" x="14.96686" y="7.871"/>
|
||||
<use xlink:href="#glyph0-4" x="17.734471" y="7.871"/>
|
||||
<use xlink:href="#glyph0-5" x="22.715771" y="7.871"/>
|
||||
</g>
|
||||
<g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
|
||||
<use xlink:href="#glyph0-6" x="28.800927" y="7.871"/>
|
||||
</g>
|
||||
<g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
|
||||
<use xlink:href="#glyph0-7" x="38.213591" y="7.871"/>
|
||||
<use xlink:href="#glyph0-3" x="42.641967" y="7.871"/>
|
||||
<use xlink:href="#glyph0-8" x="45.409577" y="7.871"/>
|
||||
<use xlink:href="#glyph0-9" x="49.284032" y="7.871"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 8.4 KiB |
@ -1,56 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="595.276pt" height="841.89pt" viewBox="0 0 595.276 841.89" version="1.1">
|
||||
<defs>
|
||||
<g>
|
||||
<symbol overflow="visible" id="glyph0-0">
|
||||
<path style="stroke:none;" d=""/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-1">
|
||||
<path style="stroke:none;" d="M 7.140625 0 L 7.140625 -0.3125 L 6.890625 -0.3125 C 6.125 -0.3125 6.109375 -0.421875 6.109375 -0.78125 L 6.109375 -6.03125 C 6.109375 -6.390625 6.125 -6.5 6.890625 -6.5 L 7.140625 -6.5 L 7.140625 -6.8125 C 6.78125 -6.78125 6.046875 -6.78125 5.671875 -6.78125 C 5.296875 -6.78125 4.546875 -6.78125 4.203125 -6.8125 L 4.203125 -6.5 L 4.4375 -6.5 C 5.203125 -6.5 5.21875 -6.390625 5.21875 -6.03125 L 5.21875 -3.703125 L 2.25 -3.703125 L 2.25 -6.03125 C 2.25 -6.390625 2.265625 -6.5 3.03125 -6.5 L 3.265625 -6.5 L 3.265625 -6.8125 C 2.921875 -6.78125 2.1875 -6.78125 1.796875 -6.78125 C 1.421875 -6.78125 0.671875 -6.78125 0.328125 -6.8125 L 0.328125 -6.5 L 0.5625 -6.5 C 1.328125 -6.5 1.359375 -6.390625 1.359375 -6.03125 L 1.359375 -0.78125 C 1.359375 -0.421875 1.328125 -0.3125 0.5625 -0.3125 L 0.328125 -0.3125 L 0.328125 0 C 0.671875 -0.03125 1.421875 -0.03125 1.796875 -0.03125 C 2.171875 -0.03125 2.921875 -0.03125 3.265625 0 L 3.265625 -0.3125 L 3.03125 -0.3125 C 2.265625 -0.3125 2.25 -0.421875 2.25 -0.78125 L 2.25 -3.390625 L 5.21875 -3.390625 L 5.21875 -0.78125 C 5.21875 -0.421875 5.203125 -0.3125 4.4375 -0.3125 L 4.203125 -0.3125 L 4.203125 0 C 4.546875 -0.03125 5.28125 -0.03125 5.65625 -0.03125 C 6.046875 -0.03125 6.78125 -0.03125 7.140625 0 Z M 7.140625 0 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-2">
|
||||
<path style="stroke:none;" d="M 4.8125 -0.890625 L 4.8125 -1.453125 L 4.5625 -1.453125 L 4.5625 -0.890625 C 4.5625 -0.3125 4.3125 -0.25 4.203125 -0.25 C 3.875 -0.25 3.84375 -0.703125 3.84375 -0.75 L 3.84375 -2.734375 C 3.84375 -3.15625 3.84375 -3.546875 3.484375 -3.921875 C 3.09375 -4.3125 2.59375 -4.46875 2.109375 -4.46875 C 1.296875 -4.46875 0.609375 -4 0.609375 -3.34375 C 0.609375 -3.046875 0.8125 -2.875 1.0625 -2.875 C 1.34375 -2.875 1.53125 -3.078125 1.53125 -3.328125 C 1.53125 -3.453125 1.46875 -3.78125 1.015625 -3.78125 C 1.28125 -4.140625 1.78125 -4.25 2.09375 -4.25 C 2.578125 -4.25 3.15625 -3.859375 3.15625 -2.96875 L 3.15625 -2.609375 C 2.640625 -2.578125 1.9375 -2.546875 1.3125 -2.25 C 0.5625 -1.90625 0.3125 -1.390625 0.3125 -0.953125 C 0.3125 -0.140625 1.28125 0.109375 1.90625 0.109375 C 2.578125 0.109375 3.03125 -0.296875 3.21875 -0.75 C 3.265625 -0.359375 3.53125 0.0625 4 0.0625 C 4.203125 0.0625 4.8125 -0.078125 4.8125 -0.890625 Z M 3.15625 -1.390625 C 3.15625 -0.453125 2.4375 -0.109375 1.984375 -0.109375 C 1.5 -0.109375 1.09375 -0.453125 1.09375 -0.953125 C 1.09375 -1.5 1.5 -2.328125 3.15625 -2.390625 Z M 3.15625 -1.390625 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-3">
|
||||
<path style="stroke:none;" d="M 2.546875 0 L 2.546875 -0.3125 C 1.875 -0.3125 1.765625 -0.3125 1.765625 -0.75 L 1.765625 -6.921875 L 0.328125 -6.8125 L 0.328125 -6.5 C 1.03125 -6.5 1.109375 -6.4375 1.109375 -5.9375 L 1.109375 -0.75 C 1.109375 -0.3125 1 -0.3125 0.328125 -0.3125 L 0.328125 0 L 1.4375 -0.03125 Z M 2.546875 0 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-4">
|
||||
<path style="stroke:none;" d="M 4.6875 -2.140625 C 4.6875 -3.40625 3.703125 -4.46875 2.5 -4.46875 C 1.25 -4.46875 0.28125 -3.375 0.28125 -2.140625 C 0.28125 -0.84375 1.3125 0.109375 2.484375 0.109375 C 3.6875 0.109375 4.6875 -0.875 4.6875 -2.140625 Z M 3.875 -2.21875 C 3.875 -1.859375 3.875 -1.3125 3.65625 -0.875 C 3.421875 -0.421875 2.984375 -0.140625 2.5 -0.140625 C 2.0625 -0.140625 1.625 -0.34375 1.359375 -0.8125 C 1.109375 -1.25 1.109375 -1.859375 1.109375 -2.21875 C 1.109375 -2.609375 1.109375 -3.140625 1.34375 -3.578125 C 1.609375 -4.03125 2.078125 -4.25 2.484375 -4.25 C 2.921875 -4.25 3.34375 -4.03125 3.609375 -3.59375 C 3.875 -3.171875 3.875 -2.59375 3.875 -2.21875 Z M 3.875 -2.21875 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-5">
|
||||
<path style="stroke:none;" d="M 2.03125 -0.015625 C 2.03125 -0.640625 1.78125 -1.0625 1.390625 -1.0625 C 1.03125 -1.0625 0.859375 -0.78125 0.859375 -0.53125 C 0.859375 -0.265625 1.03125 0 1.390625 0 C 1.53125 0 1.671875 -0.0625 1.78125 -0.15625 C 1.796875 0.625 1.53125 1.234375 1.09375 1.703125 C 1.03125 1.765625 1.015625 1.78125 1.015625 1.8125 C 1.015625 1.890625 1.0625 1.921875 1.109375 1.921875 C 1.234375 1.921875 2.03125 1.140625 2.03125 -0.015625 Z M 2.03125 -0.015625 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-6">
|
||||
<path style="stroke:none;" d="M 10.0625 -6.5 L 10.0625 -6.8125 C 9.765625 -6.78125 9.453125 -6.78125 9.15625 -6.78125 L 7.96875 -6.8125 L 7.96875 -6.5 C 8.640625 -6.484375 8.828125 -6.15625 8.828125 -5.96875 C 8.828125 -5.90625 8.796875 -5.828125 8.78125 -5.765625 L 7.28125 -1.171875 L 5.6875 -6.046875 C 5.6875 -6.09375 5.65625 -6.15625 5.65625 -6.203125 C 5.65625 -6.5 6.234375 -6.5 6.5 -6.5 L 6.5 -6.8125 C 6.140625 -6.78125 5.46875 -6.78125 5.078125 -6.78125 L 3.875 -6.8125 L 3.875 -6.5 C 4.4375 -6.5 4.640625 -6.5 4.765625 -6.140625 L 4.984375 -5.4375 L 3.59375 -1.171875 L 2 -6.078125 C 1.984375 -6.09375 1.96875 -6.171875 1.96875 -6.203125 C 1.96875 -6.5 2.546875 -6.5 2.8125 -6.5 L 2.8125 -6.8125 C 2.453125 -6.78125 1.78125 -6.78125 1.390625 -6.78125 L 0.171875 -6.8125 L 0.171875 -6.5 C 0.921875 -6.5 0.96875 -6.453125 1.09375 -6.078125 L 3.078125 0.03125 C 3.109375 0.125 3.140625 0.21875 3.265625 0.21875 C 3.40625 0.21875 3.421875 0.15625 3.46875 0.015625 L 5.109375 -5.046875 L 6.765625 0.03125 C 6.796875 0.125 6.828125 0.21875 6.953125 0.21875 C 7.09375 0.21875 7.125 0.15625 7.15625 0.015625 L 9.0625 -5.828125 C 9.234375 -6.40625 9.671875 -6.5 10.0625 -6.5 Z M 10.0625 -6.5 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-7">
|
||||
<path style="stroke:none;" d="M 4.140625 -1.1875 C 4.140625 -1.28125 4.0625 -1.3125 4 -1.3125 C 3.921875 -1.3125 3.890625 -1.25 3.875 -1.171875 C 3.53125 -0.140625 2.625 -0.140625 2.53125 -0.140625 C 2.03125 -0.140625 1.640625 -0.4375 1.40625 -0.8125 C 1.109375 -1.28125 1.109375 -1.9375 1.109375 -2.296875 L 3.890625 -2.296875 C 4.109375 -2.296875 4.140625 -2.296875 4.140625 -2.515625 C 4.140625 -3.5 3.59375 -4.46875 2.359375 -4.46875 C 1.203125 -4.46875 0.28125 -3.4375 0.28125 -2.1875 C 0.28125 -0.859375 1.328125 0.109375 2.46875 0.109375 C 3.6875 0.109375 4.140625 -1 4.140625 -1.1875 Z M 3.484375 -2.515625 L 1.109375 -2.515625 C 1.171875 -4 2.015625 -4.25 2.359375 -4.25 C 3.375 -4.25 3.484375 -2.90625 3.484375 -2.515625 Z M 3.484375 -2.515625 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-8">
|
||||
<path style="stroke:none;" d="M 3.3125 -1.234375 L 3.3125 -1.796875 L 3.0625 -1.796875 L 3.0625 -1.25 C 3.0625 -0.515625 2.765625 -0.140625 2.390625 -0.140625 C 1.71875 -0.140625 1.71875 -1.046875 1.71875 -1.21875 L 1.71875 -3.984375 L 3.15625 -3.984375 L 3.15625 -4.296875 L 1.71875 -4.296875 L 1.71875 -6.125 L 1.46875 -6.125 C 1.46875 -5.3125 1.171875 -4.25 0.1875 -4.203125 L 0.1875 -3.984375 L 1.03125 -3.984375 L 1.03125 -1.234375 C 1.03125 -0.015625 1.96875 0.109375 2.328125 0.109375 C 3.03125 0.109375 3.3125 -0.59375 3.3125 -1.234375 Z M 3.3125 -1.234375 "/>
|
||||
</symbol>
|
||||
<symbol overflow="visible" id="glyph0-9">
|
||||
<path style="stroke:none;" d="M 1.90625 -6.625 C 1.90625 -6.953125 1.640625 -7.140625 1.390625 -7.140625 C 1.125 -7.140625 0.859375 -6.953125 0.859375 -6.625 L 1.25 -2.09375 C 1.25 -1.9375 1.265625 -1.859375 1.390625 -1.859375 C 1.484375 -1.859375 1.515625 -1.90625 1.53125 -2.078125 Z M 1.90625 -0.53125 C 1.90625 -0.8125 1.671875 -1.0625 1.390625 -1.0625 C 1.09375 -1.0625 0.859375 -0.8125 0.859375 -0.53125 C 0.859375 -0.234375 1.09375 0 1.390625 0 C 1.671875 0 1.90625 -0.234375 1.90625 -0.53125 Z M 1.90625 -0.53125 "/>
|
||||
</symbol>
|
||||
</g>
|
||||
</defs>
|
||||
<g id="surface1">
|
||||
<g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
|
||||
<use xlink:href="#glyph0-1" x="139.746" y="135.761"/>
|
||||
<use xlink:href="#glyph0-2" x="147.21795" y="135.761"/>
|
||||
<use xlink:href="#glyph0-3" x="152.19925" y="135.761"/>
|
||||
<use xlink:href="#glyph0-3" x="154.96686" y="135.761"/>
|
||||
<use xlink:href="#glyph0-4" x="157.734471" y="135.761"/>
|
||||
<use xlink:href="#glyph0-5" x="162.715771" y="135.761"/>
|
||||
</g>
|
||||
<g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
|
||||
<use xlink:href="#glyph0-6" x="168.800927" y="135.761"/>
|
||||
</g>
|
||||
<g style="fill:rgb(0%,0%,0%);fill-opacity:1;">
|
||||
<use xlink:href="#glyph0-7" x="178.213591" y="135.761"/>
|
||||
<use xlink:href="#glyph0-3" x="182.641967" y="135.761"/>
|
||||
<use xlink:href="#glyph0-8" x="185.409577" y="135.761"/>
|
||||
<use xlink:href="#glyph0-9" x="189.284032" y="135.761"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 8.4 KiB |
@ -1,250 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Projektstruktur</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Zielsetzung</h2>
|
||||
<p>Ein größeres LaTeX-Projekt anlegen und dabei …</p>
|
||||
<ul>
|
||||
<li>verhindern, dass LaTeX-Dokumente zu monströser Größe anwachsen <span class="emoji">👹</span></li>
|
||||
<li>den Überblick über die Struktur eines Projekts behalten</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/langes-dokument.png" style="padding: .2em; height: 100vh">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Hauptdatei <span class="emoji">👑</span></h2>
|
||||
<ul>
|
||||
<li>enthält Grundgerüst, Titel, Inhaltsverzeichnis etc.</li>
|
||||
<li>bindet einzelne Kapitel ein mit<br>
|
||||
<code>\input{path_to_file}</code> oder <code>\include{path_to_file}</code></li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs" data-sourcefile="main.tex"><code>\documentclass{article}
|
||||
\usepackage[ngerman]{babel}
|
||||
\usepackage[utf8]{inputenc}
|
||||
\usepackage[T1]{fontenc}
|
||||
\title{Ein Titel}
|
||||
\begin{document}
|
||||
\maketitle
|
||||
\tableofcontents
|
||||
\input{abschnitt1.tex}
|
||||
\input{abschnitt2.tex}
|
||||
\end{document}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/main-orig.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Datei mit Teilabschnitt</h2>
|
||||
<ul>
|
||||
<li>enthält **keine Präambel**<li>
|
||||
<li>enthält **kein** `\begin{document}` und `\end{document}`</li>
|
||||
</ul>
|
||||
<pre data-sourcefile="part1.tex" class="hljs lang-tex"><code>\section{Dies ist Abschnitt 1}
|
||||
Hier ein Absatz zum
|
||||
Inhalt von Abschnitt 1.
|
||||
|
||||
% …</code></pre>
|
||||
<pre data-sourcefile="part2.tex" class="hljs lang-tex"><code>\section{Dies ist Abschnitt 2}
|
||||
Hier ein Absatz zum
|
||||
Inhalt von Abschnitt 2.
|
||||
|
||||
% …</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img class="thin-padding" src="sections/german/04/main-parts-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-two-columns">
|
||||
<div class="layout-title">
|
||||
<h2>`input` oder `include`?</h2>
|
||||
</div>
|
||||
<div class="layout-column-one">
|
||||
<pre class="lang-tex jshl"><code>\input{path_to_file}</code></pre>
|
||||
<ul class="fragment">
|
||||
<li>Dateiendung `.tex` **kann** angegeben werden</li>
|
||||
<li>**Schachtelung** möglich: Unterdateien können wiederum per `\input{}` andere Unterunterdateien einbinden</li>
|
||||
<li>Unterdatei wird im fertigen Dokument **ohne Sprung auf neue Seite** in Hauptdatei eingefügt</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="layout-column-two">
|
||||
<pre class="lang-tex jshl"><code>\include{path_to_file}</code></pre>
|
||||
<ul class="fragment">
|
||||
<li>Dateiendung `.tex` **nicht** angeben</li>
|
||||
<li>**Schachtelung** nicht möglich</li>
|
||||
<li>für jede Unterdatei wird im fertigen Dokument eine **neue Seite** angelegt</li>
|
||||
<li>Vorteil bei größeren Projekten: `\includeonly{file1,file2,...}` in die Präambel schreiben, um nur einzelne Unterdateien zu kompilieren</li>
|
||||
<li>um `\includeonly` zu verwenden, muss zuvor mindestens einmal das gesamte Projekt kompiliert werden</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Exkurs">Dateipfade angeben <span class="emoji">👣</span></h2>
|
||||
<ul>
|
||||
<li>wichtig für `\input{}` und `\include{}` sowie später für das Einbinden von Bildern</li>
|
||||
<li>Datei- und Ordnerstruktur = Baumstruktur <span class="emoji">🌳</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/tree-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Exkurs">Dateipfade angeben <span class="emoji">👣</span></h2>
|
||||
<h3>Absolute Dateipfade</h3>
|
||||
<ul>
|
||||
<li>Pfad von der Wurzel des Ordnerbaums bis zur jeweiligen Datei</li>
|
||||
<li>die verschiedenen Ebenen des Baums werden dabei durch folgende Zeichen getrennt:
|
||||
<ul>
|
||||
<li>Unter Unix: »`/`«</li>
|
||||
<li>Unter Windows: »`\`«</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="fragment">
|
||||
<p><strong>Beispiel:</strong> Absoluter Pfad zu `main.tex`</p>
|
||||
<ul>
|
||||
<li>Unix: `/home/knut/docs/latex/main.tex`</li>
|
||||
<li>Windows: `C:\knut\docs\latex\main.tex`</li>
|
||||
</ul>
|
||||
<p>Allerdings muss **bei LaTeX stets die Unix-Syntax** für Pfadangaben verwendet werden. Deshalb werden wir im folgenden diese verwerden.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/absolute-path-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Exkurs">Dateipfade angeben <span class="emoji">👣</span></h2>
|
||||
<h3>Relative Dateipfade</h3>
|
||||
<ul>
|
||||
<li>Pfad von einem bestimmten Ort irgendwo im Ordnerbaum bis zur jeweiligen Datei</li>
|
||||
<li>kürzer + weniger Schreibarbeit! <span class="emoji">☺</span></li>
|
||||
<li>bei `\input{}`und `\include{}` kann der Pfad zu einer Unterdatei relativ zur Hauptdatei angeben werden</li>
|
||||
</ul>
|
||||
<div class="fragment">
|
||||
<p><strong>Beispiel:</strong> Relativer Pfad <br/>von `main.tex` zu `part1.tex`</p>
|
||||
<p>`./part1.tex`</p>
|
||||
<p>Der **einfache Punkt ».«** bezieht sich bei relativen Pfaden auf den Ordner, in dem die Ausgangsdatei liegt (hier: `latex`). Er ist optional, es könnte also auch nur part1.tex geschrieben werden.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/relative-path-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Exkurs">Dateipfade angeben <span class="emoji">👣</span></h2>
|
||||
<h3>Relative Dateipfade</h3>
|
||||
<p><strong>Beispiel:</strong> Relativer Pfad von `main.tex` zu `part1.tex` in Unterordner</p>
|
||||
<p>`./sections/part1.tex`</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/relative-path-subdir-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Exkurs">Dateipfade angeben <span class="emoji">👣</span></h2>
|
||||
<h3>Relative Dateipfade</h3>
|
||||
<p><strong>Beispiel:</strong> Relativer Pfad von `main.tex` in eigenem Unterordner zu `part1.tex` in anderem Unterordner</p>
|
||||
<p>`../sections/part1.tex`</p>
|
||||
<p>**Zwei Punkte »`..`«** bezeichnen den Elternordner des aktuellen Ordners (hier: <code>latex</code>, den Elternordner des Ordners <code>main</code>).</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/04/relative-path-superdir-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Kompilieren des Projekts</h2>
|
||||
<ul>
|
||||
<li>**Nur die Hauptdatei** wird kompiliert, um das fertige PDF-Dokument zu erhalten.</li>
|
||||
<li>Fehlermeldungen enthalten dann Verweis, in welcher Unterdatei sie aufgetreten sind.</li>
|
||||
<li>Die Unterdateien können wegen ihrer fehlenden Präambel nicht selbstständig kompiliert werden.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Präambel ausgelagert</h2>
|
||||
<p>Was denkt ihr, passiert, wenn wir die Präambel in eine Unterdatei auslagern?</p>
|
||||
<p>Wird das Gesamtdokument kompilieren oder nicht?</p>
|
||||
<p class="fragment"><strong>Ja, es kompiliert!</strong><br>
|
||||
Ein einfacher Weg, um die Hauptdatei noch übersichtlicher zu halten.</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img class="thin-padding" src="sections/german/04/main-parts-header-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="3">Ein strukturiertes Projekt</h2>
|
||||
<ul>
|
||||
<li>Entfernt die Präambel, die beiden `document`-Zeilen und das Inhaltsverzeichnis aus `allgemeines.tex`.</li>
|
||||
<li class="fragment">Kompiliert stattdessen `l2kurz.tex` – das ist ab sofort unsere **Hauptdatei**. Die Datei `allgemeines.tex` ist bereits eingebunden und wird mit kompiliert.</li>
|
||||
<li class="fragment">Die Hauptdatei ist sehr unübersichtlich. Lagert alle Befehle, die vor der Dokumentumgebung (`\begin{document}`) aufgerufen werden, in eine neue Datei `praeambel.tex` aus und bindet diese mit `\input{praeambel}` ein.</li>
|
||||
<li class="fragment"><strong>Technischer Hinweis:</strong> Wählt beim Kompilieren bitte die Option »(c) nutze das vorgegebene Kommando«, wenn sich ein entsprechendes Pop-up öffnet.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="3">Ein strukturiertes Projekt</h2>
|
||||
<ul>
|
||||
<li>Um lange Kompilierzeiten zu verhindern, sollten vorerst nur noch die Abschnitte <code>einleitung.tex</code> und <code>allgemeines.tex</code> eingebunden werden.</li>
|
||||
<li class="fragment">Ersetzt hierzu in der Datei <code>l2kurz.tex</code> alle <strong>anderen</strong> <code>\input</code>-Statements durch <code>\include</code>-Statements und verwendet den Befehl <code>\includeonly</code>.</li>
|
||||
<li class="fragment"><strong>Achtung:</strong> Die Präambel sollte weiterhin durch <code>\input</code> eingebunden werden.</li>
|
||||
<li class="fragment">Setzt das <code>\includeonly</code>-Statement direkt über <code>\begin{document}</code>.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,362 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Sonderzeichen</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Leerzeichen</h2>
|
||||
<ul>
|
||||
<li>normale Wortzwischenräume per Leertaste</li>
|
||||
<li>geschützte Leerzeichen: `~`</li>
|
||||
<li>schmale Leerzeichen: `\,`</li>
|
||||
<li>viele weitere Breiten verfügbar</li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs"><code>Schmale Leerzeichen werden z.\,B. in
|
||||
Abkürzungen und zwischen Zahlen und
|
||||
Einheiten verwendet: 10\,s.
|
||||
Normalbreite, aber geschützte
|
||||
Leerzeichen können u.\,a.
|
||||
dabei helfen, Titel und Namen in
|
||||
einer Zeile zu halten: Dr.~Fooboar.</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/05/leerzeichen-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Die Sache mit den Strichen …</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Name</th>
|
||||
<th>Verwendung</th>
|
||||
<th>Code</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>-</td>
|
||||
<td>Bindestrich</td>
|
||||
<td>LaTeX-Wochenende</td>
|
||||
<td>`-`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>–</td>
|
||||
<td>Halbgeviert­strich</td>
|
||||
<td>als Gedankenstrich – oder als Bis-Strich: 10 – 12 Uhr.</td>
|
||||
<td>`--`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>—</td>
|
||||
<td>Geviertstrich</td>
|
||||
<td>A dash — in American English</td>
|
||||
<td>`---`</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/05/striche-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Silbentrennung</h2>
|
||||
<p>LaTeX trennt Wörter im Normalfall automatisch richtig, wenn die richtige Sprache konfiguriert ist. Es kann aber auch manuell eingegriffen werden:</p>
|
||||
<table>
|
||||
<tr>
|
||||
<td>Ausschließliche Trennung</td>
|
||||
<td>`\-`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Zusätzliche Trennstelle</td>
|
||||
<td>`"-`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Bindestrich (verbietet andere Trennstellen)</td>
|
||||
<td>`-`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Bindestrich (erlaubt andere Trennstellen)</td>
|
||||
<td>`"=`</td>
|
||||
<tr>
|
||||
<td>Trennstelle ohne Strich</td>
|
||||
<td>`""`</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Strich ohne Trennstelle</td>
|
||||
<td>`"~`</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p data-category="Achtung!">Einige der Codes funktionieren nur mit eingebundenem <code>babel</code>-Paket.</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/05/silbentrennung-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Anführungszeichen</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Sprache</th>
|
||||
<!-- <th style="text-align: center;">Kürzel</th> -->
|
||||
<th style="text-align: center;">Befehl</th>
|
||||
<th style="text-align: center;">Ergebnis</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Deutsch</td>
|
||||
<!-- <td style="text-align: center;"><code>,,…\`\`</code></td> -->
|
||||
<td style="text-align: center;">`\glqq … \grqq`</td>
|
||||
<td style="text-align: center;">„…“</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 2. Ebene</td>
|
||||
<!-- <td style="text-align: center;"><code> ,…\` </code></td> -->
|
||||
<td style="text-align: center;">` \glq … \grq `</td>
|
||||
<td style="text-align: center;">‚…‘</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Deutsch altern.</td>
|
||||
<!-- <td style="text-align: center;"><code>,,…\`\`</code></td> -->
|
||||
<td style="text-align: center;">`\frqq … \flqq`</td>
|
||||
<td style="text-align: center;">»…«</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 2. Ebene</td>
|
||||
<!-- <td style="text-align: center;"><code> ,…\` </code></td> -->
|
||||
<td style="text-align: center;">` \frq … \flq `</td>
|
||||
<td style="text-align: center;">›…‹</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Englisch (A. E.)</td>
|
||||
<td style="text-align: center;"><code>\`\`…''</code></td>
|
||||
<!-- <td style="text-align: center;">–</td> -->
|
||||
<td style="text-align: center;">“…”</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 2. Ebene</td>
|
||||
<td style="text-align: center;"><code> \`…' </code></td>
|
||||
<!-- <td style="text-align: center;">–</td> -->
|
||||
<td style="text-align: center;">‘…’</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Englisch (B. E.)</td>
|
||||
<td style="text-align: center;"><code> \`…' </code></td>
|
||||
<!-- <td style="text-align: center;">–</td> -->
|
||||
<td style="text-align: center;">‘…’</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 2. Ebene</td>
|
||||
<td style="text-align: center;"><code>\`\`…''</code></td>
|
||||
<!-- <td style="text-align: center;">–</td> -->
|
||||
<td style="text-align: center;">“…”</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Zitate</h2>
|
||||
<p>Das Paket `csquotes` stellt u. a. den Befehl `\enquote` zur Verfügung:</p>
|
||||
<pre class="lang-tex hljs"><code>\enquote{Ein \enquote{verschachteltes}
|
||||
Zitat.}</code></pre>
|
||||
<p>Wenn das Paket mit `autostyle=true` eingebunden wird, werden bei fremdsprachigen Zitaten die entsprechenden Anführungszeichen verwendet:</p>
|
||||
<pre class="lang-tex hljs"><code>\foreignquote{english}{An English
|
||||
quote.}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/05/zitate-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Diakritika</h2>
|
||||
<p>Buchstaben mit Diakritika können entweder direkt über die Tastatur eingegeben werden oder über Escape-Codes:</p>
|
||||
<table>
|
||||
<tr>
|
||||
<td><code>\\\`{o}</code></td>
|
||||
<td>ò  </td>
|
||||
<td><code>\\c{c}</code></td>
|
||||
<td>ç  </td>
|
||||
<td><code>\\d{u}</code></td>
|
||||
<td>ụ</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\\'{o}</code></td>
|
||||
<td>ó</td>
|
||||
<td><code>\\k{a}</code></td>
|
||||
<td>ą</td>
|
||||
<td><code>\\r{a}</code></td>
|
||||
<td>å</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\\^{o}</code></td>
|
||||
<td>ô</td>
|
||||
<td><code>\\l{}</code></td>
|
||||
<td>ł</td>
|
||||
<td><code>\\u{o}</code></td>
|
||||
<td>ŏ</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\\"{o}</code></td>
|
||||
<td>ö</td>
|
||||
<td><code>\\={o}</code></td>
|
||||
<td>ō</td>
|
||||
<td><code>\\v{s}</code></td>
|
||||
<td>š</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\\H{o}</code></td>
|
||||
<td>ő</td>
|
||||
<td><code>\\b{o}</code></td>
|
||||
<td>o</td>
|
||||
<td><code>\\t{oo}</code></td>
|
||||
<td>o͡o</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\\~{o}</code></td>
|
||||
<td>õ</td>
|
||||
<td><code>\\.{o}</code></td>
|
||||
<td>ȯ</td>
|
||||
<td><code>\\o</code></td>
|
||||
<td>ø</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Sonderzeichen & Symbole</h2>
|
||||
<p>Auch andere Sonderzeichen können entweder direkt eingegeben werden oder per Befehl:</p>
|
||||
<table>
|
||||
<tr>
|
||||
<td style="text-align: center;">^</td>
|
||||
<td><code>\\textasciicircumflex</code></td>
|
||||
<td style="text-align: center;">~</td>
|
||||
<td><code>\\textasciitilde</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;">*</td>
|
||||
<td><code>\\textasteriskcentered</code></td>
|
||||
<td style="text-align: center;">\</td>
|
||||
<td><code>\\textbackslash</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;">|</td>
|
||||
<td><code>\\textbar</code></td>
|
||||
<td style="text-align: center;">∙</td>
|
||||
<td><code>\\textbullet</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;">ⓒ</td>
|
||||
<td><code>\\textcopyright</code></td>
|
||||
<td style="text-align: center;">†</td>
|
||||
<td><code>\\textdagger</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;">‡</td>
|
||||
<td><code>\\textdaggerdbl</code></td>
|
||||
<td style="text-align: center;">…</td>
|
||||
<td><code>\\textellipsis</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;"><</td>
|
||||
<td><code>\\textless</code></td>
|
||||
<td style="text-align: center;">></td>
|
||||
<td><code>\\textgreater</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;">‰</td>
|
||||
<td><code>\\textperthousand</code></td>
|
||||
<td style="text-align: center;">§</td>
|
||||
<td><code>\\textsection</code></td>
|
||||
</tr>
|
||||
</table>
|
||||
<p>… und so ziemlich alles andere.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Sonderzeichen & Symbole</h2>
|
||||
<h3>Mathmode</h3>
|
||||
<p>Einige Sonderzeichen und Symbole funktionieren nur in einer Mathematikumgebung:</p>
|
||||
<pre class="lang-tex hljs"><code>% griechische Buchstaben
|
||||
$\pi \Sigma \delta$
|
||||
|
||||
% Kreuz
|
||||
$\dagger$</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Sonderzeichen & Symbole</h2>
|
||||
<h3>Euro <span class="emoji">💸</span></h3>
|
||||
<ul>
|
||||
<li>Paket <code>eurosym</code></li>
|
||||
<li>Befehl <code>\euro</code></li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs"><code>LaTeX zu verwenden kostet 0 \euro.</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Sonderzeichen & Symbole</h2>
|
||||
<h3>Detexify to the rescue! <span class="emoji">⛑️</span></h3>
|
||||
<ul>
|
||||
<li>
|
||||
Symbole malen und erkennen lassen:
|
||||
<a href="http://detexify.kirelabs.org/classify.html">Detexify</a>
|
||||
</li>
|
||||
<li>
|
||||
Ausführliche Liste an verwendbaren Symbolen:
|
||||
<a href="http://tug.ctan.org/info/symbols/comprehensive/symbols-a4.pdf">PDF auf der CTAN-Webseite</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="4">Sonderzeichen einfügen</h2>
|
||||
<ul>
|
||||
<li>Ersetzt in Abschnitt 1.1.1 die Leerzeichen vor und nach dem Namen Knuth durch **geschützte Leerzeichen.**</li>
|
||||
<li class="fragment">Fügt in Abschnitt 1.2.1, Absatz 2, ein **halbes Leerzeichen** zwischen ›z.‹ und ›B.‹ von ›z.B.‹ ein.</li>
|
||||
<li class="fragment">In Abschnitt 1.2.2 stehen an mehren Stellen Bindestriche als **Gedankenstriche.** Tauscht sie durch Halbgeviertstriche aus.</li>
|
||||
<li class="fragment">In Abschnitt 1.2.1, Absatz 2, wird ein `"=` verwendet. Was passiert, wenn ihr stattdessen einen einfachen **Bindestrich** verwendet?</li>
|
||||
<li class="fragment">In Abschnitt 1.1.1 sollten »Tech« und »TeX« in **Anführungszeichen** stehen. Nutzt dafür `\enquote{…}`</li>
|
||||
<li class="fragment">Ersetzt die drei Punkte in 1.2.1, Absatz 2, durch eine echte **Ellipse.**</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,169 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Text­auszeichnung</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Hervorhebungen</h2>
|
||||
<p>Für Hervorhebungen im Fließtext eignet sich am besten der semantische Befehl `\emph{}` *(emphasis)*, der sich auch schachteln lässt:</p>
|
||||
<pre class="lang-tex hljs"><code>\emph{Wenn man in einem ganzen Haufen
|
||||
von wichtigem Text \emph{noch
|
||||
wichtigeren Text} verstecken will,
|
||||
hilft die Verschachtelung von
|
||||
Emphasen.}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/06/hervorhebungen-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Optische Auszeichnungen</h2>
|
||||
<p>… legen genau fest, wie Text formatiert wird:</p>
|
||||
<table>
|
||||
<tr><th>Bezeichnung</th><th>Befehl</th></tr>
|
||||
<tr><td>fett (bold face)</td><td><code>\textbf{important}</code></td></tr>
|
||||
<tr><td>kursiv (italics)</td><td><code>\textit{important}</code></td></tr>
|
||||
<tr><td>Kapitälchen (small caps)</td><td><code>\textsc{important}</code></td></tr>
|
||||
<tr><td>dicktengleich (teletype)</td><td><code>\texttt{important}</code></td></tr>
|
||||
<tr><td>geneigt (slanted)</td><td><code>\textsl{important}</code></td></tr>
|
||||
<tr><td>unterstrichen</td><td><code>\underline{important}</code></td></tr>
|
||||
<tr><td>tiefgestellt</td><td><code>\textsubscript{…}</code></td></tr>
|
||||
<tr><td>hochgestellt</td><td><code>\textsuperscript{…}</code></td></tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/06/optische-auszeichnungen-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Auszeichnungen schachteln</h2>
|
||||
<p>Möglich, solange die verwendete Schrift den entsprechenden Schnitt enthält:</p>
|
||||
<pre class="lang-tex hljs"><code>\textbf{Very
|
||||
\textit{Important
|
||||
\textsc{Stuff}
|
||||
}
|
||||
}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/06/auszeichnungen-schachteln-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Schriftgröße</h2>
|
||||
<div class="box warning">
|
||||
<p><strong>Ein gutgemeinter Rat: Better Call ~~Saul~~ LaTeX!</strong></p>
|
||||
<p>Konsistentes Aussehen über das gesamte Dokument hinweg gewünscht?</p>
|
||||
<p>Voreinstellungen von LaTeX zur Schriftgröße verschiedener Textelemente (Titel, Fließtext, Fußnoten) vertrauen!</p>
|
||||
<p>Das heißt im Umkehrschluss: Möglichst wenig manuell an Schriftgrößen herumschrauben.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Schriftgröße</h2>
|
||||
<h3>`normalsize`</h3>
|
||||
<ul>
|
||||
<li>Wird für den Fließtext verwendet</li>
|
||||
<li>Standard: 10pt</li>
|
||||
<li>Kann in der Präambel folgendermaßen verändert werden:</li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs"><code>\documentclass[12pt]{article}</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Schriftgröße</h2>
|
||||
<h3>Voreingestellte Schriftgrößen</h3>
|
||||
<pre class="lang-txt hljs"><code>{\<fontsize> ein Textabschnitt}</code></pre>
|
||||
<p>Zur Auswahl: immer relativ zu `normalsize`</p>
|
||||
<pre class="lang-tex hljs"><code>{\tiny Wenn}
|
||||
{\footnotesize du}
|
||||
{\small das}
|
||||
{\normalsize lesen}
|
||||
{\large kannst,}
|
||||
{\Large brauchst}
|
||||
{\LARGE du}
|
||||
{\huge keine}
|
||||
{\Huge Brille.}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img class="thin-padding" src="sections/german/06/schriftgroesse-optiker-crop.svg">
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Schriftgröße</h2>
|
||||
<h3>Manuelle Konfiguration möglich</h3>
|
||||
<pre class="lang-txt hljs"><code>\fontsize{<schriftgröße>}{<zeilenhöhe>}
|
||||
\selectfont</code></pre>
|
||||
<p>Beispiel:</p>
|
||||
<pre class="lang-tex hljs"><code>Das ist Text in normaler Schriftgröße.
|
||||
|
||||
\fontsize{1cm}{1.25cm}\selectfont
|
||||
Das ist eine Textpassage in
|
||||
wirklich riesiger Schrift.
|
||||
|
||||
\normalsize
|
||||
Back to normal.</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img class="thin-padding" src="sections/german/06/schriftgroesse-fontsize-befehl-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>URLs</h2>
|
||||
<p>Das Paket `hyperref` stellt den Befehl `\url{}` bereit, der URLs</p>
|
||||
<ul>
|
||||
<li>zeichentreu</li>
|
||||
<li>mit bindestrichlosen Umbrüchen</li>
|
||||
<li>mit gut unterscheidbaren Zeichen</li>
|
||||
<li>im PDF anklickbar</li>
|
||||
</ul>
|
||||
<p>wiedergibt.</p>
|
||||
<pre class="lang-tex hljs">`\url{https://www.latex-project.org/}`</pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/06/url-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="5">Text hervorheben</h2>
|
||||
<ul>
|
||||
<li>**Betont** das Wort »Pakete« in Abschnitt 1.1.2 mit `\emph{…}`.</li>
|
||||
<li class="fragment">Probiert auch an beliebigen Stellen **optische Hervorhebungen** aus, entfernt sie aber wieder, wenn ihr ein aufgeräumtes Dokument erhalten wollt.</li>
|
||||
<li class="fragment">Auf der zweiten Seite des Dokuments steht ein Absatz zum LaTeX-Wochenende. Ergänzt dort einen **Link** zum VC-Kurs (https://wiai.de/latex).</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,59 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Absatz­formatierung</h1>
|
||||
<div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Flattersatz</h2>
|
||||
<p>Standardmäßig setzt LaTeX Fließtext im Blocksatz, aber auch Flattersatz ist möglich.</p>
|
||||
<pre class="lang-tex hljs"><code>\raggedright … \raggedleft …
|
||||
\centering …</code></pre>
|
||||
<p>Alternativ einsetzbare Umgebungen:</p>
|
||||
<pre class="lang-tex hljs"><code>\begin{flushleft} Text \end{flushleft}
|
||||
\begin{flushright} Text \end{flushright}
|
||||
\begin{center} Text \end{center}</code></pre>
|
||||
<p data-category="Achtung!">Guter Flattersatz ist noch schwieriger als guter Blocksatz, daher lieber vermeiden!</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/07/ausrichtung-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Einzüge und Abstände</h2>
|
||||
<ul>
|
||||
<li>Absätze werden standardmäßig durch Erstzeileneinzüge (`\parindent`) verdeutlicht</li>
|
||||
<li>Stattdessen (!) können auch Abstände (`\parskip`) verwendet werden</li>
|
||||
<li>Die beiden Parameter sind beliebig einstellbar:</li>
|
||||
</ul>
|
||||
<pre class="lang-tex hljs"><code>\setlength{\parindent}{0pt}
|
||||
\setlength{\parskip}{1em
|
||||
plus .5em % erlaubte Dehnung
|
||||
minus .5em % erlaubte Stauchung
|
||||
}</code></pre>
|
||||
<ul>
|
||||
<li>Mit `\noindent` kann für nur einen Absatz der Einzug abgeschaltet werden</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/07/einzüge-abstände-orig.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="6">Absätze formatieren</h2>
|
||||
<ul>
|
||||
<li class="fragment">Seht euch auf der Titelseite an, wie **Abstände und Ausrichtungen** genutzt werden. Spielt ein wenig mit den Einstellungen und beobachtet, was sich verändert. Benutzt die Undo-Funktion, wenn ihr euch verlaufen habt ;)</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,150 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Aufzählungen</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Ungeordnete Listen <span class="emoji">📜</span></h2>
|
||||
<pre class="lang-tex hljs"><code>\begin{itemize}
|
||||
\item Nudelplatten
|
||||
\item Passierte Tomaten, % …
|
||||
\item Oregano, Basilikum, % …
|
||||
\item Mozzarella
|
||||
\item Mehl
|
||||
\item Milch
|
||||
\end{itemize}</code></pre>
|
||||
<p>Die einzelnen Stichpunkte werden in jeder Aufzählungsumgebung durch den Befehl <code>\item</code> gekennzeichnet.</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/08/itemize-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Geordnete Listen und Definitionslisten</h2>
|
||||
<pre class="lang-tex hljs"><code>\begin{enumerate}
|
||||
\item die Zwiebeln in einem Topf % …
|
||||
\item passierte Tomaten, Möhren % …
|
||||
\item mit Kräutern und Gewürzen % …
|
||||
% \item …
|
||||
\end{enumerate}</code></pre>
|
||||
<pre class="lang-tex hljs fragment"><code>\begin{description}
|
||||
\item [Béchamelsauce] Béchamel % …
|
||||
\item [Lasagne] Als Lasagne % …
|
||||
\end{description}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview" style="display: flex; flex-direction: column;">
|
||||
<img class="thin-padding" src="sections/german/08/enumerate-crop.svg" style="margin-bottom: 0;">
|
||||
<img class="thin-padding fragment" src="sections/german/08/definition-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Kompakte Listen</h2>
|
||||
<p>Das Paket <code>paralist</code> stellt Aufzählungen ohne riesige Zwischenräume zur Verfügung.</p>
|
||||
<pre class="lang-tex hljs"><code>\section{Zutaten}
|
||||
\begin{compactitem}
|
||||
% \item …
|
||||
\end{compactitem}
|
||||
\section{Zubereitung}
|
||||
\begin{compactenum}
|
||||
% \item …
|
||||
\end{compactenum}
|
||||
\section{Glossar}
|
||||
\begin{compactdesc}
|
||||
% \item …
|
||||
\end{compactdesc}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/08/compact-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Aufzählung im Absatz</h2>
|
||||
<p>Neben den kompakten Listen stellt <code>paralist</code> auch Listen zur Verfügung, die in einem Absatz stehen.</p>
|
||||
<pre class="lang-tex hljs"><code>Folgende Kräuter sind für % …
|
||||
\begin{inparaitem}
|
||||
\item Liebstöckel
|
||||
\item Petersilie
|
||||
\item Schnittlauch
|
||||
\end{inparaitem}</code></pre>
|
||||
<p>Natürlich gibt es auch hier ein Pendant namens <code>inparaenum</code> für geordnete Listen.</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img class="thin-padding" src="sections/german/08/paralist-extended-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Verschachtelte Listen</h2>
|
||||
<pre class="lang-tex hljs"><code>\begin{compactitem}
|
||||
% …
|
||||
\item Gemüse \begin{compactitem}
|
||||
\item Passierte Tomaten
|
||||
\item Möhren
|
||||
\item Erbsen
|
||||
\item Zwiebeln
|
||||
\end{compactitem}
|
||||
\item Kräuter \begin{compactenum}
|
||||
\item Oregano
|
||||
\item Basilikum
|
||||
\item Rosmarin
|
||||
\end{compactenum}
|
||||
% …
|
||||
\end{compactitem}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/08/nested-lists-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Aufzählungsarten</h2>
|
||||
<p>Die Art der Aufzählung lässt sich über den optionalen Parameter <code>label</code> ändern. Hierfür ist das Paket <code>enumitem</code> notwendig.</p>
|
||||
<pre class="lang-tex hljs"><code>% Römische Zahlen
|
||||
\begin{enumerate}[label=\roman\*]
|
||||
% …
|
||||
% Arabische Zahlen
|
||||
\begin{enumerate}[label=\arabic\*]
|
||||
% …
|
||||
% Alphabetisch
|
||||
\begin{enumerate}[label=\alph\*]
|
||||
% …</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/08/list-style-types-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="7">Aufzählungen einfügen</h2>
|
||||
<ul>
|
||||
<li>Formatiert die einzelnen Vor- und Nachteile in Abschnitt 1.2.3 als **ungeordnete Listen.**</li>
|
||||
<li class="fragment">Formatiert den Arbeitsablauf in Abschnitt 1.2.4 als **geordnete Liste.** Die Ziffern im Code sollen nicht stehen bleiben.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,193 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Mathematische Formeln</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Formel-Umgebungen <span class="emoji">🧮</span></h2>
|
||||
<pre class="lang-tex hljs"><code>$2 \sqrt{\frac{\pi^2}{3} \cdot c_2}$</code></pre>
|
||||
<p>Mathematische Formeln können <strong>nur im sogenannten Mathmode</strong> gesetzt werden, der inline durch zwei Dollarzeichen aktiviert wird. Außerdem gibt es eine Blockumgebung:</p>
|
||||
<pre class="lang-tex hljs"><code>\begin{equation}
|
||||
2 \sqrt{\frac{\pi^2}{3} \cdot c_2}
|
||||
\end{equation}</code></pre>
|
||||
<p>Pakete: <code>amsmath</code>, <code>amsthm</code>, <code>amssymb</code>, <code>mathtools</code></p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/09/simple-maths-crop.svg" style="max-height: 100%;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Einige Beispiele</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Quelltext</th>
|
||||
<th>Ergebnis</th>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>\sqrt{16}</code></td>
|
||||
<td>$\sqrt{16}$</td>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>\frac{3}{4}</code></td>
|
||||
<td>$\frac{3}{4}$</td>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>e^{\pi}</code></td>
|
||||
<td>$e^{\pi}$</td>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>\sum\_{i=1}^{n}x^2</code></td>
|
||||
<td>$\sum_{i=1}^{n} x^2$</td>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>12 \leq 4 x^2 + 13</code></td>
|
||||
<td>$12 \leq 4 x^2 + 13$</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p class="fragment">Durch <code>^{…}</code> und <code>_{…}</code> werden die Inhalte in den Klammern hoch- oder tiefgestellt.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Einige Beispiele</h2>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Quelltext</th>
|
||||
<th>Ergebnis</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>(x), [x], \lbrace x\rbrace, \lvert x\rvert</code></td>
|
||||
<td>$(x), [x], \lbrace x\rbrace, \lvert x\rvert$</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\exists, \forall, \in, \notin, \infty</code></td>
|
||||
<td>$\exists,\forall,\in,\notin,\infty$</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\alpha, \beta, \Gamma, \Delta, \varepsilon, \pi</code></td>
|
||||
<td>$\alpha, \beta, \Gamma, \Delta, \varepsilon, \pi$</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>\rightarrow, \leftarrow, \Rightarrow, \Leftarrow, \Leftrightarrow</code></td>
|
||||
<td>$\rightarrow, \leftarrow, \Rightarrow, \Leftarrow, \Leftrightarrow$</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>(A \cup B) \cap C</code></td>
|
||||
<td>$(A \cup B) \cap C$</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>(A \lor B) \land C</code></td>
|
||||
<td>$(A \lor B) \land C$</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>(A \cdot B) \times C</code></td>
|
||||
<td>$(A \cdot B) \times C$</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h3>Mitwachsende Klammern</h3>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Quelltext</th>
|
||||
<th>Ergebnis</th>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>\left( \frac{1}{2} \right)</code></td>
|
||||
<td>$\left(\frac{1}{2} \right)$</td>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>\left\lbrace \frac{1}{2} \right\rbrace</code></td>
|
||||
<td>$\left\lbrace\frac{1}{2} \right\rbrace$</td>
|
||||
</tr>
|
||||
<tr class="fragment">
|
||||
<td><code>\left[ \frac{1}{2} \right]</code></td>
|
||||
<td>$\left[\frac{1}{2} \right]$</td>
|
||||
</tr>
|
||||
</table>
|
||||
<pre class="fragment hljs lang-tex"><code>$4 \cdot \left( \frac{1}{2} % …</code></pre>
|
||||
<p class="fragment" style="text-align: center;">$4 \cdot \left(\frac{1}{2} +\frac{3}{ 12 \cdot \left( 2 + \frac{1}{86 \cdot \left(\frac{1}{2} + 24 \right)} \right)} \right)$</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Darstellung von Grenzen</h2>
|
||||
<p>Mit dem Befehl <code>\limits</code> lassen sich die Grenzen von Integralen unter und über dem Integralzeichen darstellen. Bei Summen, Produkten und Grenzwerten geschieht das automatisch.</p>
|
||||
<pre class="hljs lang-tex"><code>\sum\_{i=1}^{n^2}(x+2)
|
||||
\prod\_{j=1}^{100}(3 \cdot x)
|
||||
\lim\_{x \rightarrow \infty}(14x^3 - 12)
|
||||
\int\limits\_{-12}^{4}(14x^3 - 12)</code></pre>
|
||||
<p data-category="Achtung!">Der Einsatz von <code>\limits</code> sollte im Fließtext vermieden werden.</p>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/09/limits-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Ausrichtung von mehreren Gleichungen</h2>
|
||||
<p>Die Umgebung <code>align</code> erlaubt es, Gleichungen zum Beispiel am »=« auszurichten.</p>
|
||||
<pre class="hljs lang-tex"><code>\begin{align}
|
||||
13 \cdot (4a - 3)^2 &= 13 … \\\\
|
||||
&= 208a^2 - 312a + 117
|
||||
\end{align}</code></pre>
|
||||
<ul>
|
||||
<li class="fragment">Ausgerichtet wird am »&«-Zeichen.</li>
|
||||
<li class="fragment">Zeilenumbrüche werden mit »\\\\« eingefügt.</li>
|
||||
<li class="fragment">Die Nummerierung kann bei `align` und `equation` durch durch ein Sternchen nach dem Umgebungsnamen (z. B. <code>\begin{align\*}</code> und <code>\end{align\*}</code>) unterdrückt werden.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/09/alignment-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h3>Mengenschreibweise</h3>
|
||||
<p>Manchmal ist es notwendig, im Zusammenhang mit der Mengenschreibweise Prädikate unter Verwendung von textuellen Beschreibungen oder längeren Funktionsnamen zu definieren.</p>
|
||||
|
||||
<p>Für diesen Fall gibt es den Befehl <code>\mathrm{}</code>.</p>
|
||||
|
||||
<p style="text-align: center;">$\left\lbrace x \mid tiefe(x) \geq 20\right\rbrace$</p>
|
||||
<p class="fragment" style="text-align: center;">$\left\lbrace x \mid \mathrm{tiefe}(x) \geq 20\right\rbrace$</p>
|
||||
<pre class="fragment hljs lang-tex"><code>$\left\lbrace x \mid \mathrm{tiefe}(x) …</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="8">Formeln setzen</h2>
|
||||
<ul>
|
||||
<li>Bindet die Dateien <code>eingabefile.tex</code>, <code>textsatz.tex</code> und <code>mathematik.tex</code> wieder ein, indem ihr den Befehl <code>\includeonly</code> in <code>l2kurz.tex</code> ändert.</li>
|
||||
<li>Kompiliert anschließend das gesamte Projekt erneut.</li>
|
||||
<li>Seht euch Kapitel 4 an und fügt einen neuen Abschnitt 4.5 mit eurer Lieblings**formel** ein.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,119 +0,0 @@
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h1>Quelltext-Listings</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Installation <span class="emoji">🖥️</span></h2>
|
||||
<p>
|
||||
Mit dem Paket <code>minted</code> lässt sich Quelltext gut darstellen. Dafür wird die Programmiersprache Python benötigt.
|
||||
</p>
|
||||
<p>
|
||||
Nach der <a href="https://www.python.org/">Installation von Python</a> kann das zugehörige Paket <a href="http://pygments.org/"><code>Pygments</code></a> in der Eingabeaufforderung installiert werden durch:
|
||||
</p>
|
||||
<pre class="lang-bash hljs"><code>pip install Pygments</code></pre>
|
||||
<p>Anschließend muss das LaTeX-Paket nur noch eingebunden werden:</p>
|
||||
<pre class="lang-tex hljs"><code>\usepackage{minted}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/10/minted-overview-crop.svg" style="padding: 2rem;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2>Anpassungen beim Kompilieren</h2>
|
||||
<div class="box warning">
|
||||
<p>
|
||||
Um Dokumente mit Quelltext-Listings kompilieren zu können, muss die Flag <code>--shell-escape</code> an den Compiler übergeben werden.
|
||||
</p>
|
||||
</div>
|
||||
<p>
|
||||
In TeXstudio muss diese unter <strong><code>Optionen > TeXstudio konfigurieren > Befehle</code></strong>
|
||||
bei <code>PdfLaTeX</code> vor <code>%.tex</code> ergänzt werden:
|
||||
</p>
|
||||
<p>
|
||||
<code style="font-size:85%;">pdflatex -syntex=1 -interaction=nonstopmode <strong>--shell-escape</strong> %.tex</code></pre>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Code im LaTeX-Quelltext</h2>
|
||||
<p class="fragment">In einer eigenen Umgebung:</p>
|
||||
<pre class="lang-tex hljs fragment"><code>\section\*{Haskell-Magie}
|
||||
Quadrate aller geraden % …
|
||||
\begin{minted}{haskell}
|
||||
[x^2 | x <- [1..200], even x]
|
||||
\end{minted}</code></pre>
|
||||
<p class="fragment">Inline im Quelltext:</p>
|
||||
<pre class="lang-tex hljs fragment"><code>\section\*{Ein HTML-Beispiel}
|
||||
Eine Überschrift wird so ausgezeichnet:
|
||||
\mint{html}|<h2>LaTeX im Studium</h2>|.</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/10/minted-haskell-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-and-preview">
|
||||
<div class="layout-content">
|
||||
<h2>Code aus externen Dateien</h2>
|
||||
<p>Um Redundanz zu vermeiden, ist es manchmal praktisch, den Quelltext direkt aus der Quelldatei einzulesen.</p>
|
||||
<pre class="lang-tex hljs"><code>\section\*{Einfache Java-Anwendung}
|
||||
\inputminted{java}{Test.java}</code></pre>
|
||||
<pre class="lang-java hljs" data-sourcefile="Test.java"><code>public class HelloWorld {
|
||||
public static void main(/\*…\*/) {
|
||||
System.out.println(/\*…\*/);
|
||||
}
|
||||
}</code></pre>
|
||||
</div>
|
||||
<div class="layout-preview">
|
||||
<img src="sections/german/10/minted-java-crop.svg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2><code>Minted</code> konfigurieren</h2>
|
||||
<p>
|
||||
Durch optionale Parameter können Zeilennummerierung, Umbrüche und Farben ausgewählt werden. Außerdem sind zahlreiche Themes verfügbar.
|
||||
</p>
|
||||
<pre class="hljs lang-tex"><code>\usemintedstyle{monokai}
|
||||
\begin{minted}[
|
||||
linenos=true,
|
||||
breaklines=true,
|
||||
]{javascript}
|
||||
% ...
|
||||
\end{minted}</code></pre>
|
||||
<p><span class="emoji">🔗</span> <a href="https://www.overleaf.com/learn/latex/Code_Highlighting_with_minted">Einführung</a> und <a href="https://ctan.kako-dev.de/macros/latex/contrib/minted/minted.pdf">offizielle Dokumentation</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
---
|
||||
|
||||
<div class="layout-content-only">
|
||||
<div class="layout-content">
|
||||
<h2 data-category="Aufgabe" data-task="9">Quelltext einbinden</h2>
|
||||
<ul>
|
||||
<li>Abschnitt 2.4 enthält zwei auskommentierte **Listings.**</li>
|
||||
<li class="fragment">Bindet zunächst das **Paket `minted`** an der richtigen Stelle ein.</li>
|
||||
<li class="fragment">Nutzt die **`minted`-Umgebung**, um das erste Listing mit Syntax Highlighting zu versehen.</li>
|
||||
<li class="fragment">Lagert das zweite Listing in eine **neue Datei** aus und bindet sie mit `\inputminted` ein.</li>
|
||||
<li class="fragment">Ändert das **Farbschema** zu `borland`.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user