Skip to content

Commit 55d3207

Browse files
atraliceatralice
committed
Initial commit
0 parents  commit 55d3207

File tree

16 files changed

+445
-0
lines changed

16 files changed

+445
-0
lines changed

‎.eleventy.js

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight')
2+
const eleventyNavigationPlugin = require('@11ty/eleventy-navigation')
3+
const toBootstrapNav = require('eleventy-navigation-bootstrap')
4+
const pluginTOC = require('eleventy-plugin-toc')
5+
const markdownIt = require('markdown-it')
6+
const markdownItAnchor = require('markdown-it-anchor')
7+
const markdownItHighlightJS = require('markdown-it-highlightjs')
8+
const readerBar = require('henry-reader-bar')
9+
const readingTime = require('henry-reading-time')
10+
11+
const mdOptions = {
12+
html: true,
13+
breaks: true,
14+
linkify: true,
15+
typographer: true,
16+
}
17+
18+
const mdAnchorOpts = {
19+
permalink: true,
20+
permalinkClass: 'anchor-link',
21+
permalinkSymbol: '',
22+
level: [1, 2, 3, 4],
23+
}
24+
25+
module.exports = function (eleventyConfig) {
26+
eleventyConfig.setLibrary(
27+
'md',
28+
markdownIt(mdOptions)
29+
.use(markdownItAnchor, mdAnchorOpts)
30+
.use(markdownItHighlightJS)
31+
)
32+
33+
eleventyConfig.addPlugin(eleventyNavigationPlugin)
34+
eleventyConfig.addPlugin(readingTime)
35+
eleventyConfig.addPlugin(readerBar)
36+
eleventyConfig.addPlugin(syntaxHighlight)
37+
38+
eleventyConfig.addPlugin(pluginTOC, {
39+
tags: ['h2', 'h3'],
40+
ul: true,
41+
})
42+
43+
eleventyConfig.addPassthroughCopy('_src/assets')
44+
45+
eleventyConfig.addNunjucksFilter('bootstrapNav', toBootstrapNav)
46+
47+
eleventyConfig.addLinter(
48+
'Spelling check',
49+
function (content, inputPath, outputPath) {
50+
let words = 'lenght, .lenght, .rigth'.split(',')
51+
52+
// Eleventy 1.0+: use this.inputPath and this.outputPath instead
53+
if (inputPath.endsWith('.md')) {
54+
for (let word of words) {
55+
let regexp = new RegExp('\\b(' + word + ')\\b', 'gi')
56+
if (content.match(regexp)) {
57+
console.warn(`Spelling check (${inputPath}) Found: ${word}`)
58+
}
59+
}
60+
}
61+
}
62+
)
63+
64+
return {
65+
dir: {
66+
layouts: '/_src/layouts',
67+
data: '/_src/data',
68+
output: '_dist',
69+
pathPrefix: '/Prep-Course/',
70+
},
71+
}
72+
}

‎.gitattributes

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Auto detect text files and perform LF normalization
2+
* text=auto

‎.gitignore

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
node_modules
2+
3+
# Eleventy build
4+
_dist
5+
package-lock.json

‎01 - La primera clase - Example/README.json

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"lessonTitle": "Primera clase",
3+
"feedbackID": "01-lesson1",
4+
"permalink": "/Tema_Uno/",
5+
"homeworkUrl": "https://github.com/soyHenry/Prep-Course/tree/main/05-JS-IV/homework",
6+
"eleventyNavigation": {
7+
"key": "Tema 1",
8+
"order": 1
9+
}
10+
}
11+

