diff --git a/.cc/{{cookiecutter.demo_name}}/slides/{{cookiecutter.demo_name}}.md.jinja b/.cc/{{cookiecutter.demo_name}}/slides/{{cookiecutter.demo_name}}.md.jinja
index 1e7feae..e8de639 100644
--- a/.cc/{{cookiecutter.demo_name}}/slides/{{cookiecutter.demo_name}}.md.jinja
+++ b/.cc/{{cookiecutter.demo_name}}/slides/{{cookiecutter.demo_name}}.md.jinja
@@ -1,6 +1,7 @@
---
marp: true
theme: default
+class: invert
author: {{ cookiecutter.demo_author }}
# size 16:9 1280px 720px
size: 16:9
@@ -8,7 +9,7 @@ paginate: true
math: mathjax
style: |
:root {
- background: linear-gradient(to left, #abbaab, #ffffff);
+ background: linear-gradient(to bottom, #000000, #434343);
}
img[alt~="custom"] {
float: right;
@@ -28,7 +29,7 @@ style: |
background-color: transparent;
}
pre {
- background: linear-gradient(to top, #abbaab, #ffffff);
+ background: linear-gradient(to top, #000000, #434343);
background-color: transparent;
}
---
@@ -46,7 +47,7 @@ _paginate: false
{% now 'local', '%d/%m/%Y' %}
```
-![bg right fit](img/github-mark-white.webp)
+![bg right](img/leonardo-yip-unsplash.jpg)
---
@@ -54,7 +55,7 @@ _paginate: false
-![bg right ](img/pexels-suzy-hazelwood-1226398.jpg)
+![bg right opacity:75%](img/pexels-suzy-hazelwood-1226398.jpg)
- item1
- item2
@@ -64,7 +65,7 @@ _paginate: false
-![bg left opacity:80%](img/pexels-ann-h-7186206.jpg)
+![bg left opacity:75%](img/pexels-ann-h-7186206.jpg)
# Q&A
diff --git a/.vscode/settings.json b/.vscode/settings.json
index a29412d..1dd43f1 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -9,5 +9,23 @@
"**.txt.jinja": "jinja",
"**Makefile.jinja": "jinja",
"**.cfg.jinja": "jinja"
- }
+ },
+ "markdown.marp.themes": [
+ "./slides/themes/dracula.css"
+ ],
+ "markdownlint.config": {
+ "default": true,
+ // allow multiple H1s for Marp
+ "MD025": false,
+ "MD033": {
+ "allowed_elements": [
+ "div",
+ "span",
+ "style",
+ "br",
+ "sup"
+ ]
+ }
+ },
+ "markdown.marp.enableHtml": true
}
\ No newline at end of file
diff --git a/slides/avd-cvaas-evpn-aa.md b/slides/avd-cvaas-evpn-aa.md
index 701b3d5..1dc7dec 100644
--- a/slides/avd-cvaas-evpn-aa.md
+++ b/slides/avd-cvaas-evpn-aa.md
@@ -1,6 +1,7 @@
---
marp: true
theme: default
+class: invert
author: Petr Ankudinov
# size 16:9 1280px 720px
size: 16:9
@@ -8,7 +9,7 @@ paginate: true
math: mathjax
style: |
:root {
- background: linear-gradient(to left, #abbaab, #ffffff);
+ background: linear-gradient(to bottom, #000000, #434343);
}
img[alt~="custom"] {
float: right;
@@ -28,7 +29,7 @@ style: |
background-color: transparent;
}
pre {
- background: linear-gradient(to top, #abbaab, #ffffff);
+ background: linear-gradient(to top, #000000, #434343);
background-color: transparent;
}
---
@@ -46,7 +47,7 @@ Petr Ankudinov
31/03/2024
```
-![bg right fit](img/github-mark-white.webp)
+![bg right](img/leonardo-yip-unsplash.jpg)
---
@@ -54,7 +55,7 @@ Petr Ankudinov
-![bg right ](img/pexels-suzy-hazelwood-1226398.jpg)
+![bg right opacity:75%](img/pexels-suzy-hazelwood-1226398.jpg)
- item1
- item2
@@ -64,7 +65,7 @@ Petr Ankudinov
-![bg left opacity:80%](img/pexels-ann-h-7186206.jpg)
+![bg left opacity:75%](img/pexels-ann-h-7186206.jpg)
# Q&A
diff --git a/slides/img/leonardo-yip-unsplash.jpg b/slides/img/leonardo-yip-unsplash.jpg
new file mode 100644
index 0000000..f361099
Binary files /dev/null and b/slides/img/leonardo-yip-unsplash.jpg differ
diff --git a/slides/themes/dracula.css b/slides/themes/dracula.css
new file mode 100644
index 0000000..9f1736e
--- /dev/null
+++ b/slides/themes/dracula.css
@@ -0,0 +1,330 @@
+@charset "UTF-8";
+/*!
+ * Marp Dracula theme.
+ * @theme dracula
+ * @author Daniel Nicolas Gisolfi
+ *
+ * @auto-scaling true
+ * @size 4:3 960px 720px
+ * @size 16:9 1280px 720px
+ */
+
+@import url("https://fonts.googleapis.com/css?family=Lato:400,900|IBM+Plex+Sans:400,700");
+
+:root {
+ --dracula-background: #282a36;
+ --dracula-current-line: #44475a;
+ --dracula-foreground: #f8f8f2;
+ --dracula-comment: #6272a4;
+ --dracula-cyan: #8be9fd;
+ --dracula-green: #50fa7b;
+ --dracula-orange: #ffb86c;
+ --dracula-pink: #ff79c6;
+ --dracula-purple:#bd93f9;
+ --dracula-red: #ff5555;
+ --dracula-yellow: #f1fa8c;
+}
+
+.hljs {
+ display: block;
+ overflow-x: auto;
+ padding: 0.5em;
+ background: var(--dracula-background);
+}
+
+/* Dracula Foreground */
+.hljs,
+.hljs-subst,
+.hljs-typing,
+.hljs-variable,
+.hljs-template-variable {
+ color: var(--dracula-foreground);
+}
+
+/* Dracula Comment */
+.hljs-comment,
+.hljs-quote,
+.hljs-deletion {
+ color: var(--dracula-comment);
+}
+
+/* Dracula Cyan */
+.hljs-meta .hljs-doctag,
+.hljs-built_in,
+.hljs-selector-tag,
+.hljs-section,
+.hljs-link,
+.hljs-class {
+ color: var(--dracula-cyan);
+}
+
+
+/* Dracula Green */
+.hljs-title {
+ color: var(--dracula-green);
+}
+
+/* Dracula Orange */
+.hljs-params {
+ color: var(--dracula-orange);
+}
+
+/* Dracula Pink */
+.hljs-keyword {
+ color: var(--dracula-pink);
+}
+
+/* Dracula Purple */
+.hljs-literal,
+.hljs-number {
+ color: var(--dracula-purple);
+}
+
+/* Dracula Red */
+.hljs-regexp {
+ color: var(--dracula-red);
+}
+
+/* Dracula Yellow */
+.hljs-string,
+.hljs-name,
+.hljs-type,
+.hljs-attr,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-addition,
+.hljs-template-tag {
+ color: var(--dracula-yellow);
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-literal,
+.hljs-title,
+.hljs-section,
+.hljs-doctag,
+.hljs-type,
+.hljs-name,
+.hljs-strong {
+ font-weight: bold;
+}
+
+.hljs-params,
+.hljs-emphasis {
+ font-style: italic;
+}
+
+svg[data-marp-fitting=svg] {
+ max-height: 580px;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ margin: 0.5em 0 0 0;
+ color: var(--dracula-pink);
+}
+h1 strong,
+h2 strong,
+h3 strong,
+h4 strong,
+h5 strong,
+h6 strong {
+ font-weight: inherit;
+}
+
+h1 {
+ font-size: 1.8em;
+}
+
+h2 {
+ font-size: 1.5em;
+}
+
+h3 {
+ font-size: 1.3em;
+}
+
+h4 {
+ font-size: 1.1em;
+}
+
+h5 {
+ font-size: 1em;
+}
+
+h6 {
+ font-size: 0.9em;
+}
+
+p,
+blockquote {
+ margin: 1em 0 0 0;
+}
+
+ul > li,
+ol > li {
+ margin: 0.3em 0 0 0;
+ color: var(--dracula-cyan);
+}
+ul > li > p,
+ol > li > p {
+ margin: 0.6em 0 0 0;
+}
+
+code {
+ display: inline-block;
+ font-family: "IBM Plex Mono", monospace;
+ font-size: 0.8em;
+ letter-spacing: 0;
+ margin: -0.1em 0.15em;
+ padding: 0.1em 0.2em;
+ vertical-align: baseline;
+ color: var(--dracula-green);
+}
+
+pre {
+ display: block;
+ margin: 1em 0 0 0;
+ min-height: 1em;
+ overflow: visible;
+}
+pre code {
+ box-sizing: border-box;
+ margin: 0;
+ min-width: 100%;
+ padding: 0.5em;
+ font-size: 0.7em;
+}
+pre code svg[data-marp-fitting=svg] {
+ max-height: calc(580px - 1em);
+}
+
+blockquote {
+ margin: 1em 0 0 0;
+ padding: 0 1em;
+ position: relative;
+ color: var(--dracula-orange);
+}
+blockquote::after, blockquote::before {
+ content: "“";
+ display: block;
+ font-family: "Times New Roman", serif;
+ font-weight: bold;
+ position: absolute;
+ color: var(--dracula-green);
+}
+blockquote::before {
+ top: 0;
+ left: 0;
+}
+blockquote::after {
+ right: 0;
+ bottom: 0;
+ transform: rotate(180deg);
+}
+blockquote > *:first-child {
+ margin-top: 0;
+}
+
+mark {
+ background: transparent;
+}
+
+table {
+ border-spacing: 0;
+ border-collapse: collapse;
+ margin: 1em 0 0 0;
+}
+table th,
+table td {
+ padding: 0.2em 0.4em;
+ border-width: 1px;
+ border-style: solid;
+}
+
+section {
+ font-size: 35px;
+ font-family: "IBM Plex Sans";
+ line-height: 1.35;
+ letter-spacing: 1.25px;
+ padding: 70px;
+ color: var(--dracula-foreground);
+ background-color: var(--dracula-background);
+}
+section > *:first-child,
+section > header:first-child + * {
+ margin-top: 0;
+}
+section a,
+section mark {
+ color: var(--dracula-red);
+}
+section code {
+ background: var(--dracula-current-line);
+ color: var(--dracula-current-green);
+}
+section h1 strong,
+section h2 strong,
+section h3 strong,
+section h4 strong,
+section h5 strong,
+section h6 strong {
+ color: var(--dracula-current-line);
+}
+section pre > code {
+ background: var(--dracula-current-line);
+}
+section header,
+section footer,
+section section::after,
+section blockquote::before,
+section blockquote::after {
+ color: var(--dracula-comment);
+}
+section table th,
+section table td {
+ border-color: var(--dracula-current-line);
+}
+section table thead th {
+ background: var(--dracula-current-line);
+ color: var(--dracula-yellow);
+}
+section table tbody > tr:nth-child(even) td,
+section table tbody > tr:nth-child(even) th {
+ background: var(--dracula-current-line);
+}
+
+header,
+footer,
+section::after {
+ box-sizing: border-box;
+ font-size: 66%;
+ height: 70px;
+ line-height: 50px;
+ overflow: hidden;
+ padding: 10px 25px;
+ position: absolute;
+ color: var(--dracula-comment);
+}
+
+header {
+ left: 0;
+ right: 0;
+ top: 0;
+}
+
+footer {
+ left: 0;
+ right: 0;
+ bottom: 0;
+}
+
+section::after {
+ right: 0;
+ bottom: 0;
+ font-size: 80%;
+}
\ No newline at end of file