Merge pull request #2 from jmacot/claude/reorder-repo-view-GAdLr

Author: jmacot

index.html

@@ -493,68 +493,85 @@ <h1>Herramientas<br><em>para Cirugía Ortopédica y Traumatología</em></h1>
 
     <div class="grid">
 
-      <!-- CALCULADORA GUARDIAS -->
-      <a class="card" data-tag="administracion" href="https://jmacot.github.io/calculadora-guardias" target="_blank" style="animation-delay: 0s">
+      <!-- PLANTILLAS QUIRÚRGICAS -->
+      <a class="card" data-tag="quirofano" href="https://jmacot.github.io/plantillas-qx" target="_blank" style="animation-delay: 0s">
         <div class="card-meta">
-          <div class="card-icon">🏥</div>
+          <div class="card-icon">📋</div>
           <div class="card-arrow">
             <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
           </div>
         </div>
         <div class="card-content">
-          <div class="card-tag">Administración</div>
-          <h2>Calculadora de Guardias</h2>
-          <p>Calcula la retribución bruta, neta e IRPF a partir de guardias seleccionadas en calendario mensual. 5 configuraciones: HSJD, Vithas, SAS y combinadas.</p>
+          <div class="card-tag">Quirófano</div>
+          <h2>Plantillas Quirúrgicas COT</h2>
+          <p>60 plantillas de notas operatorias y tratamientos al alta. Selecciona procedimiento, cirujano y ayudante, y copia el texto generado.</p>
         </div>
       </a>
 
-      <!-- MATERIAL EXTERNO -->
-      <a class="card" data-tag="documentacion" href="https://jmacot.github.io/Material-Externo" target="_blank" style="animation-delay: 0.05s">
+      <!-- PROTOCOLOS REHABILITACION -->
+      <a class="card" data-tag="documentacion" href="https://jmacot.github.io/rehabilitacion-cot" target="_blank" style="animation-delay: 0.05s">
         <div class="card-meta">
-          <div class="card-icon">🔩</div>
+          <div class="card-icon" style="--card-icon-bg: var(--c-documentacion-light)">
+            <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="var(--c-documentacion)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 20V10"/><path d="M12 20V4"/><path d="M6 20v-6"/></svg>
+          </div>
           <div class="card-arrow">
             <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
           </div>
         </div>
         <div class="card-content">
-          <div class="card-tag">Documentación</div>
-          <h2>Solicitud de Material Externo</h2>
-          <p>Formulario para solicitar material quirúrgico externo. Selección de casa comercial por logo, catálogo de materiales y generación de PDF.</p>
+          <div class="card-tag">Documentacion</div>
+          <h2>Protocolos de Rehabilitacion</h2>
+          <p>Guias de rehabilitacion postquirurgica MGH por fase y semana. Selecciona patologia y fecha de cirugia para ver las recomendaciones actuales.</p>
         </div>
       </a>
 
-      <!-- PLANTILLAS QUIRÚRGICAS -->
-      <a class="card" data-tag="quirofano" href="https://jmacot.github.io/plantillas-qx" target="_blank" style="animation-delay: 0.1s">
+      <!-- PLANNING COT -->
+      <a class="card" data-tag="administracion" href="https://jmacot.github.io/planning-cot" target="_blank" style="animation-delay: 0.1s">
         <div class="card-meta">
-          <div class="card-icon">📋</div>
+          <div class="card-icon">📊</div>
           <div class="card-arrow">
             <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
           </div>
         </div>
         <div class="card-content">
-          <div class="card-tag">Quirófano</div>
-          <h2>Plantillas Quirúrgicas COT</h2>
-          <p>60 plantillas de notas operatorias y tratamientos al alta. Selecciona procedimiento, cirujano y ayudante, y copia el texto generado.</p>
+          <div class="card-tag">Administración</div>
+          <h2>Analizador de Planning</h2>
+          <p>Analiza el planning mensual del servicio: calendario, estadísticas, percentiles, rankings, comparador por unidad y retribución de guardias y localizados.</p>
         </div>
       </a>
 
-      <!-- CPAK PLANNER -->
-      <a class="card" data-tag="planificacion" href="https://jmacot.github.io/CPAK" target="_blank" style="animation-delay: 0.15s">
+      <!-- MATERIAL EXTERNO -->
+      <a class="card" data-tag="documentacion" href="https://jmacot.github.io/Material-Externo" target="_blank" style="animation-delay: 0.15s">
         <div class="card-meta">
-          <div class="card-icon">🦴</div>
+          <div class="card-icon">🔩</div>
           <div class="card-arrow">
             <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
           </div>
         </div>
         <div class="card-content">