‎01 - La primera clase - Example/README.md

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
![HenryLogo](https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Assets/logo-henry-white-lg.png)
2+
3+
<!-- el logo de Henry se oculta en el build -->
4+
5+
# Ejemplo de H1
6+
7+
#### Ejemplo de anexo del H1
8+
9+
Este readme corresponde al contenido de una clase o lección.
10+
11+
## Qué cambia en este layout?
12+
13+
Para el contenido de las clases se utiliza el layout `lesson` por default (no hace falta setearlo).
14+
15+
Este layout incluye:
16+
17+
### Tabla de contenidos
18+
19+
Se genera una TOC a la izquierda de la pantalla (solo en web) con links de navegación a los H2 y H3 encontrados en el contenido.
20+
21+
### Tiempo de lectura
22+
23+
Se utiliza la librería personalizada `henry-reading-time` para establecer un tiempo de lectura aproximado.
24+
25+
### Botón de Homework
26+
27+
En caso de que la clase tenga homework (existencia de la variable `homeworkUrl`) se genera un botón junto al tiempo de lectura, con link a la homework.
28+
29+
### Botón de Feedback
30+
31+
En caso de que la clase tenga un `feedbackID` (correspondiente a *AirTable*) renderiza un botón que lleva a dicho form.
32+
33+
## Imágenes
34+
35+
Cualquier imagen que queramos incluir debe estar dentro de la carpeta `assets` (es posible incluir subcarpetas) y por default va a tener **_BoxShadow_**.
36+
37+
![unaImagenConBoxShadow](/_src/assets/1.png)
38+
39+
Si no queremos que tenga _BoxShadow_, sólo necesitamos ponerle al Alt text el valor `no-box`.
40+
41+
![no-box](/_src/assets/1.png)
42+
43+
Es ùtil especialmente para imagenes con fondo transparente, logos, etc.
44+
45+
![no-box](/_src/assets/2.png)
46+
47+
Morbi ultricies euismod tortor, eu finibus massa. In vehicula diam iaculis, pulvinar leo sed, aliquet leo. Suspendisse at hendrerit nisi, vitae finibus enim. Donec id pretium urna. Ut ullamcorper tortor sit amet dolor blandit, quis venenatis urna tempus. Curabitur efficitur blandit blandit. Aliquam placerat justo leo, ut porttitor turpis gravida sed. Suspendisse varius varius urna quis faucibus. Proin lacus erat, mollis nec finibus eget, lobortis vel metus. In elit quam, euismod vitae magna condimentum, cursus condimentum tellus. Quisque vel dictum ante, vel laoreet dolor. Suspendisse eleifend ut nibh nec mollis. Pellentesque dignissim, tortor at pellentesque porttitor, nisi lorem viverra turpis, ut viverra enim ipsum bibendum arcu. Donec lacinia cursus consequat. Fusce quis ultrices magna.
48+
49+
## Contenido oculto en la web
50+
51+
Si queremos mostrar contenido al visualizar el markdown desde nuestro editor de texto, o desde GitHub, pero *NO* cuando generamos el sitio web, debemos utilizar un elemento HTML con la clase `hide`.
52+
53+
Por ejemplo, debemos incluir un link al feedback para quienes esten viendo el contenido desde el editor, pero no queremos que aparezca en la web porque ya tenemos un botón para ello.
54+
55+
Acá tenemos un div con la clase hide, que en la web no se muestra:
56+
57+
<table class="hide" width="100%" style='table-layout:fixed;'>
58+
<tr>
59+
<td>
60+
<a href="https://airtable.com/shrSzEYT4idEFGB8d?prefill_clase=05-JS-IV">
61+
<img src="https://static.thenounproject.com/png/204643-200.png" width="100"/>
62+
<br>
63+
Hacé click acá para dejar tu feedback sobre esta clase.
64+
</a>
65+
</td>
66+
</tr>
67+
</table>
68+
69+
## Homework
70+
71+
Al final de cada lección generalmente ponemos un enlace a la homework. Al haber un H2 con el texto "Homework" el mismo tendrá un estilo propio.

‎02 - La segunda clase - Example/README.json

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"lessonTitle": "Segunda clase",
3+
"permalink": "/Tema_Dos/",
4+
"eleventyNavigation": {
5+
"key": "Tema 2",
6+
"order": 2
7+
}
8+
}

