Diferencias

Muestra las diferencias entre dos versiones de la página.

--- inventario:libros [2026/05/18 16:32] – jesus
+++ inventario:libros [2026/05/18 16:37] (actual) – jesus
@@ Línea 11: / Línea 11: @@
   .pcw-monitor-ultra::after {
     content: " "; position: absolute; top: 0; left: 0; bottom: 0; right: 0;
-    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.15) 50%);
+    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.15) 50%),
-    background-size: 100% 3px; z-index: 2; pointer-events: none;
+                linear-gradient(90deg, rgba(255, 0, 0, 0.03), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.03));
+    background-size: 100% 3px, 2px 100%; z-index: 2; pointer-events: none;
   }
@@ Línea 18: / Línea 19: @@
     color: #00ff00; font-size: 1.6em; font-weight: bold; margin-bottom: 25px;
     display: block; text-shadow: 0 0 10px #00ff00;
+  }
+  /* --- ÍNDICE ALFABÉTICO SUPERIOR --- */
+  .abecedario-nav {
+    display: flex; flex-direction: row; justify-content: space-between; align-items: center;
+    background-color: #000; padding: 10px 5px; border: 2px solid #00ff00;
+    margin-bottom: 30px; width: 100%; box-sizing: border-box; overflow-x: auto;
+  }
+  .abecedario-nav a {
+    flex: 1; text-align: center; min-width: 25px; color: #00ff00 !important;
+    text-decoration: none !important; font-weight: bold; font-size: 16px; transition: 0.2s;
+    text-shadow: 0 0 10px #00ff00 !important;
+  }
+  .abecedario-nav a:hover { background-color: #00ff00; color: #000 !important; text-shadow: none !important; }
+  /* --- TÍTULOS DE LETRA --- */
+  .abecedario-titulo {
+    color: #000000 !important; background-color: #00ff00;
+    font-size: 1.2em; font-weight: bold; margin: 40px 0 15px 0;
+    width: 32px; height: 32px; line-height: 32px; text-align: center;
+    display: block; scroll-margin-top: 30px; box-shadow: 0 0 8px rgba(0, 255, 0, 0.4);
   }
   /* Tabla Técnica de Inventario */
-  .inv-table { width: 100%; border-collapse: collapse; margin-top: 15px; }
+  .inv-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
   .inv-table th { background-color: #00ff00; color: #000b00; padding: 8px; text-align: left; font-weight: bold; }
   .inv-table td { padding: 10px 8px; border-bottom: 1px solid #003300; vertical-align: middle; }
@@ Línea 45: / Línea 67: @@
   /* --- SISTEMA LIGHTBOX INTERACTIVO (CSS PURO) --- */
   .lightbox-container { position: relative; display: inline-block; }
-  .lightbox-check { display: none; } /* Checkbox oculto */
+  .lightbox-check { display: none; }
-  /* Miniatura de la portada */
   .thumb-img {
     width: 45px; height: 60px; object-fit: cover; border: 1px solid #00ff00;
@@ Línea 54: / Línea 75: @@
   .thumb-img:hover { box-shadow: 0 0 8px #00ff00; transform: scale(1.05); }
-  /* Comportamiento al hacer Click (Checkbox Activo) */
   .lightbox-check:checked ~ .thumb-img {
     position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
@@ Línea 67: / Línea 87: @@
 <div class="pcw-monitor-ultra">
-  <div class="pcw-title-ultra"> A:\INVENTARIO> REGISTRO MUNDIAL DE LIBROS PUBLICADOS </div>
+  <div class="pcw-title-ultra"> A:\INVENTARIO> REGISTRO CENTRAL DE LIBROS PUBLICADOS </div>
+  <!-- ÍNDICE SUPERIOR (Anclas de salto) -->
+  <div class="abecedario-nav">
+    <a href="#A">A</a><a href="#B">B</a><a href="#C">C</a><a href="#D">D</a>
+    <a href="#E">E</a><a href="#F">F</a><a href="#G">G</a><a href="#H">H</a><a href="#I">I</a>
+    <a href="#J">J</a><a href="#K">K</a><a href="#L">L</a><a href="#M">M</a><a href="#N">N</a>
+    <a href="#O">O</a><a href="#P">P</a><a href="#Q">Q</a><a href="#R">R</a><a href="#S">S</a>
+    <a href="#T">T</a><a href="#U">U</a><a href="#V">V</a><a href="#W">W</a><a href="#X">X</a>
+    <a href="#Y">Y</a><a href="#Z">Z</a>
+  </div>
+  <!-- SECCIÓN D -->
+  <div id="D" class="abecedario-titulo">D</div>
   <table class="inv-table">
     <thead>
@@ Línea 79: / Línea 111: @@
     </thead>
     <tbody>
-      <!-- REGISTRO 1: LIBRO PRESERVADO (VERDE) -->
       <tr>
         <td>
           <div class="lightbox-container">
             <input type="checkbox" id="book1" class="lightbox-check">
-            <img src="libros:portada_mallard_intro.png" class="thumb-img" title="Click para ampliar / reducir">
+            <img src="libros:portada_pcw_handbuch.png" class="thumb-img" title="Click para ampliar / reducir">
           </div>
         </td>
-        <td class="status-safe">
+        <td class="status-safe">DAS GROSSE AMSTRAD PCW HANDBUCH</td>
-          MALLARD BASIC - INTRODUCTION AND REFERENCE (SECOND EDITION)
+        <td class="lang-tag" style="text-align: center;">[ DEU ]</td>
-        </td>
-        <td class="lang-tag" style="text-align: center;">[ ESP ]</td>
         <td class="status-safe" style="text-align: center;">[ OK ] PRESERVADO</td>
       </tr>
+    </tbody>
+  </table>
-      <!-- REGISTRO 2: LIBRO BUSCADO / NO PRESERVADO (ROJO) -->
+  <!-- SECCIÓN J -->
+  <div id="J" class="abecedario-titulo">J</div>
+  <table class="inv-table">
+    <thead>
+      <tr>
+        <th style="width: 60px;">PORTADA</th>
+        <th>TITULO DEL VOLUMEN / CATALOGO GENERAL</th>
+        <th style="width: 90px; text-align: center;">IDIOMA</th>
+        <th style="width: 140px; text-align: center;">ESTADO</th>
+      </tr>
+    </thead>
+    <tbody>
       <tr>
         <td>
@@ Línea 103: / Línea 144: @@
           </div>
         </td>
-        <td class="status-missing">
+        <td class="status-missing">80 GAMES FOR THE AMSTRAD PCW 8256</td>
-GAMES FOR THE AMSTRAD PCW 8256
-        </td>
         <td class="lang-tag" style="text-align: center;">[ ENG ]</td>
         <td class="status-missing" style="text-align: center;">[ !! ] BUSCANDO</td>
       </tr>
+    </tbody>
+  </table>
-      <!-- REGISTRO 3: OTRO IDIOMA DE EJEMPLO (ALEMÁN - PRESERVADO) -->
+  <!-- SECCIÓN M -->
+  <div id="M" class="abecedario-titulo">M</div>
+  <table class="inv-table">
+    <thead>
+      <tr>
+        <th style="width: 60px;">PORTADA</th>
+        <th>TITULO DEL VOLUMEN / CATALOGO GENERAL</th>
+        <th style="width: 90px; text-align: center;">IDIOMA</th>
+        <th style="width: 140px; text-align: center;">ESTADO</th>
+      </tr>
+    </thead>
+    <tbody>
       <tr>
         <td>
           <div class="lightbox-container">
             <input type="checkbox" id="book3" class="lightbox-check">
-            <img src="libros:portada_pcw_handbuch.png" class="thumb-img" title="Click para ampliar / reducir">
+            <img src="libros:portada_mallard_intro.png" class="thumb-img" title="Click para ampliar / reducir">
           </div>
         </td>
-        <td class="status-safe">
+        <td class="status-safe">MALLARD BASIC - INTRODUCTION AND REFERENCE (SECOND EDITION)</td>
-          DAS GROSSE AMSTRAD PCW HANDBUCH
+        <td class="lang-tag" style="text-align: center;">[ ESP ]</td>
-        </td>
-        <td class="lang-tag" style="text-align: center;">[ DEU ]</td>
         <td class="status-safe" style="text-align: center;">[ OK ] PRESERVADO</td>
       </tr>
     </tbody>
   </table>
 </div>
 </html>