Update web/users.html

web/users.html

@@ -10,7 +10,7 @@
 
     <link rel="stylesheet" href="css/simplebar.css">
     <link href="https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,100;0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
-    <link rel="stylesheet" href="css/feather.css">
+    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
     <link rel="stylesheet" href="css/app-light.css" id="lightTheme">
     <link rel="stylesheet" href="css/app-dark.css" id="darkTheme" disabled>
 </head>
@@ -20,7 +20,7 @@
     <!-- Top Navigation -->
     <nav class="topnav navbar navbar-light">
         <button type="button" class="navbar-toggler text-muted mt-2 p-0 mr-3 collapseSidebar">
-            <i class="fe fe-menu navbar-toggler-icon"></i>
+            <i data-feather="menu" class="navbar-toggler-icon"></i>
         </button>
 
         <ul class="nav">
@@ -40,7 +40,7 @@
     <!-- Sidebar -->
     <aside class="sidebar-left border-right bg-white shadow" id="leftSidebar" data-simplebar>
         <a href="#" class="btn collapseSidebar toggle-btn d-lg-none text-muted ml-2 mt-3" data-toggle="toggle">
-            <i class="fe fe-x"><span class="sr-only"></span></i>
+            <i data-feather="x"><span class="sr-only"></span></i>
         </a>
         <nav class="vertnav navbar navbar-light">
             <!-- nav bar -->
@@ -53,31 +53,31 @@
             <ul class="navbar-nav flex-fill w-100 mb-2">
                 <li class="nav-item">
                     <a class="nav-link" href="./index.html">
-                        <i class="fe fe-home fe-16"></i>
+                        <i data-feather="home" class="fe-16"></i>
                         <span class="ml-3 item-text">Dashboard</span>
                     </a>
                 </li>
                 <li class="nav-item">
                     <a class="nav-link" href="./diagnosis.html">
-                        <i class="fe fe-eye fe-16"></i>
+                        <i data-feather="eye" class="fe-16"></i>
                         <span class="ml-3 item-text">Diagnóstico</span>
                     </a>
                 </li>
                 <li class="nav-item">
                     <a class="nav-link" href="./patients.html">
-                        <i class="fe fe-users fe-16"></i>
+                        <i data-feather="users" class="fe-16"></i>
                         <span class="ml-3 item-text">Pacientes</span>
                     </a>
                 </li>
                 <li class="nav-item">
                     <a class="nav-link" href="./historial-consultas.html">
-                        <i class="fe fe-file-text fe-16"></i>
+                        <i data-feather="file-text" class="fe-16"></i>
                         <span class="ml-3 item-text">Consultas</span>
                     </a>
                 </li>
                 <li class="nav-item active">
                     <a class="nav-link" href="./users.html">
-                        <i class="fe fe-user fe-16"></i>
+                        <i data-feather="user" class="fe-16"></i>
                         <span class="ml-3 item-text">Usuarios</span>
                     </a>
                 </li>
@@ -97,10 +97,10 @@
                         </div>
                         <div class="col-auto">
                             <button class="btn btn-primary" onclick="loadUsers()">
-                                <i class="fe fe-refresh-cw fe-16 mr-2"></i>Actualizar
+                                <i data-feather="refresh-cw" class="fe-16 mr-2"></i>Actualizar
                             </button>
                             <button class="btn btn-success ml-2" onclick="showAddUserModal()">
-                                <i class="fe fe-plus fe-16 mr-2"></i>Nuevo Usuario
+                                <i data-feather="plus" class="fe-16 mr-2"></i>Nuevo Usuario
                             </button>
                         </div>
                     </div>
@@ -109,7 +109,7 @@
                     <div class="card shadow">
                         <div class="card-header">
                             <h6 class="card-title mb-0">
-                                <i class="fe fe-users mr-2"></i>Lista de Usuarios
+                                <i data-feather="users" class="mr-2"></i>Lista de Usuarios
                             </h6>
                         </div>
                         <div class="card-body">
@@ -140,11 +140,11 @@
                             </div>
 
                             <div id="emptyState" class="text-center py-5" style="display: none;">