-          <div class="card-tag">Planificación</div>
-          <h2>CPAK Planner</h2>
-          <p>Clasificación CPAK y planificación de alineación coronal en artroplastia total de rodilla. Calcula aHKA, JLO, JLCA y el fenotipo del paciente.</p>
+          <div class="card-tag">Documentación</div>
+          <h2>Solicitud de Material Externo</h2>
+          <p>Formulario para solicitar material quirúrgico externo. Selección de casa comercial por logo, catálogo de materiales y generación de PDF.</p>
+        </div>
+      </a>
+
+      <!-- CALCULADORA GUARDIAS -->
+      <a class="card" data-tag="administracion" href="https://jmacot.github.io/calculadora-guardias" target="_blank" style="animation-delay: 0.2s">
+        <div class="card-meta">
+          <div class="card-icon">🏥</div>
+          <div class="card-arrow">
+            <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
+          </div>
+        </div>
+        <div class="card-content">
+          <div class="card-tag">Administración</div>
+          <h2>Calculadora de Guardias</h2>
+          <p>Calcula la retribución bruta, neta e IRPF a partir de guardias seleccionadas en calendario mensual. 5 configuraciones: HSJD, Vithas, SAS y combinadas.</p>
         </div>
       </a>
 
       <!-- CONSENTIMIENTOS INFORMADOS -->
-      <a class="card" data-tag="documentacion" href="https://jmacot.github.io/consentimientos" target="_blank" style="animation-delay: 0.2s">
+      <a class="card" data-tag="documentacion" href="https://jmacot.github.io/consentimientos" target="_blank" style="animation-delay: 0.25s">
         <div class="card-meta">
           <div class="card-icon">📝</div>
           <div class="card-arrow">
@@ -568,23 +585,23 @@ <h2>Consentimientos Informados</h2>
         </div>
       </a>
 
-      <!-- PLANNING COT -->
-      <a class="card" data-tag="administracion" href="https://jmacot.github.io/planning-cot" target="_blank" style="animation-delay: 0.25s">
+      <!-- CPAK PLANNER -->
+      <a class="card" data-tag="planificacion" href="https://jmacot.github.io/CPAK" target="_blank" style="animation-delay: 0.3s">
         <div class="card-meta">
-          <div class="card-icon">📊</div>
+          <div class="card-icon">🦴</div>
           <div class="card-arrow">
             <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
           </div>
         </div>
         <div class="card-content">
-          <div class="card-tag">Administración</div>
-          <h2>Analizador de Planning</h2>
-          <p>Analiza el planning mensual del servicio: calendario, estadísticas, percentiles, rankings, comparador por unidad y retribución de guardias y localizados.</p>
+          <div class="card-tag">Planificación</div>
+          <h2>CPAK Planner</h2>
+          <p>Clasificación CPAK y planificación de alineación coronal en artroplastia total de rodilla. Calcula aHKA, JLO, JLCA y el fenotipo del paciente.</p>
         </div>
       </a>
 
       <!-- ANALIZADOR DE NOMINA -->
-      <a class="card" data-tag="administracion" href="https://jmacot.github.io/nominas-cot" target="_blank" style="animation-delay: 0.3s">
+      <a class="card" data-tag="administracion" href="https://jmacot.github.io/nominas-cot" target="_blank" style="animation-delay: 0.35s">
         <div class="card-meta">
           <div class="card-icon">💰</div>
           <div class="card-arrow">
@@ -602,23 +619,6 @@ <h2>Analizador de Nomina</h2>
         </div>
       </a>
 
-      <!-- PROTOCOLOS REHABILITACION -->
-      <a class="card" data-tag="documentacion" href="https://jmacot.github.io/rehabilitacion-cot" target="_blank" style="animation-delay: 0.35s">
-        <div class="card-meta">
-          <div class="card-icon" style="--card-icon-bg: var(--c-documentacion-light)">
-            <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="var(--c-documentacion)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 20V10"/><path d="M12 20V4"/><path d="M6 20v-6"/></svg>
-          </div>
-          <div class="card-arrow">
-            <svg width="18" height="18" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
-          </div>
-        </div>
-        <div class="card-content">
-          <div class="card-tag">Documentacion</div>
-          <h2>Protocolos de Rehabilitacion</h2>
-          <p>Guias de rehabilitacion postquirurgica MGH por fase y semana. Selecciona patologia y fecha de cirugia para ver las recomendaciones actuales.</p>
-        </div>
-      </a>
-
       <!-- PLACEHOLDER -->
       <div class="card placeholder" data-tag="none" style="animation-delay: 0.4s">
         <div class="card-meta">