Commit 8bd7abf9 authored by ak's avatar ak
Browse files

fix file not exist error on export

parent ea37d79e
Pipeline #2145 passed with stage
in 16 seconds
......@@ -411,13 +411,13 @@ figure:hover img:hover, figure:focus img:focus{
}
.icon{
max-width: 10em;
max-width: 5em;
padding: 0.5em;
transition: 0.5s ease;
}
.icon:hover, .icon:focus{
max-width: 10em;
max-width: 5em;
border-radius: 50%;
padding: 0.5em;
background-color: goldenrod;
......@@ -453,4 +453,12 @@ html {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.icon{
max-width: 10em;
}
.icon:hover, .icon:focus{
max-width: 10em;
}
\ No newline at end of file
......@@ -16,30 +16,42 @@
# Pictures and Embedds
---
## Pictures and Links
Regular picture is transformed into a `<figure>` HTML tag with `<figcaption>`
![Walk Way](walkway.jpg)
---
This may be a link, e.g. to the copyright holders page if not public domain
![[Link](https://wikipedia.org)](link-symbol.svg)
---
An Icon with `class="icon"`
[<img alt="Link Symbol" class="icon" src="link-symbol.svg">](https://wikipedia.org)
---
Full width picture
<img alt="Full width picture" width=100% src="black-arrow.svg">
---
Local pictures should just be dropped into the post folder. In this case: `.examples/picture_test`. The same goes for any other local content.
## Embedds
Basically all HTML Tags are simply passed through to index.html just like <em>this emphasized text</em>. To make a **bold** point, in a markdown document you can simply emphasize *like this*.
---
#### Youtube Embedded Video
This is an iframe pointing to youtube and thus breaking the no-js paradigm of this example web site.
......@@ -48,6 +60,8 @@ This is an iframe pointing to youtube and thus breaking the no-js paradigm of th
Just look into `./examples/picture_test/index.md` to get the picture, e.g. [here](https://git.c3pb.de/ak/pykyll/-/blob/master/examples/picture_test/index.md).
---
As Pykyll comes as a no-JS website, i.e. without any client side scripting, using the HTML5 Video Tag seems the better option for a low traffic web site.
### HTML5 Video
......@@ -56,6 +70,8 @@ This is a html `video` tag pointing to a file.
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
---
Here, the video is stored in a NextCloud instance. How to:
- Upload video
......@@ -71,6 +87,8 @@ Here, the video is stored in a NextCloud instance. How to:
**Tip** Pykyll features screen recording. Just [i] [r] from the main menu. A `.webm` and a `.gif` are created and placed in the root folder.
---
### Audio
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
......@@ -89,4 +107,4 @@ A better way to embedd audio files may be implemented in a future version. Contr
How-to with Pykyll
How to work with pictures, audio, iframe and video embedds
\ No newline at end of file
How to work with pictures, audio, iframe and video embedds
# Pictures and More
## How-to with Pykyll
- [Pictures and Embedds](#pictures-and-embedds)
- [Pictures and Links](#pictures-and-links)
- [Embedds](#embedds)
- [HTML5 Video](#html5-video)
- [Audio](#audio)
# Pictures and Embedds
---
## Pictures and Links
Regular picture is transformed into a `<figure>` HTML tag with `<figcaption>`
![Walk Way](walkway.jpg)
---
This may be a link, e.g. to the copyright holders page if not public domain
![[Link](https://wikipedia.org)](link-symbol.svg)
---
An Icon with `class="icon"`
[<img alt="Link Symbol" class="icon" src="link-symbol.svg">](https://wikipedia.org)
<<<<<<< HEAD
=======
---
>>>>>>> dev
Full width picture
<img alt="Full width picture" width=100% src="black-arrow.svg">
<<<<<<< HEAD
=======
---
>>>>>>> dev
Local pictures should just be dropped into the post folder. In this case: `.examples/picture_test`. The same goes for any other local content.
## Embedds
Basically all HTML Tags are simply passed through to index.html just like <em>this emphasized text</em>. To make a **bold** point, in a markdown document you can simply emphasize *like this*.
---
#### Youtube Embedded Video
This is an iframe pointing to youtube and thus breaking the no-js paradigm of this example web site.
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/-FBzpxJh5Ck" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Just look into `./examples/picture_test/index.md` to get the picture, e.g. [here](https://git.c3pb.de/ak/pykyll/-/blob/master/examples/picture_test/index.md).
<<<<<<< HEAD
As Pykyll comes as a no-JS website, i.e. without any client side scripting, using the HTML5 Video Tag seems the better option for a low traffic web site.
### HTML5 Video
This is a html `video` tag pointing to a file.
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
=======
---
As Pykyll comes as a no-JS website, i.e. without any client side scripting, using the HTML5 Video Tag seems the better option for a low traffic web site.
### HTML5 Video
This is a html `video` tag pointing to a file.
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
---
>>>>>>> dev
Here, the video is stored in a NextCloud instance. How to:
- Upload video
- Share public
- Append `/download` to the public share link
- In this document:
```html
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
<<<<<<< HEAD
```
**Tip** Pykyll features screen recording. Just [i] [r] from the main menu. A `.webm` and a `.gif` are created and placed in the root folder.
### Audio
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
```html
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
```
=======
```
**Tip** Pykyll features screen recording. Just [i] [r] from the main menu. A `.webm` and a `.gif` are created and placed in the root folder.
---
### Audio
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
```html
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
```
>>>>>>> dev
A better way to embedd audio files may be implemented in a future version. Contributions welcome.
---
#### Pictures and More
How-to with Pykyll
How to work with pictures, audio, iframe and video embedds
\ No newline at end of file
......@@ -2,39 +2,51 @@
author: ak
check: true
description: How to work with pictures, audio, iframe and video embedds
edit: 2021-Mar-16 10:14
edit: 2021-Mar-17 00:02
html: true
subtitle: How-to with Pykyll
title: Pictures and More
type: post
type: slides
---
# Pictures and Embedds
---
## Pictures and Links
Regular picture is transformed into a `<figure>` HTML tag with `<figcaption>`
![Walk Way](walkway.jpg)
---
This may be a link, e.g. to the copyright holders page if not public domain
![[Link](https://wikipedia.org)](link-symbol.svg)
---
An Icon with `class="icon"`
[<img alt="Link Symbol" class="icon" src="link-symbol.svg">](https://wikipedia.org)
---
Full width picture
<img alt="Full width picture" width=100% src="black-arrow.svg">
---
Local pictures should just be dropped into the post folder. In this case: `.examples/picture_test`. The same goes for any other local content.
## Embedds
Basically all HTML Tags are simply passed through to index.html just like <em>this emphasized text</em>. To make a **bold** point, in a markdown document you can simply emphasize *like this*.
---
#### Youtube Embedded Video
This is an iframe pointing to youtube and thus breaking the no-js paradigm of this example web site.
......@@ -43,6 +55,8 @@ This is an iframe pointing to youtube and thus breaking the no-js paradigm of th
Just look into `./examples/picture_test/index.md` to get the picture, e.g. [here](https://git.c3pb.de/ak/pykyll/-/blob/master/examples/picture_test/index.md).
---
As Pykyll comes as a no-JS website, i.e. without any client side scripting, using the HTML5 Video Tag seems the better option for a low traffic web site.
### HTML5 Video
......@@ -51,6 +65,8 @@ This is a html `video` tag pointing to a file.
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
---
Here, the video is stored in a NextCloud instance. How to:
- Upload video
......@@ -66,6 +82,8 @@ Here, the video is stored in a NextCloud instance. How to:
**Tip** Pykyll features screen recording. Just [i] [r] from the main menu. A `.webm` and a `.gif` are created and placed in the root folder.
---
### Audio
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
......@@ -78,4 +96,4 @@ Here, the video is stored in a NextCloud instance. How to:
A better way to embedd audio files may be implemented in a future version. Contributions welcome.
---
\ No newline at end of file
---
---
author: ak
check: true
description: How to work with pictures, audio, iframe and video embedds
<<<<<<< HEAD
edit: 2021-Mar-16 10:14
html: true
subtitle: How-to with Pykyll
title: Pictures and More
type: post
=======
edit: 2021-Mar-17 00:02
html: true
subtitle: How-to with Pykyll
title: Pictures and More
type: slides
>>>>>>> dev
---
# Pictures and Embedds
---
## Pictures and Links
Regular picture is transformed into a `<figure>` HTML tag with `<figcaption>`
![Walk Way](walkway.jpg)
---
This may be a link, e.g. to the copyright holders page if not public domain
![[Link](https://wikipedia.org)](link-symbol.svg)
---
An Icon with `class="icon"`
[<img alt="Link Symbol" class="icon" src="link-symbol.svg">](https://wikipedia.org)
<<<<<<< HEAD
=======
---
>>>>>>> dev
Full width picture
<img alt="Full width picture" width=100% src="black-arrow.svg">
<<<<<<< HEAD
=======
---
>>>>>>> dev
Local pictures should just be dropped into the post folder. In this case: `.examples/picture_test`. The same goes for any other local content.
## Embedds
Basically all HTML Tags are simply passed through to index.html just like <em>this emphasized text</em>. To make a **bold** point, in a markdown document you can simply emphasize *like this*.
---
#### Youtube Embedded Video
This is an iframe pointing to youtube and thus breaking the no-js paradigm of this example web site.
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/-FBzpxJh5Ck" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Just look into `./examples/picture_test/index.md` to get the picture, e.g. [here](https://git.c3pb.de/ak/pykyll/-/blob/master/examples/picture_test/index.md).
<<<<<<< HEAD
As Pykyll comes as a no-JS website, i.e. without any client side scripting, using the HTML5 Video Tag seems the better option for a low traffic web site.
### HTML5 Video
This is a html `video` tag pointing to a file.
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
=======
---
As Pykyll comes as a no-JS website, i.e. without any client side scripting, using the HTML5 Video Tag seems the better option for a low traffic web site.
### HTML5 Video
This is a html `video` tag pointing to a file.
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
---
>>>>>>> dev
Here, the video is stored in a NextCloud instance. How to:
- Upload video
- Share public
- Append `/download` to the public share link
- In this document:
```html
<video width="50%" controls src="https://cloud.harmlos.info/index.php/s/MZFPQf8Pk7g3xZp/download" type="video/ogg"></video>
```
**Tip** Pykyll features screen recording. Just [i] [r] from the main menu. A `.webm` and a `.gif` are created and placed in the root folder.
<<<<<<< HEAD
=======
---
>>>>>>> dev
### Audio
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
```html
<audio controls src="audio.mp3" type="audio/mpeg"></audio>
```
A better way to embedd audio files may be implemented in a future version. Contributions welcome.
---
\ No newline at end of file
......@@ -8,15 +8,17 @@
- [Enable TaskWarrior
# Proper Project Managment
## Proper Project Managment
with taskwarrior on the command line is supported by Pykyll.
## Enable TaskWarrior Integration
### Enable TaskWarrior Integration
Set `taskwarrior` in `.config.yml` to `true`. In Pykyll, just hit [e] and then select Change Configuration.
## Context is King
---
### Context is King
All tasks created from Pykyll are tagged with a `taskwarrior_context` which enables us to view them in this context. `taskwarrior_context` can be set in Pykylly configuration. We also set it up once in taskwarrior:
......@@ -26,6 +28,8 @@ All tasks created from Pykyll are tagged with a `taskwarrior_context` which ena
In this example, `taskwarrior_context` is the name of the context in taskwarrior and `+taskwarrior_context` is the tag the value of `taskwarrior_context` prepended by a `+` sign.
---
Thats it. Now Pykyll can drop a task for the text you are working on into taskwarrior and display all pykyll related tasks. Pykyll shorthand: [i][t] YOUR_POST
Use `taskwarrior context taskwarrior_context` to work on this project undistracted by your other tasks. `taskwarrior context none` resets the context.
......
......@@ -2,22 +2,24 @@
author: ak
check: true
description: Integrating to the project management stack
edit: 2021-Mar-12 21:50
edit: 2021-Mar-16 23:57
html: true
subtitle: How-to for Pykyll
title: Taskwarrior Integration
type: post
type: slides
---
# Proper Project Managment
## Proper Project Managment
with taskwarrior on the command line is supported by Pykyll.
## Enable TaskWarrior Integration
### Enable TaskWarrior Integration
Set `taskwarrior` in `.config.yml` to `true`. In Pykyll, just hit [e] and then select Change Configuration.
## Context is King
---
### Context is King
All tasks created from Pykyll are tagged with a `taskwarrior_context` which enables us to view them in this context. `taskwarrior_context` can be set in Pykylly configuration. We also set it up once in taskwarrior:
......@@ -27,6 +29,8 @@ All tasks created from Pykyll are tagged with a `taskwarrior_context` which ena
In this example, `taskwarrior_context` is the name of the context in taskwarrior and `+taskwarrior_context` is the tag the value of `taskwarrior_context` prepended by a `+` sign.
---
Thats it. Now Pykyll can drop a task for the text you are working on into taskwarrior and display all pykyll related tasks. Pykyll shorthand: [i][t] YOUR_POST
Use `taskwarrior context taskwarrior_context` to work on this project undistracted by your other tasks. `taskwarrior context none` resets the context.
......
......@@ -411,13 +411,13 @@ figure:hover img:hover, figure:focus img:focus{
}
.icon{
max-width: 10em;
max-width: 5em;
padding: 0.5em;
transition: 0.5s ease;
}
.icon:hover, .icon:focus{
max-width: 10em;
max-width: 5em;
border-radius: 50%;
padding: 0.5em;
background-color: goldenrod;
......@@ -453,4 +453,12 @@ html {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.icon{
max-width: 10em;
}
.icon:hover, .icon:focus{
max-width: 10em;
}
\ No newline at end of file
/**
* Custom styles overwriting and adding to the theme for reveal.js.
*
* by ak@c3pb
*
* Themes are kept in slides/cyber/css. Please edit there.
*/
.button {
background-color: darkred;
transition: 0.5s;
border: none;
color: white;
padding: 1em;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 1em;
margin: 0.4em 0.2em;
border-radius: 50%;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.5),
0 2px 2px rgba(0,0,0,0.3),
0 0 4px 1px rgba(0,0,0,0.2),
inset 0 3px 2px rgba(255,255,255,.22),
inset 0 -3px 2px rgba(0,0,0,.15),
inset 0 20px 10px rgba(255,255,255,.12),
0 0 4px 1px rgba(0,0,0,.1),
0 3px 2px rgba(0,0,0,.2);
}
.button:active {
-webkit-transform: scale(0.8);
transform: scale(0.8);
box-shadow:
inset 0 -2px 1px rgba(255,255,255,0.2),
inset 0 3px 2px rgba(0,0,0,0.12);
}
.button:hover {
-webkit-transform: scale(1.2);
transform: scale(1.2);
cursor: pointer;
}
a:hover {
cursor: pointer;
}
\ No newline at end of file
......@@ -83,7 +83,11 @@
<h1 class="title">Pictures and More</h1>
<p class="subtitle">How-to with Pykyll</p>
<p class="author">ak</p>
<<<<<<< HEAD
<p class="date">2021-Mar-16 10:14</p>
=======
<p class="date">2021-Mar-17 00:02</p>
>>>>>>> dev
</header>
<nav id="TOC" role="doc-toc">
<ul>
......@@ -103,34 +107,71 @@
</div>
<p>
How to work with pictures, audio, iframe and video embedds
<<<<<<< HEAD
=======
</p>
<table>
<tr>
<td>
<a href="slides.html?changethis"><img class="icon" src="../../images/slides.svg"></a>
</td>
<td>
<h2>
<a href="slides.html?changethis">Pictures and More</a> 👀