-                                <i class="fe fe-users fe-48 text-muted mb-3"></i>
+                                <i data-feather="users" class="fe-48 text-muted mb-3"></i>
                                 <h6 class="text-muted">No se encontraron usuarios</h6>
                                 <p class="text-muted">No hay usuarios registrados en el sistema.</p>
                                 <button class="btn btn-primary" onclick="showAddUserModal()">
-                                    <i class="fe fe-plus mr-1"></i>Crear Primer Usuario
+                                    <i data-feather="plus" class="mr-1"></i>Crear Primer Usuario
                                 </button>
                             </div>
                         </div>
@@ -161,7 +161,7 @@
         <div class="modal-content">
             <div class="modal-header">
                 <h5 class="modal-title" id="userModalLabel">
-                    <i class="fe fe-user mr-2"></i>Nuevo Usuario
+                    <i data-feather="user" class="mr-2"></i>Nuevo Usuario
                 </h5>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                     <span aria-hidden="true">&times;</span>
@@ -267,12 +267,12 @@
                             <button class="btn btn-sm btn-outline-primary"
                                     onclick="editUser(${user.userID})"
                                     title="Editar">
-                                <i class="fe fe-edit fe-12"></i>
+                                <i data-feather="edit" class="fe-12"></i>
                             </button>
                             <button class="btn btn-sm btn-outline-danger"
                                     onclick="confirmDeleteUser(${user.userID})"
                                     title="Eliminar">
-                                <i class="fe fe-trash-2 fe-12"></i>
+                                <i data-feather="trash-2" class="fe-12"></i>
                             </button>
                         </div>
                     </td>
@@ -285,7 +285,7 @@
     function showAddUserModal() {
         $('#userForm')[0].reset();
         $('#userId').val('');
-        $('#userModalLabel').html('<i class="fe fe-user-plus mr-2"></i>Nuevo Usuario');
+        $('#userModalLabel').html('<i data-feather="user-plus" class="mr-2"></i>Nuevo Usuario');
         $('#userModal').modal('show');
     }
 
@@ -300,7 +300,7 @@
                     $('#password').val('');
                     $('#confirmPassword').val('');
 
-                    $('#userModalLabel').html('<i class="fe fe-edit mr-2"></i>Editar Usuario');
+                    $('#userModalLabel').html('<i data-feather="edit" class="mr-2"></i>Editar Usuario');
                     $('#userModal').modal('show');
                 }
             }
@@ -432,12 +432,12 @@
                     `<button class="btn btn-sm btn-outline-danger"
                             onclick="confirmDeleteUser(${user.userID})"
                             title="Eliminar">
-                        <i class="fe fe-trash-2 fe-12"></i>
+                        <i data-feather="trash-2" class="fe-12"></i>
                     </button>` :
                     `<button class="btn btn-sm btn-outline-secondary"
                             disabled
                             title="No puedes eliminar tu propia cuenta">
-                        <i class="fe fe-user-x fe-12"></i>
+                        <i data-feather="user-x" class="fe-12"></i>
                     </button>`;
 
                 const row = `
@@ -458,7 +458,7 @@
                                 <button class="btn btn-sm btn-outline-primary"
                                         onclick="editUser(${user.userID})"
                                         title="Editar">
-                                    <i class="fe fe-edit fe-12"></i>
+                                    <i data-feather="edit" class="fe-12"></i>
                                 </button>
                                 ${deleteButton}
                             </div>
@@ -548,5 +548,23 @@
         window.addEventListener('focus', centerWindow);
     })();
 </script>
+<script>
+    // Feather Icons: reemplaza <i data-feather="X"> con SVG inline
+    // Inmune a problemas de fuentes locales
+    function _initFeather() {
+        if (typeof feather !== 'undefined') feather.replace({ 'stroke-width': 1.8 });
+    }
+    document.addEventListener('DOMContentLoaded', _initFeather);
+    // Re-render al inyectar HTML dinámico (modals, cards, tablas)
+    var _fObserver = new MutationObserver(function(mutations) {
+        var needsRefresh = mutations.some(function(m) {
+            return m.addedNodes.length > 0;
+        });
+        if (needsRefresh) _initFeather();
+    });
+    document.addEventListener('DOMContentLoaded', function() {
+        _fObserver.observe(document.body, { childList: true, subtree: true });
+    });
+</script>
 </body>
 </html>