‎02 - La segunda clase - Example/README.md

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
![HenryLogo](https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Assets/logo-henry-white-lg.png)
2+
3+
# Ejemplo de H1
4+
5+
#### Ejemplo de anexo del H1
6+
7+
En esta clase no se incluyeron `feedbackID` ni `homeworkUrl` por ende los correspondientes botones no son renderizados.
8+
9+
## Un H2
10+
11+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sem nibh, sagittis nec velit vitae, suscipit consectetur augue. Morbi vel odio nunc. Cras vel lectus non dolor volutpat vulputate. Etiam feugiat est a massa tincidunt tincidunt. Vivamus imperdiet laoreet turpis, sed cursus magna rutrum nec. Phasellus dolor augue, facilisis ac ultricies eget, lacinia id dui. Vivamus faucibus semper diam non fermentum. Nulla congue consequat scelerisque. Cras in aliquam purus. Quisque scelerisque sodales dui vitae luctus. Sed vel ante vitae lorem sagittis rutrum.
12+
13+
Ut placerat ligula est, et interdum est vestibulum eu. Nulla eu leo nec est porta interdum non eu sapien. Curabitur sit amet mattis velit. Fusce sollicitudin condimentum nibh, sit amet eleifend nibh mattis et. Nulla elementum lorem at bibendum mollis. Nulla consectetur tortor ipsum, nec dictum diam sodales sit amet. Nunc placerat, orci a eleifend molestie, nibh odio convallis mi, nec sollicitudin arcu libero et neque. Sed consequat velit eget arcu lobortis, at mollis odio eleifend. Suspendisse nec faucibus ipsum. In sodales, ex nec maximus posuere, libero lectus blandit ipsum, vitae tempus velit turpis sed libero. Ut finibus neque sed dui sagittis rutrum. Maecenas vel magna molestie, faucibus est eget, maximus ipsum.
14+
15+
### Un H3
16+
17+
Morbi ultricies euismod tortor, eu finibus massa. In vehicula diam iaculis, pulvinar leo sed, aliquet leo. Suspendisse at hendrerit nisi, vitae finibus enim. Donec id pretium urna. Ut ullamcorper tortor sit amet dolor blandit, quis venenatis urna tempus. Curabitur efficitur blandit blandit. Aliquam placerat justo leo, ut porttitor turpis gravida sed. Suspendisse varius varius urna quis faucibus. Proin lacus erat, mollis nec finibus eget, lobortis vel metus. In elit quam, euismod vitae magna condimentum, cursus condimentum tellus. Quisque vel dictum ante, vel laoreet dolor. Suspendisse eleifend ut nibh nec mollis. Pellentesque dignissim, tortor at pellentesque porttitor, nisi lorem viverra turpis, ut viverra enim ipsum bibendum arcu. Donec lacinia cursus consequat. Fusce quis ultrices magna.
18+
19+
### Otro H3
20+
21+
Donec posuere suscipit congue. Aenean in bibendum velit. Fusce dignissim mattis augue id fringilla. Praesent eu odio elementum, mattis nulla vitae, fringilla sapien. Suspendisse rutrum ante ex, at volutpat arcu ullamcorper eget. Nulla nec laoreet sapien, eu ultrices nisi. Etiam mattis aliquet vehicula. Nullam non nunc dictum, accumsan ipsum ut, fermentum libero. Aliquam erat volutpat. In ultrices dui eget urna lobortis, scelerisque egestas elit blandit. Pellentesque ultricies, ipsum non venenatis aliquam, orci elit vehicula erat, sed cursus magna justo eu augue. Phasellus viverra aliquet neque, in convallis nisl feugiat sed. Sed eu justo mauris.
22+
23+
## Otro H2
24+
25+
Maecenas semper porttitor rhoncus. Quisque cursus dictum posuere. Nulla venenatis urna eu eros tristique, non tristique metus tempor. Proin eu enim a elit maximus fermentum. Cras et consectetur erat. Nam diam velit, viverra sed suscipit nec, vehicula at felis. Nam molestie diam ligula. Aliquam at erat et ex tempor efficitur. Aliquam ante metus, gravida sed blandit eget, maximus ac enim. Curabitur id orci quis nisi fermentum lacinia. Duis euismod leo eu turpis semper, vel gravida libero aliquet. Fusce ultricies mauris a massa rutrum, vel mattis felis vehicula. Nunc porttitor, massa vel rutrum volutpat, purus mauris accumsan leo, in placerat lacus sem a felis. Nullam mattis lacus vel ipsum congue tincidunt. Cras id leo augue. Etiam at risus in ipsum porttitor molestie.
26+
27+
## Homework
28+
29+
Curabitur dapibus sem nec tellus tempus, at placerat nibh varius. Ut rutrum mi mollis, faucibus orci sed, feugiat elit. Morbi hendrerit convallis nisi, in efficitur est ultricies ac. Fusce varius purus iaculis finibus lobortis. Vivamus accumsan enim non ipsum egestas vehicula. Morbi rhoncus neque at arcu mollis vulputate. Vestibulum porttitor et massa eu bibendum. Fusce mollis interdum nisl quis lacinia. In fermentum ultrices porttitor. Sed cursus commodo erat non vestibulum. Morbi a neque nibh. Etiam in volutpat quam. Vestibulum elit magna, sodales sed dignissim nec, auctor ac risus. Mauris pretium semper nisi. Cras cursus tellus vel molestie dignissim.

