usar jsx y footer
This commit is contained in:
parent
a70549dd2c
commit
e0b4d9f375
11 changed files with 481 additions and 196 deletions
3
.vscode/settings.json
vendored
3
.vscode/settings.json
vendored
|
@ -3,6 +3,9 @@
|
||||||
"[html]": {
|
"[html]": {
|
||||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
},
|
},
|
||||||
|
"[javascriptreact]": {
|
||||||
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
|
},
|
||||||
"[css]": {
|
"[css]": {
|
||||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,15 +1,3 @@
|
||||||
const postcssImport = require("postcss-import");
|
|
||||||
const cssnano = require("cssnano");
|
|
||||||
const tailwind = require("tailwindcss");
|
|
||||||
const tailwindConfig = require("./tailwind.config");
|
|
||||||
const { readFile } = require("fs/promises");
|
|
||||||
const tailwindPlugin = tailwind(tailwindConfig);
|
|
||||||
const postcss = require("postcss")([
|
|
||||||
postcssImport(),
|
|
||||||
tailwindPlugin,
|
|
||||||
...(process.env.ELEVENTY_ENV === "production" ? [cssnano()] : []),
|
|
||||||
]);
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {import("@11ty/eleventy").UserConfig} eleventyConfig
|
* @param {import("@11ty/eleventy").UserConfig} eleventyConfig
|
||||||
*/
|
*/
|
||||||
|
@ -24,6 +12,10 @@ module.exports = function (eleventyConfig) {
|
||||||
});
|
});
|
||||||
eleventyConfig.addPassthroughCopy("src/**.png");
|
eleventyConfig.addPassthroughCopy("src/**.png");
|
||||||
|
|
||||||
|
eleventyConfig.addExtension(["11ty.jsx", "11ty.ts", "11ty.tsx"], {
|
||||||
|
key: "11ty.js",
|
||||||
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
dir: {
|
dir: {
|
||||||
input: "src",
|
input: "src",
|
||||||
|
|
|
@ -1,17 +1,19 @@
|
||||||
{
|
{
|
||||||
"name": "sitio",
|
"name": "sitio",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "eleventy --serve --quiet",
|
"serve": "NODE_OPTIONS='--require esbuild-register' eleventy --serve --quiet",
|
||||||
"build": "ELEVENTY_ENV=production eleventy"
|
"build": "ELEVENTY_ENV=production NODE_OPTIONS='--require esbuild-register' eleventy"
|
||||||
},
|
},
|
||||||
"author": "",
|
"author": "",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@11ty/eleventy": "^2.0.1",
|
"@11ty/eleventy": "^2.0.1",
|
||||||
"@types/node": "^20.3.3",
|
"@types/node": "^20.3.3",
|
||||||
"cssnano": "^6.0.1",
|
"cssnano": "^6.0.1",
|
||||||
|
"esbuild-register": "^3.4.2",
|
||||||
"postcss": "^8.4.24",
|
"postcss": "^8.4.24",
|
||||||
"postcss-import": "^15.1.0",
|
"postcss-import": "^15.1.0",
|
||||||
"prettier-plugin-tailwindcss": "^0.3.0",
|
"prettier-plugin-tailwindcss": "^0.3.0",
|
||||||
"tailwindcss": "^3.3.2"
|
"tailwindcss": "^3.3.2",
|
||||||
|
"vhtml": "^2.2.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
249
pnpm-lock.yaml
249
pnpm-lock.yaml
|
@ -14,6 +14,9 @@ devDependencies:
|
||||||
cssnano:
|
cssnano:
|
||||||
specifier: ^6.0.1
|
specifier: ^6.0.1
|
||||||
version: 6.0.1(postcss@8.4.24)
|
version: 6.0.1(postcss@8.4.24)
|
||||||
|
esbuild-register:
|
||||||
|
specifier: ^3.4.2
|
||||||
|
version: 3.4.2(esbuild@0.18.11)
|
||||||
postcss:
|
postcss:
|
||||||
specifier: ^8.4.24
|
specifier: ^8.4.24
|
||||||
version: 8.4.24
|
version: 8.4.24
|
||||||
|
@ -26,6 +29,9 @@ devDependencies:
|
||||||
tailwindcss:
|
tailwindcss:
|
||||||
specifier: ^3.3.2
|
specifier: ^3.3.2
|
||||||
version: 3.3.2
|
version: 3.3.2
|
||||||
|
vhtml:
|
||||||
|
specifier: ^2.2.0
|
||||||
|
version: 2.2.0
|
||||||
|
|
||||||
packages:
|
packages:
|
||||||
|
|
||||||
|
@ -148,6 +154,204 @@ packages:
|
||||||
to-fast-properties: 2.0.0
|
to-fast-properties: 2.0.0
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
|
/@esbuild/android-arm64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-snieiq75Z1z5LJX9cduSAjUr7vEI1OdlzFPMw0HH5YI7qQHDd3qs+WZoMrWYDsfRJSq36lIA6mfZBkvL46KoIw==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [android]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/android-arm@0.18.11:
|
||||||
|
resolution: {integrity: sha512-q4qlUf5ucwbUJZXF5tEQ8LF7y0Nk4P58hOsGk3ucY0oCwgQqAnqXVbUuahCddVHfrxmpyewRpiTHwVHIETYu7Q==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm]
|
||||||
|
os: [android]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/android-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-iPuoxQEV34+hTF6FT7om+Qwziv1U519lEOvekXO9zaMMlT9+XneAhKL32DW3H7okrCOBQ44BMihE8dclbZtTuw==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [android]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/darwin-arm64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-Gm0QkI3k402OpfMKyQEEMG0RuW2LQsSmI6OeO4El2ojJMoF5NLYb3qMIjvbG/lbMeLOGiW6ooU8xqc+S0fgz2w==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [darwin]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/darwin-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-N15Vzy0YNHu6cfyDOjiyfJlRJCB/ngKOAvoBf1qybG3eOq0SL2Lutzz9N7DYUbb7Q23XtHPn6lMDF6uWbGv9Fw==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [darwin]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/freebsd-arm64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-atEyuq6a3omEY5qAh5jIORWk8MzFnCpSTUruBgeyN9jZq1K/QI9uke0ATi3MHu4L8c59CnIi4+1jDKMuqmR71A==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [freebsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/freebsd-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-XtuPrEfBj/YYYnAAB7KcorzzpGTvOr/dTtXPGesRfmflqhA4LMF0Gh/n5+a9JBzPuJ+CGk17CA++Hmr1F/gI0Q==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [freebsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-arm64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-c6Vh2WS9VFKxKZ2TvJdA7gdy0n6eSy+yunBvv4aqNCEhSWVor1TU43wNRp2YLO9Vng2G+W94aRz+ILDSwAiYog==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-arm@0.18.11:
|
||||||
|
resolution: {integrity: sha512-Idipz+Taso/toi2ETugShXjQ3S59b6m62KmLHkJlSq/cBejixmIydqrtM2XTvNCywFl3VC7SreSf6NV0i6sRyg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-ia32@0.18.11:
|
||||||
|
resolution: {integrity: sha512-S3hkIF6KUqRh9n1Q0dSyYcWmcVa9Cg+mSoZEfFuzoYXXsk6196qndrM+ZiHNwpZKi3XOXpShZZ+9dfN5ykqjjw==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [ia32]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-loong64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-MRESANOoObQINBA+RMZW+Z0TJWpibtE7cPFnahzyQHDCA9X9LOmGh68MVimZlM9J8n5Ia8lU773te6O3ILW8kw==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [loong64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-mips64el@0.18.11:
|
||||||
|
resolution: {integrity: sha512-qVyPIZrXNMOLYegtD1u8EBccCrBVshxMrn5MkuFc3mEVsw7CCQHaqZ4jm9hbn4gWY95XFnb7i4SsT3eflxZsUg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [mips64el]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-ppc64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-T3yd8vJXfPirZaUOoA9D2ZjxZX4Gr3QuC3GztBJA6PklLotc/7sXTOuuRkhE9W/5JvJP/K9b99ayPNAD+R+4qQ==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [ppc64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-riscv64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-evUoRPWiwuFk++snjH9e2cAjF5VVSTj+Dnf+rkO/Q20tRqv+644279TZlPK8nUGunjPAtQRCj1jQkDAvL6rm2w==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [riscv64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-s390x@0.18.11:
|
||||||
|
resolution: {integrity: sha512-/SlRJ15XR6i93gRWquRxYCfhTeC5PdqEapKoLbX63PLCmAkXZHY2uQm2l9bN0oPHBsOw2IswRZctMYS0MijFcg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [s390x]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/linux-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-xcncej+wF16WEmIwPtCHi0qmx1FweBqgsRtEL1mSHLFR6/mb3GEZfLQnx+pUDfRDEM4DQF8dpXIW7eDOZl1IbA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [linux]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/netbsd-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-aSjMHj/F7BuS1CptSXNg6S3M4F3bLp5wfFPIJM+Km2NfIVfFKhdmfHF9frhiCLIGVzDziggqWll0B+9AUbud/Q==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [netbsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/openbsd-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-tNBq+6XIBZtht0xJGv7IBB5XaSyvYPCm1PxJ33zLQONdZoLVM0bgGqUrXnJyiEguD9LU4AHiu+GCXy/Hm9LsdQ==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [openbsd]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/sunos-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-kxfbDOrH4dHuAAOhr7D7EqaYf+W45LsAOOhAet99EyuxxQmjbk8M9N4ezHcEiCYPaiW8Dj3K26Z2V17Gt6p3ng==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [sunos]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/win32-arm64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-Sh0dDRyk1Xi348idbal7lZyfSkjhJsdFeuC13zqdipsvMetlGiFQNdO+Yfp6f6B4FbyQm7qsk16yaZk25LChzg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [arm64]
|
||||||
|
os: [win32]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/win32-ia32@0.18.11:
|
||||||
|
resolution: {integrity: sha512-o9JUIKF1j0rqJTFbIoF4bXj6rvrTZYOrfRcGyL0Vm5uJ/j5CkBD/51tpdxe9lXEDouhRgdr/BYzUrDOvrWwJpg==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [ia32]
|
||||||
|
os: [win32]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
|
/@esbuild/win32-x64@0.18.11:
|
||||||
|
resolution: {integrity: sha512-rQI4cjLHd2hGsM1LqgDI7oOCYbQ6IBOVsX9ejuRMSze0GqXUG2ekwiKkiBU1pRGSeCqFFHxTrcEydB2Hyoz9CA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
cpu: [x64]
|
||||||
|
os: [win32]
|
||||||
|
requiresBuild: true
|
||||||
|
dev: true
|
||||||
|
optional: true
|
||||||
|
|
||||||
/@iarna/toml@2.2.5:
|
/@iarna/toml@2.2.5:
|
||||||
resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==}
|
resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==}
|
||||||
dev: true
|
dev: true
|
||||||
|
@ -760,6 +964,47 @@ packages:
|
||||||
prr: 1.0.1
|
prr: 1.0.1
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
|
/esbuild-register@3.4.2(esbuild@0.18.11):
|
||||||
|
resolution: {integrity: sha512-kG/XyTDyz6+YDuyfB9ZoSIOOmgyFCH+xPRtsCa8W85HLRV5Csp+o3jWVbOSHgSLfyLc5DmP+KFDNwty4mEjC+Q==}
|
||||||
|
peerDependencies:
|
||||||
|
esbuild: '>=0.12 <1'
|
||||||
|
dependencies:
|
||||||
|
debug: 4.3.4
|
||||||
|
esbuild: 0.18.11
|
||||||
|
transitivePeerDependencies:
|
||||||
|
- supports-color
|
||||||
|
dev: true
|
||||||
|
|
||||||
|
/esbuild@0.18.11:
|
||||||
|
resolution: {integrity: sha512-i8u6mQF0JKJUlGR3OdFLKldJQMMs8OqM9Cc3UCi9XXziJ9WERM5bfkHaEAy0YAvPRMgqSW55W7xYn84XtEFTtA==}
|
||||||
|
engines: {node: '>=12'}
|
||||||
|
hasBin: true
|
||||||
|
requiresBuild: true
|
||||||
|
optionalDependencies:
|
||||||
|
'@esbuild/android-arm': 0.18.11
|
||||||
|
'@esbuild/android-arm64': 0.18.11
|
||||||
|
'@esbuild/android-x64': 0.18.11
|
||||||
|
'@esbuild/darwin-arm64': 0.18.11
|
||||||
|
'@esbuild/darwin-x64': 0.18.11
|
||||||
|
'@esbuild/freebsd-arm64': 0.18.11
|
||||||
|
'@esbuild/freebsd-x64': 0.18.11
|
||||||
|
'@esbuild/linux-arm': 0.18.11
|
||||||
|
'@esbuild/linux-arm64': 0.18.11
|
||||||
|
'@esbuild/linux-ia32': 0.18.11
|
||||||
|
'@esbuild/linux-loong64': 0.18.11
|
||||||
|
'@esbuild/linux-mips64el': 0.18.11
|
||||||
|
'@esbuild/linux-ppc64': 0.18.11
|
||||||
|
'@esbuild/linux-riscv64': 0.18.11
|
||||||
|
'@esbuild/linux-s390x': 0.18.11
|
||||||
|
'@esbuild/linux-x64': 0.18.11
|
||||||
|
'@esbuild/netbsd-x64': 0.18.11
|
||||||
|
'@esbuild/openbsd-x64': 0.18.11
|
||||||
|
'@esbuild/sunos-x64': 0.18.11
|
||||||
|
'@esbuild/win32-arm64': 0.18.11
|
||||||
|
'@esbuild/win32-ia32': 0.18.11
|
||||||
|
'@esbuild/win32-x64': 0.18.11
|
||||||
|
dev: true
|
||||||
|
|
||||||
/escalade@3.1.1:
|
/escalade@3.1.1:
|
||||||
resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
|
resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
|
||||||
engines: {node: '>=6'}
|
engines: {node: '>=6'}
|
||||||
|
@ -2235,6 +2480,10 @@ packages:
|
||||||
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
|
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
|
||||||
dev: true
|
dev: true
|
||||||
|
|
||||||
|
/vhtml@2.2.0:
|
||||||
|
resolution: {integrity: sha512-TPXrXrxBOslRUVnlVkiAqhoXneiertIg86bdvzionrUYhEuiROvyPZNiiP6GIIJ2Q7oPNVyEtIx8gMAZZE9lCQ==}
|
||||||
|
dev: true
|
||||||
|
|
||||||
/void-elements@3.1.0:
|
/void-elements@3.1.0:
|
||||||
resolution: {integrity: sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==}
|
resolution: {integrity: sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==}
|
||||||
engines: {node: '>=0.10.0'}
|
engines: {node: '>=0.10.0'}
|
||||||
|
|
18
src/_data/frontpageCuadrados.json
Normal file
18
src/_data/frontpageCuadrados.json
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
{
|
||||||
|
"celeste": {
|
||||||
|
"título": "Datos",
|
||||||
|
"content": "Lorem ipsum dolor, sit amet consectetur adipisicing elit. Temporibus, molestiae provident eum nam labore quam, magnam illo ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum iste iusto tempore quae."
|
||||||
|
},
|
||||||
|
"amarillo": {
|
||||||
|
"título": "Datos",
|
||||||
|
"content": "Lorem ipsum dolor, sit amet consectetur adipisicing elit. Temporibus, molestiae provident eum nam labore quam, magnam illo ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum iste iusto tempore quae."
|
||||||
|
},
|
||||||
|
"naranja": {
|
||||||
|
"título": "Datos",
|
||||||
|
"content": "Lorem ipsum dolor, sit amet consectetur adipisicing elit. Temporibus, molestiae provident eum nam labore quam, magnam illo ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum iste iusto tempore quae."
|
||||||
|
},
|
||||||
|
"violeta": {
|
||||||
|
"título": "Datos",
|
||||||
|
"content": "Lorem ipsum dolor, sit amet consectetur adipisicing elit. Temporibus, molestiae provident eum nam labore quam, magnam illo ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum iste iusto tempore quae."
|
||||||
|
}
|
||||||
|
}
|
22
src/_data/frontpageFooterButtons.json
Normal file
22
src/_data/frontpageFooterButtons.json
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"content": "¿Querés hackear el futuro?",
|
||||||
|
"buttonText": "Doná",
|
||||||
|
"buttonUrl": "// TODO:"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"content": "¿Querés transformar la educación de tu municipio?",
|
||||||
|
"buttonText": "Contactanos",
|
||||||
|
"buttonUrl": "// TODO:"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"content": "¿Querés acelerar la transformación digital de tu escuela?",
|
||||||
|
"buttonText": "Escribinos",
|
||||||
|
"buttonUrl": "// TODO:"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"content": "¿Sos docente y querés capacitarte?",
|
||||||
|
"buttonText": "Ingresá",
|
||||||
|
"buttonUrl": "// TODO:"
|
||||||
|
}
|
||||||
|
]
|
22
src/_data/frontpageNuevosSaberes.json
Normal file
22
src/_data/frontpageNuevosSaberes.json
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
[
|
||||||
|
{
|
||||||
|
"número": "01_",
|
||||||
|
"título": "Alfabetizaciones fusionadas",
|
||||||
|
"content": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, eos ducimus. Expedita, illo labore veniam fugit laborum obcaecati magnam sapiente corporis delectus excepturi aspernatur reiciendis est eveniet atque aut dignissimos?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"número": "02_",
|
||||||
|
"título": "Aprendizajes híbridos",
|
||||||
|
"content": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, eos ducimus. Expedita, illo labore veniam fugit laborum obcaecati magnam sapiente corporis delectus excepturi aspernatur reiciendis est eveniet atque aut dignissimos?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"número": "03_",
|
||||||
|
"título": "Orientaciones computacionales",
|
||||||
|
"content": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, eos ducimus. Expedita, illo labore veniam fugit laborum obcaecati magnam sapiente corporis delectus excepturi aspernatur reiciendis est eveniet atque aut dignissimos?"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"número": "04_",
|
||||||
|
"título": "Tecnopedagogía",
|
||||||
|
"content": "Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, eos ducimus. Expedita, illo labore veniam fugit laborum obcaecati magnam sapiente corporis delectus excepturi aspernatur reiciendis est eveniet atque aut dignissimos?"
|
||||||
|
}
|
||||||
|
]
|
145
src/index.11ty.jsx
Normal file
145
src/index.11ty.jsx
Normal file
|
@ -0,0 +1,145 @@
|
||||||
|
import h from "vhtml";
|
||||||
|
|
||||||
|
const postcssImport = require("postcss-import");
|
||||||
|
const cssnano = require("cssnano");
|
||||||
|
const { readFile } = require("fs/promises");
|
||||||
|
const tailwindPlugin = require("tailwindcss")(require("../tailwind.config"));
|
||||||
|
const postcss = require("postcss")([
|
||||||
|
postcssImport(),
|
||||||
|
tailwindPlugin,
|
||||||
|
...(process.env.ELEVENTY_ENV === "production" ? [cssnano()] : []),
|
||||||
|
]);
|
||||||
|
|
||||||
|
export async function render(data) {
|
||||||
|
console.debug(data);
|
||||||
|
//TODO: doctype
|
||||||
|
return (
|
||||||
|
<html lang="es">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<meta
|
||||||
|
name="viewport"
|
||||||
|
content="width=device-width, initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
|
||||||
|
/>
|
||||||
|
<title>Alfadatizando</title>
|
||||||
|
<style>{await tailwind()}</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<nav class="sticky top-0 w-full bg-blanco px-16 py-4">asdf</nav>
|
||||||
|
<section class="h-screen">
|
||||||
|
<div class="flex h-full">
|
||||||
|
<div class="h-full flex-1 bg-naranja">asdf</div>
|
||||||
|
<div class="h-full flex-1 bg-celeste">asd</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="min-h-screen bg-blanco p-32">
|
||||||
|
<div class="mb-4 flex justify-center gap-4">
|
||||||
|
<img class="aspect-[1.3] w-1/3" src="tmp_imagen_roja.png" />
|
||||||
|
<img class="aspect-[1.3] w-1/3" src="tmp_imagen_violeta.png" />
|
||||||
|
</div>
|
||||||
|
<img
|
||||||
|
class="mx-auto aspect-[1.94] w-5/12 object-contain"
|
||||||
|
src="tmp_imagen_azul.png"
|
||||||
|
/>
|
||||||
|
</section>
|
||||||
|
<section class="min-h-screen bg-blanco p-8">
|
||||||
|
<h2 class="pb-8 text-center text-5xl font-bold">Nuevos saberes</h2>
|
||||||
|
<div class="grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-4">
|
||||||
|
{data.frontpageNuevosSaberes.map(({ número, título, content }) => (
|
||||||
|
<div class="border-current flex-1 border-l px-6 py-6">
|
||||||
|
<h3 class="pb-4 font-mono text-2xl italic">{número}</h3>
|
||||||
|
<h3 class="pb-4 text-2xl font-bold">{título}</h3>
|
||||||
|
<p>{content}</p>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="flex min-h-screen place-content-center bg-blanco">
|
||||||
|
<div class="grid grid-cols-1 place-content-center xl:grid-cols-2">
|
||||||
|
{Object.entries(data.frontpageCuadrados).map(
|
||||||
|
([color, { título, content }]) => {
|
||||||
|
// ¿por qué así en vez de `bg-${color}`? para que lo detecte tailwind.
|
||||||
|
const bgs = {
|
||||||
|
celeste: "bg-celeste",
|
||||||
|
amarillo: "bg-amarillo",
|
||||||
|
naranja: "bg-naranja",
|
||||||
|
violeta: "bg-violeta",
|
||||||
|
};
|
||||||
|
const pos = {
|
||||||
|
celeste: "",
|
||||||
|
amarillo: "lg:order-last xl:order-none",
|
||||||
|
naranja: "xl:order-last",
|
||||||
|
violeta: "lg:order-last",
|
||||||
|
};
|
||||||
|
return (
|
||||||
|
<div class="grid lg:grid-cols-2">
|
||||||
|
<div
|
||||||
|
class={`aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll ${bgs[color]} ${pos[color]}`}
|
||||||
|
></div>
|
||||||
|
<div class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll p-8">
|
||||||
|
<h2 class="mb-4 text-4xl">{título}</h2>
|
||||||
|
<p>{content}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="grid min-h-screen grid-rows-1 items-end bg-[black] text-[white] lg:grid-cols-4">
|
||||||
|
<div class="col-span-3 flex h-full flex-col justify-end p-4">
|
||||||
|
<h2 class="mb-4 mt-16 font-mono text-3xl">
|
||||||
|
<strong>Caso:</strong>
|
||||||
|
<br />
|
||||||
|
Nuestra Señora del Rosario
|
||||||
|
</h2>
|
||||||
|
<iframe
|
||||||
|
class="aspect-video w-full"
|
||||||
|
src="https://www.youtube-nocookie.com/embed/NsT30qGayP4"
|
||||||
|
title="YouTube video player"
|
||||||
|
frameborder="0"
|
||||||
|
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||||
|
allowfullscreen
|
||||||
|
></iframe>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-start gap-4 p-4">
|
||||||
|
<p class="text-xl">
|
||||||
|
Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit
|
||||||
|
labore repellat delectus aliquam soluta dolore officia consectetur
|
||||||
|
ab quos quaerat, maiores earum molestiae assumenda, praesentium
|
||||||
|
nemo commodi repellendus iusto dolorum!
|
||||||
|
</p>
|
||||||
|
<a
|
||||||
|
class="border border-[white] bg-[black] p-3 font-mono text-xl font-bold uppercase"
|
||||||
|
target="_blank"
|
||||||
|
rel="noreferrer"
|
||||||
|
href="https://www.youtube.com/watch?v=NsT30qGayP4"
|
||||||
|
>
|
||||||
|
VER +
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="box-border grid w-full grid-cols-2 justify-center gap-[1px] gap-y-6 bg-amarillo px-[10%] py-12 md:grid-cols-4">
|
||||||
|
{data.frontpageFooterButtons.map(
|
||||||
|
({ content, buttonText, buttonUrl }) => (
|
||||||
|
<div class="flex flex-col justify-end">
|
||||||
|
<h2 class="px-3 pb-4 text-xl">{content}</h2>
|
||||||
|
<a
|
||||||
|
href={buttonUrl}
|
||||||
|
class="px-4 py-3 font-bold outline outline-1 outline-[black]"
|
||||||
|
>
|
||||||
|
{buttonText}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
</section>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function tailwind() {
|
||||||
|
const from = "src/tailwind.css";
|
||||||
|
return await postcss.process(await readFile(from, "utf-8"), { from });
|
||||||
|
}
|
180
src/index.html
180
src/index.html
|
@ -1,180 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="es">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta
|
|
||||||
name="viewport"
|
|
||||||
content="width=device-width, initial-scale=1, shrink-to-fit=no, viewport-fit=cover"
|
|
||||||
/>
|
|
||||||
<title>Alfadatizando</title>
|
|
||||||
<style>
|
|
||||||
/* prettier-ignore */
|
|
||||||
{%- tailwind -%}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<nav class="sticky top-0 w-full bg-blanco px-16 py-4">asdf</nav>
|
|
||||||
<section class="h-screen">
|
|
||||||
<div class="flex h-full">
|
|
||||||
<div class="h-full flex-1 bg-naranja">asdf</div>
|
|
||||||
<div class="h-full flex-1 bg-celeste">asd</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section class="min-h-screen bg-blanco p-32">
|
|
||||||
<div class="mb-4 flex justify-center gap-4">
|
|
||||||
<img class="aspect-[1.3] w-1/3" src="tmp_imagen_roja.png" />
|
|
||||||
<img class="aspect-[1.3] w-1/3" src="tmp_imagen_violeta.png" />
|
|
||||||
</div>
|
|
||||||
<img
|
|
||||||
class="mx-auto aspect-[1.94] w-5/12 object-contain"
|
|
||||||
src="tmp_imagen_azul.png"
|
|
||||||
/>
|
|
||||||
</section>
|
|
||||||
<section class="min-h-screen bg-blanco p-8">
|
|
||||||
<h2 class="pb-8 text-center text-5xl font-bold">Nuevos saberes</h2>
|
|
||||||
<div class="grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-4">
|
|
||||||
<div class="border-current flex-1 border-l px-6 py-6">
|
|
||||||
<h3 class="pb-4 font-mono text-2xl italic">01_</h3>
|
|
||||||
<h3 class="pb-4 text-2xl font-bold">Alfabetizaciones fusionadas</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, eos
|
|
||||||
ducimus. Expedita, illo labore veniam fugit laborum obcaecati magnam
|
|
||||||
sapiente corporis delectus excepturi aspernatur reiciendis est
|
|
||||||
eveniet atque aut dignissimos?
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="border-current flex-1 border-l px-6 py-6">
|
|
||||||
<h3 class="pb-4 font-mono text-2xl italic">02_</h3>
|
|
||||||
<h3 class="pb-4 text-2xl font-bold">Aprendizajes híbridos</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Aliquid ad
|
|
||||||
optio mollitia, odit eum blanditiis vitae ab explicabo nobis
|
|
||||||
deserunt sunt, assumenda, repellat nostrum culpa delectus excepturi
|
|
||||||
ratione voluptatibus molestiae.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="border-current flex-1 border-l px-6 py-6">
|
|
||||||
<h3 class="pb-4 font-mono text-2xl italic">03_</h3>
|
|
||||||
<h3 class="pb-4 text-2xl font-bold">Orientaciones computacionales</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Blanditiis
|
|
||||||
modi consectetur repellendus a sed explicabo, voluptates alias
|
|
||||||
maiores tenetur non atque et sequi! Velit obcaecati sapiente earum
|
|
||||||
fugiat ipsa sint.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="border-current flex-1 border-l px-6 py-6">
|
|
||||||
<h3 class="pb-4 font-mono text-2xl italic">04_</h3>
|
|
||||||
<h3 class="pb-4 text-2xl font-bold">Tecnopedagogía</h3>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam
|
|
||||||
iste modi iusto temporibus fugit aliquid alias eos, ullam officia
|
|
||||||
optio voluptatem praesentium sed omnis, et quia. Saepe voluptatibus
|
|
||||||
qui repudiandae.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section class="flex min-h-screen place-content-center bg-blanco">
|
|
||||||
<div class="grid grid-cols-1 place-content-center xl:grid-cols-2">
|
|
||||||
<div class="grid lg:grid-cols-2">
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll bg-celeste"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll p-8"
|
|
||||||
>
|
|
||||||
<h2 class="mb-4 text-4xl">Datos</h2>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
|
|
||||||
Temporibus, molestiae provident eum nam labore quam, magnam illo
|
|
||||||
ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum
|
|
||||||
iste iusto tempore quae.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="grid lg:grid-cols-2">
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll bg-amarillo lg:order-last xl:order-none"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll p-8"
|
|
||||||
>
|
|
||||||
<h2 class="mb-4 text-4xl">Datos</h2>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
|
|
||||||
Temporibus, molestiae provident eum nam labore quam, magnam illo
|
|
||||||
ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum
|
|
||||||
iste iusto tempore quae.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="grid lg:grid-cols-2">
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll bg-naranja xl:order-last"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll p-8"
|
|
||||||
>
|
|
||||||
<h2 class="mb-4 text-4xl">Datos</h2>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
|
|
||||||
Temporibus, molestiae provident eum nam labore quam, magnam illo
|
|
||||||
ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum
|
|
||||||
iste iusto tempore quae.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="grid lg:grid-cols-2">
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll bg-violeta lg:order-last"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
class="aspect-square h-auto w-full max-w-[24rem] overflow-y-scroll p-8"
|
|
||||||
>
|
|
||||||
<h2 class="mb-4 text-4xl">Datos</h2>
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor, sit amet consectetur adipisicing elit.
|
|
||||||
Temporibus, molestiae provident eum nam labore quam, magnam illo
|
|
||||||
ex doloribus amet nisi praesentium aperiam aliquid. Atque nostrum
|
|
||||||
iste iusto tempore quae.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section
|
|
||||||
class="grid min-h-screen grid-rows-1 items-end bg-[black] text-[white] lg:grid-cols-4"
|
|
||||||
>
|
|
||||||
<div class="col-span-3 flex h-full flex-col justify-end p-4">
|
|
||||||
<h2 class="mb-4 mt-16 font-mono text-3xl">
|
|
||||||
<strong>Caso:</strong><br />
|
|
||||||
Nuestra Señora del Rosario
|
|
||||||
</h2>
|
|
||||||
<iframe
|
|
||||||
class="aspect-video w-full"
|
|
||||||
src="https://www.youtube-nocookie.com/embed/NsT30qGayP4"
|
|
||||||
title="YouTube video player"
|
|
||||||
frameborder="0"
|
|
||||||
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
|
||||||
allowfullscreen
|
|
||||||
></iframe>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-col items-start gap-4 p-4">
|
|
||||||
<p class="text-xl">
|
|
||||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit
|
|
||||||
labore repellat delectus aliquam soluta dolore officia consectetur ab
|
|
||||||
quos quaerat, maiores earum molestiae assumenda, praesentium nemo
|
|
||||||
commodi repellendus iusto dolorum!
|
|
||||||
</p>
|
|
||||||
<a
|
|
||||||
class="border border-[white] bg-[black] p-3 font-mono text-xl font-bold uppercase"
|
|
||||||
target="_blank"
|
|
||||||
rel="noreferrer"
|
|
||||||
href="https://www.youtube.com/watch?v=NsT30qGayP4"
|
|
||||||
>VER +</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,6 +1,6 @@
|
||||||
/** @type {import('tailwindcss').Config} */
|
/** @type {import('tailwindcss').Config} */
|
||||||
module.exports = {
|
module.exports = {
|
||||||
content: ["./src/**/*.{html,liquid}"],
|
content: ["./src/**/*.{html,liquid,11ty.jsx}"],
|
||||||
theme: {
|
theme: {
|
||||||
extend: {},
|
extend: {},
|
||||||
colors: {
|
colors: {
|
||||||
|
|
12
tsconfig.json
Normal file
12
tsconfig.json
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "es2021" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
|
||||||
|
"jsx": "react" /* Specify what JSX code is generated. */,
|
||||||
|
"jsxFactory": "h" /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h' */,
|
||||||
|
"module": "commonjs" /* Specify what module code is generated. */,
|
||||||
|
"esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables `allowSyntheticDefaultImports` for type compatibility. */,
|
||||||
|
"forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
|
||||||
|
"strict": true /* Enable all strict type-checking options. */,
|
||||||
|
"skipLibCheck": true /* Skip type checking all .d.ts files. */
|
||||||
|
}
|
||||||
|
}
|
Reference in a new issue