merge + ajout des boutons sur les tuiles page projet + css page narrative

public/assets/css/projet.css

@@ -88,9 +88,10 @@ body[data-template="projet"] {
   font-weight: 600;
   letter-spacing: 0.14em;
   text-transform: uppercase;
-  color: var(--nw-accent);
+  color: #FFF;
   margin: 0 0 0.6rem;
   opacity: 0.9;
+  text-shadow: 0 2px 20px rgba(0,0,0,0.25);
 }
 
 .pj-header__title {
@@ -139,7 +140,7 @@ body[data-template="projet"] {
   display: flex;
   flex-direction: column;
   position: relative;
-  overflow: hidden;
+  /*overflow: hidden;*/
   transition: transform var(--nw-transition), box-shadow var(--nw-transition);
   border: 1px solid var(--nw-rule);
 
@@ -308,6 +309,42 @@ body[data-template="projet"] {
   line-height: 1.4;
 }
 
+.pj-btn-disable,
+.pj-btn-disable.pj-btn--ghost{
+  cursor: default;
+  /*pointer-events: none;*/
+  transition: none;
+  background: var(--nw-rule);
+  /*opacity: 0.5;*/
+}
+
+[data-tooltip] {
+  position: relative;
+}
+
+[data-tooltip]::after {
+  content: attr(data-tooltip);
+  position: absolute;
+  bottom: calc(100% + 8px);
+  left: 50%;
+  transform: translateX(-50%);
+  background: var(--color-interface-100);
+  color: var(--color-interface-600);
+  font-size: 0.75rem;
+  white-space: nowrap;
+  padding: 0.35em 0.7em;
+  border-radius: 6px;
+  border: 1px solid var(--color-interface-500);
+  pointer-events: none;
+  opacity: 0;
+  transition: opacity 0.2s;
+  z-index: 100;
+}
+
+[data-tooltip]:hover::after {
+  opacity: 1;
+}
+
 /* Ghost : contour */
 .pj-btn--ghost {
   color: var(--nw-ink-soft);

public/assets/css/web.css

@@ -14,11 +14,28 @@
   --nw-accent-dark   : #361192;
   --nw-tag-bg        : #e9e5dc;
 
-  --nw-max-w         : 1280px;
+  --nw-max-w         : 1360px;
   --nw-narrow        : 720px;
   --nw-sidenav-w     : 220px;
 
   --nw-transition    : 0.25s ease;
+
+}
+
+.btn-connect{
+  position: fixed;
+  top: 20px;
+  right: 30px;
+  background: var(--nw-accent);
+  padding: 5px 5px 4px 10px;
+  border-radius: 100%;
+  opacity: 0.7;
+  transition: all 0.2s linear;
+}
+
+.btn-connect:hover{
+  opacity: 1;
+  transform: scale(1.04);
 }
 
 
@@ -71,7 +88,7 @@
 
 .nw-sidenav__label {
   font-family: var(--nw-font-ui);
-  font-size: 0.72rem;
+  font-size: 0.89rem;
   font-weight: 500;
   letter-spacing: 0.04em;
   text-transform: uppercase;
@@ -138,7 +155,7 @@
 
 .nw-sidenav__sub-label {
   font-family: var(--nw-font-ui);
-  font-size: 0.65rem;
+  font-size: 0.72rem;
   font-weight: 400;
   letter-spacing: 0.03em;
   white-space: nowrap;
@@ -153,10 +170,14 @@
 
 .nw-sidenav__sub-link:hover .nw-sidenav__sub-label,
 .nw-sidenav__sub-link.is-active .nw-sidenav__sub-label {
-  opacity: 1 !important;
+  /*opacity: 1 !important;*/
   transform: translateX(0);
 }
 
+.nw-sidenav__sub-link:hover .nw-sidenav__sub-label{
+  opacity: 1 !important;
+}
+
 .nw-sidenav__sub-link:hover .nw-sidenav__sub-dot,
 .nw-sidenav__sub-link.is-active .nw-sidenav__sub-dot {
   opacity: 1 !important;
@@ -179,13 +200,37 @@
 ─────────────────────────────────────────── */
 .nw-hero {
   position: relative;
-  min-height: 92vh;
+  min-height: 46vh;
   display: flex;
   align-items: flex-end;
   overflow: hidden;
   background: var(--nw-ink);
 }
 
+.nw-prev-btn{
+  position: absolute;
+  top: 20px;
+  left: 20px;
+  transition: transform 0.2s linear;
+}
+
+.nw-prev-btn a{
+  text-decoration: none;
+  color: #FFF;
+  text-shadow: 0 2px 20px rgba(0,0,0,0.3);
+  font-size: 1rem;
+}
+
+.nw-prev-btn svg{
+  position: relative;
+  top: 2px;
+}
+
+.nw-prev-btn:hover{
+  transform: scale(1.04);
+
+}
+
 .nw-hero__bg {
   position: absolute;
   inset: 0;
@@ -215,7 +260,8 @@
   position: relative;
   z-index: 2;
   padding: 6rem 3rem 4rem;
-  max-width: var(--nw-narrow);
+  max-width: var(--nw-max-w);
+  /*max-width: var(--nw-narrow);*/
   margin: 0 auto;
   width: 100%;
 }
@@ -378,6 +424,7 @@
   line-height: 1.8;
   color: var(--nw-ink-soft);
   margin-bottom: 2rem;
+  max-width: var(--nw-narrow);
 }
 
 .nw-prose p { margin: 0 0 1.25em; }

public/content/cohesion-des-mondes/1_multiplication-emotionelle-et-rationelle/1968-valerie-solanas-s.c.u.m.-manifesto.pdf.txt

@@ -0,0 +1 @@
+Uuid: rie5vbtliaf8udgn

public/content/cohesion-des-mondes/1_multiplication-emotionelle-et-rationelle/narrative.txt

@@ -10,7 +10,15 @@ Cover: - file://iucirxdnjp46ouzr
 
 ----
 
-Intro:<p>Récit de déambulations, d'abandons et d'accumulations urbains, résultant d'une marche attentive et émotive.</p>
+Pdf: - file://rie5vbtliaf8udgn
+
+----
+
+Intro: <p>Récit de déambulations, d'abandons et d'accumulations urbains, résultant d'une marche attentive et émotive.</p>
+
+----
+
+Customcss: 
 
 ----
 

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/1_marqueur-1/img_1399-e1763646882111.jpg.txt

@@ -0,0 +1,5 @@
+Uuid: 0ofsryvoc2wwnnqr
+
+----
+
+Template: blocks/image

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/1_marqueur-1/img_1404-1152x1536.png.txt

@@ -0,0 +1,5 @@
+Uuid: kjb9tgal4d7m95mt
+
+----
+
+Template: blocks/image

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/1_marqueur-1/marker.txt

@@ -0,0 +1,29 @@
+Title: Maison
+
+----
+
+Cover: - file://0ofsryvoc2wwnnqr
+
+----
+
+Text: [{"content":{"location":"kirby","image":["file://0ofsryvoc2wwnnqr"],"src":"","alt":"","caption":"Mon appartement","link":"","width":"","position":""},"id":"bf74d3e0-3fff-4ef6-a1bc-ba7605e67a74","isHidden":false,"type":"image"},{"content":{"text":"<p>Il fait chaud, la luminosité est chaleureuse, et l'odeur apaisante. Un chat est assis sur la table basse du salon, un autre sur le meuble télé, un dort sur le canapé, et un autre semble se diriger vers la chambre. Des toiles et des posters recouvrent les murs, et de la musique jaillit des quatre coins de la pièce. Je me sens bien ici, car je fais en sorte que ce soit le cas. Mais pourtant, depuis quelques jours, j'ai du mal à rester dans mon salon, dans ma cuisine ou même dans ma chambre. Même mon balcon devient étouffant. Il y a soit trop de silence chez moi, soit trop de bruit. Mon salon semble soit trop rangé minutieusement, soit trop en désordre. Je n'ai plus envie de rester ici, et je n'y arrive tout simplement plus. Mais je n'ai pas non plus envie d'en sortir. Alors je mets de la musique pour casser ce lourd silence, mais en même temps je change de musique toutes les secondes, car aucune ne me convient. Cette dualité mentale m'épuise et m'empêche de réfléchir, parfois même de respirer. Alors en ce moment je doute de tout. Tout me semble terne, je n'ai plus d'inspiration et je n'arrive plus a peindre. Je suis bloquée. Et plus rien ne me donne envie. J'ai mal partout, mon dos est bloqué, je suis constamment recroquevillée sur moi-même, et j'ai parfois l'impression que mes jambes ne sont plus capables de me porter.</p><p>Un de mes chats se réveille doucement de sa sieste : Fely. C'est mon chat tout gris. Le plus gourmand des quatre. Alors forcement, s'il se réveille de sa sieste c'est uniquement pour aller manger. Mais voilà que je l'entends miauler malgré la musique qui se fait retentir chez moi. Ce qui vient balayer mes pensées. Il n'y a plus de croquettes dans les gamelles, et, pire encore, plus de croquettes dans le paquet. C'est une excuse parfaite pour enfin sortir de chez moi, et pour ne penser qu'à une chose : <a href=\"https://geoproject.fr/ba/markers/mes-premiers-pas/\">faire les courses.</a></p>"},"id":"42deaa16-dcd1-4327-a4b3-875a2c61d47b","isHidden":false,"type":"text"},{"content":{"location":"kirby","image":["file://kjb9tgal4d7m95mt"],"src":"","alt":"","caption":"Fely sur mon canapé","link":"","width":"","position":""},"id":"ab6104a9-6c93-4d72-9ff9-3eb75476cf94","isHidden":false,"type":"image"}]
+
+----
+
+Latitude: 48.850647669811
+
+----
+
+Longitude: 2.3252579641452
+
+----
+
+Markericon: 
+
+----
+
+Markericonsize: 40
+
+----
+
+Uuid: mkl0rcgmk2va5v2p

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/2_marqueur-2/img_0848-885x1024.jpg.txt

@@ -0,0 +1,5 @@
+Uuid: ugt8nkibhgeaxws8
+
+----
+
+Template: blocks/image

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/2_marqueur-2/img_1400.png.txt

@@ -0,0 +1 @@
+Uuid: nrzg8aiibnsxecfl

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/2_marqueur-2/img_1419-scaled.jpeg.txt

@@ -0,0 +1,5 @@
+Uuid: v3cgqqjcu5xi0bef
+
+----
+
+Template: blocks/image

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/2_marqueur-2/marker.txt

@@ -0,0 +1,29 @@
+Title: Mes premiers pas
+
+----
+
+Cover: - file://nrzg8aiibnsxecfl
+
+----
+
+Text: [{"content":{"location":"kirby","image":["file://ugt8nkibhgeaxws8"],"src":"","alt":"","caption":"Vue de la rue","link":"","width":"","position":""},"id":"480e0e09-5554-420e-b058-ea82e3985a6c","isHidden":false,"type":"image"},{"content":{"text":"<p>J'ai enfilé un pull un peu au hasard, mes baskets aux pieds, et mes écouteurs diffusent mon son du moment : <em>Rue de Sèvres</em> de Dinos. Me voilà en route vers le supermarché le plus proche. La rue semble silencieuse à côté de ce qu'il se passe dans ma tête. Même en me trouvant à l'extérieur, je me sens bloquée et j'ai de nouveau l'impression d'étouffer. Je me sens coincée dans ma vie. Plus rien ne me fait vibrer. Même cette rue que j'apprécie tant, à fini par me blaser. Je crois que j'attends quelque chose, un signe, un événement pour avoir un renouveau d'inspiration. J'essaie de me concentrer uniquement sur le chemin et sur ma liste de courses, mais ces pensées ne cessent de revenir. Pourquoi est-ce que je n'arrive plus à peindre ? Pourquoi est-ce que cette activité qui me faisait du bien autrefois devient un réel calvaire ? Pourquoi est-ce que même mon propre appartement ne me convient plus ? Pourquoi ? Pourquoi ? Pourquoi ?!</p><p><code>Une pause. Il me faut une pause.</code></p>"},"id":"33bbfdfd-f92a-475a-b175-440fb50fb1b4","isHidden":false,"type":"text"},{"content":{"location":"kirby","image":["file://v3cgqqjcu5xi0bef"],"src":"","alt":"","caption":"Mes pas","link":"","width":"","position":""},"id":"4d8d7e98-4b6a-4166-8077-3c728a7d8ee4","isHidden":false,"type":"image"},{"content":{"text":"<p>Je vais aller m'asseoir sur ce banc, dans <a href=\"https://geoproject.fr/ba/markers/le-banc-du-parc/\">ce parc</a> dans lequel je n'ai pas mis les pieds depuis des années.</p>"},"id":"8d7cf47a-20c4-4a90-9b91-fc470b67fc09","isHidden":false,"type":"text"}]
+
+----
+
+Latitude: 48.850268819336
+
+----
+
+Longitude: 2.3242447746227
+
+----
+
+Markericon: 
+
+----
+
+Markericonsize: 40
+
+----
+
+Uuid: ttylgpb9rz43bncb

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/3_marqueur-3/img_1388-2048x1431.jpg.txt

@@ -0,0 +1,5 @@
+Uuid: ublkpzmpvyfnraw8
+
+----
+
+Template: blocks/image

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/3_marqueur-3/img_1389.jpeg.txt

@@ -0,0 +1,5 @@
+Uuid: yk4i3gznft3k8mcs
+
+----
+
+Template: blocks/image

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/3_marqueur-3/img_1397.jpg.txt

@@ -0,0 +1 @@
+Uuid: ih9crswtmcuvhnlr

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/3_marqueur-3/marker.txt

@@ -0,0 +1,29 @@
+Title: Le banc du parc
+
+----
+
+Cover: - file://ih9crswtmcuvhnlr
+
+----
+
+Text: [{"content":{"location":"kirby","image":["file://ublkpzmpvyfnraw8"],"src":"","alt":"","caption":"Assise sur le banc dans la charmille","link":"","width":"","position":""},"id":"2747a850-f19f-44fe-a017-bf3f9ba4a9e9","isHidden":false,"type":"image"},{"content":{"text":"<p>Je suis assise, et j'ai retiré mes écouteurs. Je suis sur ce banc, dans cette charmille. Je ne savais pas qu'il y avait autant d'oiseaux dans ce parc, et qu'on pouvait si bien les entendre. Ce son apaise un peu mes pensées. Et ce lieu est tellement réconfortant. Je me sens enveloppée dans ces feuilles, j'ai l'étrange impression qu'elles prennent soin de moi. Je me sens portée par ces dernières. Comme si elles recouvraient tout mon corps pour me soigner. Tout doucement, l'idée que cela puisse se faire réellement, commence a se former. Je les imagine une à une se coller contre moi et me créer une deuxième peau. Certaines pourraient être jaunâtres, d'autres avec des reflets rouges, certaines même pourraient avoir la même couleur que ma peau. Et alors toutes les feuilles de la charmille se décolleraient pour ne former qu'un. Rien qu’en y pensant, je me sens rassurée et protégée.</p>"},"id":"0dc64c8d-b490-4ae9-9db8-ee2bd6e5ec73","isHidden":false,"type":"text"},{"content":{"location":"kirby","image":["file://yk4i3gznft3k8mcs"],"src":"","alt":"","caption":"Dans mon imagination","link":"","width":"","position":""},"id":"41801548-58df-4b9f-9e5f-fccfc300d714","isHidden":false,"type":"image"},{"content":{"text":"<p>Mais c'est le bruit agaçant d'un gyrophare de police qui me ramène à la raison. En une fraction de seconde, cet état de bien-être a quitté mon corps. Je me sentais pourtant si bien... C'était <em>ce</em> sentiment que je ne retrouvais plus. J'étais enfin apaisée.</p><p>Il faut que je me reconcentre sur mon objectif premier : <a href=\"https://geoproject.fr/ba/markers/le-declic/\">faire les courses.</a></p>"},"id":"eaf743f3-75da-4aab-84ac-3a7d89c88d59","isHidden":false,"type":"text"}]
+
+----
+
+Latitude: 48.85065574496
+
+----
+
+Longitude: 2.3214011237332
+
+----
+
+Markericon: 
+
+----
+
+Markericonsize: 40
+
+----
+
+Uuid: xne8cgpoal5t9fkn

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/map-static.png.txt

@@ -0,0 +1 @@
+Uuid: tt7c6mvdavwxrx6r

public/content/cohesion-des-mondes/4_sur-le-chemin-de-la-recolte/1_le-trajet-des-courses/map.txt

@@ -2,10 +2,6 @@ Title: Le trajet des courses
 
 ----
 
-Author: 
-
-----
-
 Tags: chemin, paris, Rue de Sèvres
 
 ----
@@ -14,4 +10,19 @@ Text: <p>Dans le 7ème arrondissement, à l'arrêt de métro Saint-Placide, se t
 
 ----
 
+Mapdata:
+
+background:
+  type: osm
+center:
+  lat: 48.850072183852575
+  lon: 2.32508823039484
+zoom: 16.154464167854993
+
+----
+
+Author: 
+
+----
+
 Uuid: qdofat9jfhj50hqx

public/site/blueprints/pages/narrative.yml

@@ -22,6 +22,10 @@ tabs:
                 text: "{{ file.coverLabel }}"
                 multiple: false
                 width: 1/2
+              pdf: 
+                label: PDF de la publication
+                type: files
+                multiple: false
               intro:
                 label: Introduction
                 type: writer

public/site/templates/narrative-web.php

@@ -105,6 +105,19 @@ foreach ($subpages as $subpage) {
   <div class="nw-hero__overlay"></div>
   <?php endif ?>
 
+  <div class="nw-prev-btn">
+    <a href="<?= $original->parent()->url()?>" title="<?= $original->parent()->title()?>">
+      <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24"
+     fill="none" stroke="currentColor" stroke-width="2"
+     stroke-linecap="round" stroke-linejoin="round">
+      <path d="M19 12H5"/>
+      <polyline points="12 19 5 12 12 5"/>
+    </svg> 
+      <?= $original->parent()->title()->html()?>
+    </a>
+    
+  </div>
+
   <div class="nw-hero__content">
     <h1 class="nw-hero__title"><?= html($original->title()) ?></h1>
     <?php if ($original->author()->isNotEmpty()): ?>

public/site/templates/project.php

@@ -40,6 +40,22 @@
     <p class="pj-header__subtitle"><?= html($page->subtitle()) ?></p>
     <?php endif ?>
   </div>
+
+  <div class="btn-connect">
+    <a
+      href="<?= $site->url() ?>/panel"
+      class=""
+      rel="noopener"
+      title="Se connecter"
+      target="_blank"
+    >
+    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+      <circle cx="9.5" cy="8" r="4"/>
+      <path d="M16 21v-1a4 4 0 0 0-4-4H7a4 4 0 0 0-4 4v1"/>
+      <!-- <path d="M19 8l3 3-3 3M22 11h-7"/> -->
+    </svg>
+    </a>
+  </div>
 </header>
 
 <!-- ═══════════════════════════════════════════
@@ -114,18 +130,6 @@
 
       <!-- Actions -->
       <footer class="pj-card__footer">
-        <a
-          href="<?= $narrative->url() ?>"
-          class="pj-btn pj-btn--ghost"
-          target="_blank"
-          rel="noopener"
-          title="Ouvrir la version imprimée de « <?= html($narrative->title()) ?> »"
-        >
-          <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
-            <polyline points="6 9 6 2 18 2 18 9"/><path d="M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><rect x="6" y="14" width="12" height="8"/>
-          </svg>
-          Version imprimée
-        </a>
         <a
           href="<?= $webUrl ?>"
           class="pj-btn pj-btn--solid"
@@ -136,6 +140,53 @@
           </svg>
           Version web
         </a>
+        <?php if($pdf = $narrative->pdf()->toFile()):?>
+          <a
+            href="<?= $pdf->url() ?>"
+            class="pj-btn pj-btn--ghost"
+            target="_blank"
+            rel="noopener"
+            title="Télécharger le PDF de « <?= html($narrative->title()) ?> »"
+          >
+            <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24"
+               fill="none" stroke="currentColor" stroke-width="1.8"
+               stroke-linecap="round" stroke-linejoin="round">
+            <path d="M12 3v13"/>
+            <polyline points="7 11 12 16 17 11"/>
+            <path d="M3 21h18"/>
+          </svg>
+          </a>
+
+        <?php endif;?>
+      <?php if($kirby->user()):?>
+        <a
+          href="<?= $narrative->url() ?>"
+          class="pj-btn pj-btn--ghost"
+          target="_blank"
+          rel="noopener"
+          title="Éditer « <?= html($narrative->title()) ?> »"
+        >
+          <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24"
+               fill="none" stroke="currentColor" stroke-width="1.8"
+               stroke-linecap="round" stroke-linejoin="round">
+            <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/>
+            <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/>
+          </svg>
+        </a>
+      <?php else:?>
+        <div
+          class="pj-btn pj-btn-disable"
+          title="Connectez-vous pour éditer « <?= html($narrative->title()) ?> »"
+          data-tooltip="Connectez-vous pour éditer « <?= html($narrative->title()) ?> »"
+        >
+          <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24"
+               fill="none" stroke="currentColor" stroke-width="1.8"
+               stroke-linecap="round" stroke-linejoin="round">
+            <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/>
+            <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/>
+          </svg>
+        </div>
+      <?php endif;?>
       </footer>
 
     </article>