ccchb/themen-hugo-35c3-reveal
ccchb
/
themen-hugo-35c3-reveal
mirror of https://dev.ccchb.de/genofire/themen-hugo-35c3-reveal.git
3
0
Fork 0
Code Releases Activity

Presentations can add their own HTML to the layout 

This will be the recommended way to add custom CSS and JS on a per-presentation basis. Global layout extensions remain the same.
This commit is contained in:
dzello 2018-08-13 17:41:06 +02:00
parent 1f99371394
commit 216135e004
3 changed files with 41 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
exampleSite/layouts/partials/home/reveal-hugo/body.html Normal file
View File

@ -0,0 +1,9 @@
<!-- This partial is included before the end of the body tag for only the 'example' presentation -->
<!-- A common use would be to add JavaScript to the page to customize interactions -->
<!-- The Reveal.js JavaScript API is located at https://github.com/hakimel/reveal.js/#api -->
<script type="text/javascript">
// Log the current slide to the console when it changes
Reveal.addEventListener('slidechanged', function(event) {
console.log("🎞️ Slide is now " + event.indexh);
});
</script>

18
exampleSite/layouts/partials/home/reveal-hugo/head.html Normal file
View File

@ -0,0 +1,18 @@
<!-- This partial is included before the end of the head tag for only the 'example' presentation -->
<!-- A common use would be to add CSS to the page to customize the theme -->
<style>
/* Add padding, margin and a hover effect on code samples */
.reveal section pre {
box-shadow: none;
margin-top: 25px;
margin-bottom: 25px;
border: 1px solid lightgrey;
}
.reveal section pre:hover {
border: 1px solid grey;
transition: border 0.3s ease;
}
.reveal section pre > code {
padding: 10px;
}
</style>

21
layouts/_default/baseof.reveal.html
View File

@ -30,17 +30,19 @@
link.href = window.location.search.match( /print-pdf/gi ) ? '{{ $reveal_cdn}}/css/print/pdf.css' : '{{ $reveal_cdn }}/css/print/paper.css'; link.href = window.location.search.match( /print-pdf/gi ) ? '{{ $reveal_cdn}}/css/print/pdf.css' : '{{ $reveal_cdn }}/css/print/paper.css';
document.getElementsByTagName( 'head' )[0].appendChild( link ); document.getElementsByTagName( 'head' )[0].appendChild( link );
</script> </script>
<!-- To insert markup before the closing head tag, create layouts/partials/reveal-hugo/head.html --> <!-- To insert markup before the closing head tag for all presentations,
create layouts/partials/reveal-hugo/head.html -->
{{- partial "reveal-hugo/head" . -}} {{- partial "reveal-hugo/head" . -}}
<!-- To insert markup at the end of the head tag for a specific presentation,
create layouts/partials/{section}/reveal-hugo/head.html -->
{{- $sectionHeadPartial := printf "%s/reveal-hugo/head" (.Page.Section | default "home") -}}
{{- if fileExists (printf "layouts/partials/%s.html" $sectionHeadPartial) -}}{{ partial $sectionHeadPartial . }}{{- end }}
</head> </head>
<body> <body>
{{- block "main" . -}}{{- end -}} {{- block "main" . -}}{{- end -}}
<script type="application/json" id="reveal-hugo-site-params">{{ jsonify .Site.Params.reveal_hugo | safeJS }}</script> <script type="application/json" id="reveal-hugo-site-params">{{ jsonify .Site.Params.reveal_hugo | safeJS }}</script>
<script type="application/json" id="reveal-hugo-page-params">{{ jsonify .Page.Params.reveal_hugo | safeJS }}</script> <script type="application/json" id="reveal-hugo-page-params">{{ jsonify .Page.Params.reveal_hugo | safeJS }}</script>
<script type="text/javascript"> <script type="text/javascript"> window.revealHugoDependencies = { dependencies: [ { src: '{{ $reveal_cdn }}/lib/js/classList.js', condition: function() { return !document.body.classList; } },
window.revealHugoDependencies = {
dependencies: [
{ src: '{{ $reveal_cdn }}/lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: '{{ $reveal_cdn }}/plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } }, { src: '{{ $reveal_cdn }}/plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: '{{ $reveal_cdn }}/plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } }, { src: '{{ $reveal_cdn }}/plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: '{{ $reveal_cdn }}/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } }, { src: '{{ $reveal_cdn }}/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
@ -78,7 +80,12 @@
revealHugoDependencies); revealHugoDependencies);
Reveal.initialize(options); Reveal.initialize(options);
</script> </script>
<!-- To insert markup before the closing body tag, create layouts/partials/reveal-hugo/body.html --> <!-- To insert markup before the closing body tag for all presentations,
{{ partial "reveal-hugo/body" . }} create layouts/partials/reveal-hugo/body.html -->
{{- partial "reveal-hugo/body" . }}
<!-- To insert markup at the end of the head tag for a specific presentation,
create layouts/partials/{section}/reveal-hugo/body.html -->
{{- $sectionBodyPartial := printf "%s/reveal-hugo/body" (.Page.Section | default "home") -}}
{{- if fileExists (printf "layouts/partials/%s.html" $sectionBodyPartial) -}}{{ partial $sectionBodyPartial . }}{{- end }}
</body> </body>
</html> </html>