nouvelle page d’accueil annonçant Araberlin

main
Jalil Arfaoui 2022-11-27 23:00:04 +01:00
parent e89d13e0e5
commit 7b5e9a2f7d
5 changed files with 1071 additions and 50 deletions

View File

@ -1,10 +1,10 @@
require('dotenv').config() require('dotenv').config()
const { DateTime } = require("luxon"); const { DateTime } = require("luxon");
const pluginNavigation = require("@11ty/eleventy-navigation"); const pluginNavigation = require("@11ty/eleventy-navigation");
const markdownIt = require('markdown-it') const markdownIt = require('markdown-it')
const markdownItAttrs = require('markdown-it-attrs') const markdownItAttrs = require('markdown-it-attrs')
const Image = require("@11ty/eleventy-img");
const markdownItOptions = { const markdownItOptions = {
html: true, html: true,
@ -16,6 +16,26 @@ const parseDate = (date) => typeof date === 'string' ?
DateTime.fromISO(date) : DateTime.fromISO(date) :
DateTime.fromJSDate(date, {zone: 'utc'}) DateTime.fromJSDate(date, {zone: 'utc'})
async function imageShortcode(src, alt, sizes) {
let metadata = await Image(src, {
widths: [300, 600, 1200],
formats: ["webp", "jpg"],
outputDir: '_site/images/generated',
urlPath: '/images/generated'
});
let imageAttributes = {
alt,
sizes,
loading: "lazy",
decoding: "async",
};
// You bet we throw an error on missing alt in `imageAttributes` (alt="" works okay)
return Image.generateHTML(metadata, imageAttributes);
}
module.exports = function(eleventyConfig) { module.exports = function(eleventyConfig) {
eleventyConfig.addPlugin(pluginNavigation); eleventyConfig.addPlugin(pluginNavigation);
@ -59,6 +79,8 @@ module.exports = function(eleventyConfig) {
eleventyConfig.setFrontMatterParsingOptions({ excerpt: true }); eleventyConfig.setFrontMatterParsingOptions({ excerpt: true });
eleventyConfig.addAsyncShortcode("image", imageShortcode)
return { return {
dir: { dir: {
input: 'src' input: 'src'

1033
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -16,6 +16,7 @@
"devDependencies": { "devDependencies": {
"@11ty/eleventy": "^1.0.1", "@11ty/eleventy": "^1.0.1",
"@11ty/eleventy-navigation": "^0.3.3", "@11ty/eleventy-navigation": "^0.3.3",
"@11ty/eleventy-img": "^2.0.1",
"autoprefixer": "^10.4.7", "autoprefixer": "^10.4.7",
"concurrently": "^7.3.0", "concurrently": "^7.3.0",
"dotenv": "^16.0.1", "dotenv": "^16.0.1",

Binary file not shown.

After

Width:  |  Height:  |  Size: 118 KiB

View File

@ -2,51 +2,18 @@
layout: layouts/base.njk layout: layouts/base.njk
--- ---
<article class="w-2/3 mx-auto pt-24 pb-16">
<div data-elementor-type="wp-page" data-elementor-id="24" class="elementor elementor-24" data-elementor-settings="[]"> <p class="text-3xl font-bold">Nous démarrons notre futur projet !<br><br>
<div class="elementor-section-wrap"> Comme dhabitude, nous mettrons notre énergie, notre passion et notre expérience au service de la remarquable
<section class="elementor-section elementor-top-section elementor-element elementor-element-a91051b elementor-section-content-middle elementor-reverse-mobile elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="a91051b" data-element_type="section"> pièce ARABERLIN. Un texte de la non moins remarquable Jalila Baccar, que jai eu lhonneur et le privilège de
<div class="elementor-background-overlay"></div> rencontrer à Tunis en mars dernier.<br>
<div class="elementor-container elementor-column-gap-wide"> <br>
<div class="elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-885eee1" data-id="885eee1" data-element_type="column"> On vous tient au courant !</p>
<div class="elementor-widget-wrap elementor-element-populated">
<div class="elementor-element elementor-element-09a5a1b elementor-widget elementor-widget-text-editor" data-id="09a5a1b" data-element_type="widget" data-settings="{&quot;_animation&quot;:&quot;none&quot;}" data-widget_type="text-editor.default"> <p class="text-3xl font-bold">Malika</p>
<div class="elementor-widget-container">
<style>/*! elementor - v3.5.6 - 28-02-2022 */ <figure class="w-full lg:w-[600px] mx-auto">
.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:#818a91;color:#fff}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap{color:#818a91;border:3px solid;background-color:transparent}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap{margin-top:8px}.elementor-widget-text-editor:not(.elementor-drop-cap-view-default) .elementor-drop-cap-letter{width:1em;height:1em}.elementor-widget-text-editor .elementor-drop-cap{float:left;text-align:center;line-height:1;font-size:50px}.elementor-widget-text-editor .elementor-drop-cap-letter{display:inline-block}</style> <h2 style="text-align: center;">Cétait à Paris,&nbsp;</h2><h2 style="text-align: center;">Du 12 novembre au 18 décembre 2021,&nbsp;</h2><h2 style="text-align: center;">vendredi et samedi,</h2><h2 style="text-align: center;">&nbsp;À 21h30,</h2><h2 style="text-align: center;">&nbsp;Théâtre Clavel</h2> </div> {% image "./src/images/malika_avec_jalila_baccar.jpg", "Malika Zirari avec Jalila Baccar à Tunis", "(min-width: 30em) 50vw, 100vw" %}
</div> <figcaption>Malika Zirari avec Jalila Baccar à Tunis</figcaption>
</div> </figure>
</div> </article>
<div class="elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-68d57c9" data-id="68d57c9" data-element_type="column">
<div class="elementor-widget-wrap elementor-element-populated">
<div class="elementor-element elementor-element-1ec1cbf elementor-widget elementor-widget-image" data-id="1ec1cbf" data-element_type="widget" data-settings="{&quot;_animation&quot;:&quot;none&quot;,&quot;_animation_tablet&quot;:&quot;none&quot;}" data-widget_type="image.default">
<div class="elementor-widget-container">
<style>/*! elementor - v3.5.6 - 28-02-2022 */
.elementor-widget-image{text-align:center}.elementor-widget-image a{display:inline-block}.elementor-widget-image a img[src$=".svg"]{width:48px}.elementor-widget-image img{vertical-align:middle;display:inline-block}</style>
<a href="/images/Affiche.jpg" data-elementor-open-lightbox="yes" data-elementor-lightbox-title="&quot;IL&quot; - Affiche par Mehdi Arfaoui" e-action-hash="#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJpZCI6NzA2LCJ1cmwiOiJodHRwOlwvXC9jb21wYWduaWVrYWxpbWF0LmZyXC93cC1jb250ZW50XC91cGxvYWRzXC8yMDIxXC8xMFwvQWZmaWNoZS5qcGcifQ%3D%3D">
<img src="/images/Affiche.jpg" class="attachment-full size-full" alt="" loading="lazy" srcset="/images/Affiche.jpg 595w, /images/Affiche-424x600.jpg 424w" sizes="(max-width: 595px) 100vw, 595px" width="595" height="842"> </a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="elementor-section elementor-top-section elementor-element elementor-element-c0b9e21 elementor-section-boxed elementor-section-height-default elementor-section-height-default animated fadeInUp" data-id="c0b9e21" data-element_type="section" data-settings="{&quot;animation&quot;:&quot;fadeInUp&quot;}">
<div class="elementor-container elementor-column-gap-default">
<div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-671bc7f" data-id="671bc7f" data-element_type="column">
<div class="elementor-widget-wrap elementor-element-populated">
<div class="elementor-element elementor-element-2829263 elementor-widget elementor-widget-heading" data-id="2829263" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<style>/*! elementor - v3.5.6 - 28-02-2022 */
.elementor-heading-title{padding:0;margin:0;line-height:1}.elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}</style><h2 class="elementor-heading-title elementor-size-default">Merci
à vous d'être venus nous voir si nombreux pour notre premier projet.
Nos comédiens sont peut-être sortis de leurs prisons. Ils travaillent
peut-être sur une nouvelle pièce...</h2> </div>
</div>
</div>
</div>
</div>
</section>
</div>
</div>