‎README.json

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"permalink": "/index.html",
3+
"layout": "intro",
4+
"eleventyNavigation": {
5+
"key": "Intro",
6+
"order": 0
7+
}
8+
}

‎README.md

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
![HenryLogo](https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Assets/logo-henry-white-lg.png)
2+
3+
# Content-template
4+
5+
#### Template para la creación de contenido académico
6+
7+
A partir de este repositorio se puede crear un sitio web, generado automáticamente a partir del contenido de sus archivos markdown.
8+
9+
## Readme principal
10+
11+
Este archivo principal contiene la introducción al contenido del repo. Utiliza el layout `intro` y no genera tabla de contenidos (índice), botón de feedback ni de homework.

‎_src/assets/1.png

11.8 KB
Loading

‎_src/assets/2.png

12.8 KB
Loading

‎_src/data/config.json

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"repoTitle": "Titulo del repo",
3+
"airtableFormId": "hash del formulario Airtable"
4+
}

‎_src/data/layout.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = 'lesson.njk'

‎_src/layouts/intro.njk

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
---
2+
logoNav: 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Assets/logo-henry-white-sm.png'
3+
favicon: 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Assets/favicon.png'
4+
---
5+
6+
<!DOCTYPE html>
7+
<html lang="en">
8+
<head>
9+
<meta charset="UTF-8">
10+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
11+
<script src="{{ 'https://kit.fontawesome.com/2c38f3d850.js' | url }}" crossorigin="anonymous"></script>
12+
<script src="{{ 'https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js' | url }}" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
13+
<link rel="icon" type="image/x-icon" href="{{ favicon }}">
14+
<link href="{{ 'https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css' | url }}" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
15+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/fonts.css' | url }}">
16+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/header.css' | url }}">
17+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/main.css' | url }}">
18+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/topbar.css' | url }}">
19+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/sidebar.css' | url }}">
20+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/lessonIntro.css' | url }}">
21+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/code.css' | url }}">
22+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/footer.css' | url }}">
23+
<link rel="stylesheet" href="{{ 'https://henry-11ty-resources.s3.sa-east-1.amazonaws.com/Styles/responsive.css' | url }}">
24+
<title>{{ config.repoTitle }}</title>
25+
</head>
26+
27+
<body>
28+
<div class="headerResponsive">
29+
<div class="leftContent">
30+
<span><img src="{{ logoNav | url }}" alt='logo Henry' height=22px class="d-inline-block align-text-top"></span><span>{{ config.repoTitle }}</span>
31+
</div>
32+
<div class="menuDiv">
33+
<input type="checkbox">
34+
<i class="fas fa-bars"></i>
35+
<i class="fas fa-times"></i>
36+
<nav>
37+
{{ collections.all | eleventyNavigation | eleventyNavigationToHtml | safe }}
38+
</nav>
39+
</div>
40+
</div>
41+
42+
<div class="headerContainer">
43+
<div class="headerContained">
44+
<img src="{{ logoNav | url }}" alt='logo Henry' height=27px class="d-inline-block align-text-top">
45+
<div>
46+
<span>{{ config.repoTitle }}</span>
47+
</div>
48+
</div>
49+
</div>
50+
51+
<main>
52+
<div class="topnav" id='myTopnav' >
53+
{# Navigation #}
54+
{{ collections.all | eleventyNavigation | bootstrapNav({
55+
listChildItemClass: "dropdown-menu shadow",
56+
activeKey: eleventyNavigation.key,
57+
listItemClass: "link",
58+
activeListItemClass: "activeLink"
59+
}) | safe }}
60+
</div>
61+
62+
<div class='lesson'>
63+
<div>
64+
{# Lesson (markdown content) #}
65+
{{ content | safe }}
66+
</div>
67+
</div>
68+
69+
</main>
70+
71+
</body>
72+
</html>

0 commit comments

Comments
 (0)