rckrdmrd/erp-construccion-frontend-v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
a746b0b4df
erp-construccion-frontend-v2/web
History
Adrian Flores Cortes a746b0b4df feat(design-system): Implement CSS custom properties for theming 
- Add src/styles/variables.css with 100+ design tokens
- Define ISEM brand colors (primary #0061A8, secondary #00A868)
- Add semantic colors (success, warning, danger, info)
- Add light/dark theme support via CSS variables
- Add construction-specific colors (EVM, HSE, project states)
- Add typography tokens (Inter font family)
- Add spacing system (4px base)
- Add border radius, shadows, z-index scales
- Add animation duration and easing tokens
- Add component-specific tokens (button, input, card, modal)
- Update tailwind.config.js to use CSS variables
- Enable dark mode support with 'class' strategy
- Update index.css to import variables and use semantic tokens

Closes G-001 from FASE3-VALIDACION-FRONTEND-UXUI.md

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-02-04 00:51:57 -06:00
..
src feat(design-system): Implement CSS custom properties for theming 2026-02-04 00:51:57 -06:00
.env.example [CONST-D-001] feat: Integrate API frontend with backend 2026-02-03 04:25:10 -06:00
.eslintrc.cjs [MAI-002] feat: Implement frontend Proyectos module 2026-01-25 10:04:54 -06:00
Dockerfile Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00
index.html Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00
nginx.conf Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00
package-lock.json [MAI-002] feat: Implement frontend Proyectos module 2026-01-25 10:04:54 -06:00
package.json [MAI-002] feat: Implement frontend Proyectos module 2026-01-25 10:04:54 -06:00
README.md Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00
tailwind.config.js feat(design-system): Implement CSS custom properties for theming 2026-02-04 00:51:57 -06:00
tsconfig.json Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00
tsconfig.node.json Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00
vite.config.ts Migración desde erp-construccion/frontend - Estándar multi-repo v2 2026-01-16 08:11:18 -06:00

README.md

Frontend Web - MVP Sistema Administración de Obra

Stack: React 18 + Vite + TypeScript + Zustand Versión: 1.0.0 Fecha: 2025-11-20

📋 DESCRIPCIÓN

Aplicación web del sistema de administración de obra e INFONAVIT.

Portales incluidos:

  • Admin: Portal administrativo completo
  • Supervisor: Portal para supervisores de obra
  • Obra: Portal para personal en sitio

🚀 SETUP INICIAL

# Instalar dependencias
npm install

# Iniciar servidor de desarrollo
npm run dev

# Build para producción
npm run build

La aplicación estará disponible en http://localhost:5173

🏗️ ESTRUCTURA

src/
├── shared/                    # Código compartido entre portales
│   ├── components/
│   │   ├── ui/               # Componentes UI base (Button, Input, etc.)
│   │   └── layout/           # Componentes de layout (Header, Sidebar, etc.)
│   ├── hooks/                # Custom hooks
│   ├── stores/               # Zustand stores
│   ├── services/             # API services
│   ├── types/                # TypeScript types
│   ├── utils/                # Utilities
│   └── constants/            # Constantes
└── apps/                     # Portales específicos
    ├── admin/                # Portal administrador
    │   ├── pages/
    │   ├── components/
    │   └── routes.tsx
    ├── supervisor/           # Portal supervisor
    └── obra/                 # Portal obra

📝 SCRIPTS

Script Descripción
npm run dev Inicia servidor de desarrollo (port 5173)
npm run build Build para producción
npm run preview Preview del build de producción
npm run lint Ejecuta ESLint
npm run lint:fix Ejecuta ESLint y corrige
npm run type-check Verifica tipos TypeScript

🎨 CONVENCIONES

Nomenclatura

Seguir ESTANDARES-NOMENCLATURA.md:

  • Componentes: PascalCase.tsx
  • Páginas: PascalCasePage.tsx
  • Hooks: useCamelCase.ts
  • Stores: camelCase.store.ts
  • Tipos: camelCase.types.ts

Path Aliases

import { Button } from '@components/ui/Button';
import { useAuth } from '@hooks/useAuth';
import { projectStore } from '@stores/project.store';
import type { Project } from '@types/project.types';

📚 REFERENCIAS

Mantenido por: Frontend-Agent Última actualización: 2025-11-20