From d3f4413f3ee9a9d0ed6a94d787bc720e0c46809f Mon Sep 17 00:00:00 2001
From: romain boxus <romain.boxus@erg.school>
Date: Wed, 25 Feb 2026 17:25:25 +0100
Subject: [PATCH] ajout index g to l + scroll

---
 index.html | 35 ++++++++++++++++++++++++-----------
 styles.css | 33 ++++++++++++++++++++++++---------
 2 files changed, 48 insertions(+), 20 deletions(-)

diff --git a/index.html b/index.html
index b937b67..55b0904 100644
--- a/index.html
+++ b/index.html
@@ -76,9 +76,9 @@ index par date, pas espace, par nouvelle de la journée, (?), détaille anodin s
     <p><span class="iu">a,</span> goldsmith, zukosfky, neutralité<br>
     <span class="iu">akerman,</span> temps, verticalité, objet(s), mémoire<br>
     <span class="iu">annotation,</span> walter, je, nous, appropriation <br>
-    <span class="iu">aphorisme,</span> bresson, nietsche<br>
+    <span class="iu">aphorisme,</span> bresson, nietzsche<br>
     <span class="iu">appropriation,</span> walter, je, nous, annotation, plagiat<br>
-    <span class="iu">beaulieu,</span> situationnisme, objet(s), déplacement, paris<br>
+    <span class="iu">beaulieu,</span> écriture, langage, objet(s), déplacement, lire, ne pas lire<br>
     <span class="iu">bissociation,</span> bernhardt, poème, trinité, lecture <br>
     <span class="iu">bresson,</span> aphorisme, mémoire<br>
     <span class="iu">borges,</span> pierre ménard, réappropriation, appropriation, lire, non-lire<br>
@@ -93,17 +93,30 @@ index par date, pas espace, par nouvelle de la journée, (?), détaille anodin s
     <span class="iu">documenter,</span> fluxus, danto, finalité, écriture, image, texte, erg, recherche, holzwege<br>
     <span class="iu">ecriture,</span> langage, goldsmith, sous-rature, derrida, mémoire, archive, code, binaire, syntaxe, mcluhan<br>
     <span class="iu">erg,</span> collectif, recherche, documenter <br>
-    <span class="iu">espace,</span> akerman, web, soulellis, temps, fenêtre<br>
+    <span class="iu">espace,</span> akerman, web, soulellis, temps, fenêtre, print<br>
     <span class="iu">fenêtre,</span> varda, espace, temps, surréalisme, sérendipité, chemin, holzwege<br>
     <span class="iu">finalité,</span> fluxus, processus, mémoire<br>
-    <span class="iu">flou,</span> sous-rature, chemin, holzwege<br>
-    <span class="iu">fluxus,</span> <br>
-    <span class="iu">fond,</span> <br>
-    <span class="iu">forme,</span> <br>
-    <span class="iu">foucault,</span> <br>
-    <span class="iu">git,</span> <br>
-    <span class="iu">goldmsith,</span> <br>
-    <span class="iu">grep,</span> <br>
+    <span class="iu">flou,</span> sous-rature, chemin, holzwege, documenter<br>
+    <span class="iu">fluxus,</span> higgins, processus, finalité.<br>
+    <span class="iu">fond,</span> forme, recherche, pratique, gelstat<br>
+    <span class="iu">forme,</span> fond, design, pratique, recherche, gelstat <br>
+    <span class="iu">foucault,</span> derrida, fond, forme, objet(s), structuralisme, post-structuralisme <br>
+    <span class="iu">git,</span> archive, mémoire, documenter, erg<br>
+    <span class="iu">goldmsith,</span> écriture, langage, index<br>
+    <span class="iu">grep,</span> poème, perec, archive, documenter, médium, terminal<br>
+    <span class="iu">heidegger,</span> chemin, holzwege, derrida, sous-rature<br>
+    <span class="iu">holzwege,</span> heidegger, chemin, sérendipité, fenêtre, processus<br>
+    <span class="iu">higgins,</span> fluxus, poème<br>
+    <span class="iu">html,</span> code, css, écriture, js<br>
+    <span class="iu">hybride,</span> objet(s), bissociation, index, prompt<br>
+    <span class="iu">hyperlien-texte,</span> zeste, index, documenter, médium, écriture, langage, beaulieu<br>
+    <span class="iu">index,</span> chemin, holzwege, zukosfky, beaulieu, écriture, langage, neutralité<br>
+    <span class="iu">je,</span> subjectivité, collectif<br>
+    <span class="iu">jeu,</span> écriture, langage, code, holzwege, sérendipité<br>
+    <span class="iu">js,</span> code, html, css, langage, mémoire<br>
+    <span class="iu">langage,</span> écriture, code, goldsmith, hybride, fond-forme, index<br>
+    <span class="iu">lebenswelt,</span> danto, holzwege, documenter, situationnisme<br>
+    
 
 
 
diff --git a/styles.css b/styles.css
index 975ec53..aefdd0e 100644
--- a/styles.css
+++ b/styles.css
@@ -1,22 +1,35 @@
+html, body {
+    margin: 0;
+    overflow: hidden;
+}
+
 .col{
     display: flex;
+    height: 98vh;
+    margin-top: -10px;
 }
 
 .col1{
-width: 45%;
+    overflow: auto;
+    width: 45%;
+    scrollbar-width: none;
 }
 
 .col2{
-
-margin-left: 20px;
-text-align: left;
-width: 55%;
+    overflow: auto;
+    margin-left: 20px;
+    text-align: left;
+    width: 55%;
+    scrollbar-width: none;
 }
+
 .dot{
- color: black;
-   text-decoration: none;
-   margin-left: 6px;
-   margin-top: 5px;
+    display: inline-block;
+    color: black;
+    text-decoration: none;
+    margin-left: 6px;
+    margin-top: 5px;
+    margin-bottom: 8px;
   
 }
 p{
@@ -24,6 +37,7 @@ p{
     margin-left: 1%;
     border-left: 12px solid rgb(232, 231, 231);
     mix-blend-mode: multiply;
+  
 }
 
 .sr{
@@ -67,3 +81,4 @@ img{
      mix-blend-mode: multiply;
 }
 
+