Feat/footer

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -1,43 +1,43 @@
-name: "Bug report"
-description: "Report a reproducible problem"
+name: "Reporte de bug"
+description: "Reporta un problema reproducible"
 labels: ["bug"]
 body:
   - type: input
     id: summary
     attributes:
-      label: Summary
-      description: Short description of the bug.
-      placeholder: "Incorrect grouping on decimal fraction in binary→decimal"
+      label: Resumen
+      description: Explica brevemente el problema.
+      placeholder: "Agrupación incorrecta en fracción decimal al convertir binario → decimal"
     validations: { required: true }
 
   - type: textarea
     id: steps
     attributes:
-      label: Steps to reproduce
-      description: Provide minimal steps.
+      label: Pasos para reproducir
+      description: Detalla los pasos mínimos para provocar el bug.
       placeholder: |
-        1) Go to /conversiones
-        2) Input: 1010001011001.00010010 (binary) → decimal
-        3) Observe fraction formatted incorrectly
+        1) Ir a /conversiones
+        2) Ingresar: 1010001011001.00010010 (binario) → decimal
+        3) Observar que la fracción se formatea de forma incorrecta
     validations: { required: true }
 
   - type: textarea
     id: expected_actual
     attributes:
-      label: Expected vs. actual
+      label: Comportamiento esperado vs. actual
       placeholder: |
-        Expected: ...
+        Esperado: ...
         Actual: ...
     validations: { required: true }
 
   - type: textarea
     id: context
     attributes:
-      label: Additional context / logs / screenshots
-      placeholder: "Screenshots, logs, links…"
+      label: Contexto adicional / logs / capturas
+      placeholder: "Capturas de pantalla, registros, enlaces relevantes…"
 
   - type: input
     id: env
     attributes:
-      label: Environment
-      placeholder: "OS/Browser, versions (e.g., macOS 14.5 / Firefox 142)"
+      label: Entorno
+      placeholder: "SO/Navegador, versiones (p. ej. macOS 14.5 / Firefox 142)"

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,5 @@
 blank_issues_enabled: false
 contact_links:
-  - name: Security reports
+  - name: Reportes de seguridad
     url: https://github.com/ApocalixDeLuque/binaryx/security/advisories
-    about: Please report security vulnerabilities privately via GitHub Security Advisories or email in SECURITY.md.
+    about: Reporta vulnerabilidades de forma privada mediante GitHub Security Advisories o el correo indicado en SECURITY.md.

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -1,30 +1,30 @@
-name: "Feature request"
-description: "Propose an enhancement or new capability"
+name: "Solicitud de mejora"
+description: "Propone una funcionalidad o mejora"
 labels: ["enhancement"]
 body:
   - type: textarea
     id: problem
     attributes:
-      label: Problem / use case
-      placeholder: "Add Decimal ↔ Gray code with step visualization…"
+      label: Problema / caso de uso
+      placeholder: "Necesitamos conversión Decimal ↔ Gray con visualización paso a paso…"
     validations: { required: true }
 
   - type: textarea
     id: proposal
     attributes:
-      label: Proposed solution
-      placeholder: "Create results components under src/components/results/gray-<->binary, add steps and final, wire in panel…"
+      label: Propuesta de solución
+      placeholder: "Crear componentes en src/components/results/gray-<->binary, añadir pasos y resultado final, integrar en el panel…"
     validations: { required: true }
 
   - type: textarea
     id: alternatives
     attributes:
-      label: Alternatives considered
-      placeholder: "External tool X, manual steps, etc."
+      label: Alternativas consideradas
+      placeholder: "Herramienta externa X, pasos manuales, etc."
 
   - type: dropdown
     id: priority
     attributes:
-      label: Priority
-      options: ["nice to have", "important", "critical"]
+      label: Prioridad
+      options: ["sería genial", "importante", "crítico"]
       default: 0

CONTRIBUTING.md

@@ -32,7 +32,7 @@ Document any extra steps (env vars, local config) in the README.
 
 ## Pull request process
 
-1. Ensure CI passes (tests, lint).
+1. Run lint, tests, and build locally before opening the PR.
 2. Update docs and CHANGELOG if behavior changes.
 3. Fill out the PR template (summary, testing steps, screenshots if UI).
 4. At least one maintainer review approval is required before merge.

CONTRIBUYENDO.md

@@ -32,7 +32,7 @@ Documenta pasos extra (variables de entorno, configuración local) en el README.
 
 ## Proceso de Pull Request
 
-1. Asegura que CI pase (tests, lint).
+1. Ejecuta lint, pruebas y build en local antes del PR.
 2. Actualiza docs y CHANGELOG si cambia el comportamiento.
 3. Completa la plantilla de PR (resumen, pasos de prueba, capturas si hay UI).
 4. Se requiere aprobación de al menos una persona mantenedora antes del merge.

README.es.md

@@ -22,7 +22,8 @@
 </p>
 <!-- prettier-ignore-end -->
 
-> [!NOTE] > **Estado: activo.** Este proyecto busca crecer en comunidad (lógica digital, más operaciones, visualizaciones, etc.).
+> [!NOTE]
+> **Estado: activo.** Este proyecto busca crecer en comunidad (lógica digital, más operaciones, visualizaciones, etc.).
 
 ---
 

README.md

@@ -22,7 +22,8 @@
 </p>
 <!-- prettier-ignore-end -->
 
-> [!NOTE] > **Status: active.** This project aims to grow with the community (digital logic, more operations, visualizations, etc.).
+> [!NOTE]
+> **Status: active.** This project aims to grow with the community (digital logic, more operations, visualizations, etc.).
 
 ---
 

apps/web/package.json

@@ -69,6 +69,9 @@
     "@types/react-dom": "^19",
     "tailwindcss": "^4.1.10",
     "typescript": "^5",
-    "vitest": "^3.2.4"
+    "vitest": "^3.2.4",
+    "jsdom": "^24.1.0",
+    "@types/jsdom": "^21.1.7",
+    "vite": "^5.4.10"
   }
 }

apps/web/src/app/layout.tsx

@@ -3,39 +3,39 @@ import { Geist, Geist_Mono } from "next/font/google";
 import "../index.css";
 import Providers from "@/components/providers";
 import Header from "@/components/header";
+import Footer from "@/components/footer";
 
 const geistSans = Geist({
-	variable: "--font-geist-sans",
-	subsets: ["latin"],
+  variable: "--font-geist-sans",
+  subsets: ["latin"],
 });
 
 const geistMono = Geist_Mono({
-	variable: "--font-geist-mono",
-	subsets: ["latin"],
+  variable: "--font-geist-mono",
+  subsets: ["latin"],
 });
 
 export const metadata: Metadata = {
-	title: "binaryx",
-	description: "binaryx",
+  title: "binaryx",
+  description: "binaryx",
 };
 
 export default function RootLayout({
-	children,
+  children,
 }: Readonly<{
-	children: React.ReactNode;
+  children: React.ReactNode;
 }>) {
-	return (
-		<html lang="en" suppressHydrationWarning>
-			<body
-				className={`${geistSans.variable} ${geistMono.variable} antialiased`}
-			>
-				<Providers>
-					<div className="grid grid-rows-[auto_1fr] h-svh">
-						<Header />
-						{children}
-					</div>
-				</Providers>
-			</body>
-		</html>
-	);
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className={`${geistSans.variable} ${geistMono.variable} antialiased`}>
+        <Providers>
+          <div className="grid min-h-svh grid-rows-[auto_1fr_auto]">
+            <Header />
+            <div className="overflow-y-auto">{children}</div>
+            <Footer />
+          </div>
+        </Providers>
+      </body>
+    </html>
+  );
 }

apps/web/src/components/footer.tsx

@@ -0,0 +1,119 @@
+import Image from "next/image";
+import Link from "next/link";
+import { Bug, Github, Sparkles, Star, type LucideIcon } from "lucide-react";
+
+import { Button } from "@/components/ui/button";
+
+const primaryActions = [
+  {
+    label: "Reportar un bug",
+    href: "https://github.com/ApocalixDeLuque/binaryx/issues/new?labels=bug&title=%5BBug%5D%3A%20Describe%20el%20problema%20&body=Describe%20los%20pasos%20para%20reproducirlo%2C%20el%20comportamiento%20esperado%20y%20cualquier%20dato%20adicional%20relevante.",
+    icon: Bug,
+    variant: "outline" as const,
+  },
+  {
+    label: "Sugerir mejora",
+    href: "https://github.com/ApocalixDeLuque/binaryx/issues/new?template=feature_request.yml",
+    icon: Sparkles,
+    variant: "outline" as const,
+  },
+  {
+    label: "Dar estrella en GitHub",
+    href: "https://github.com/ApocalixDeLuque/binaryx/stargazers",
+    icon: Star,
+    variant: "secondary" as const,
+  },
+  {
+    label: "Abrir repositorio",
+    href: "https://github.com/ApocalixDeLuque/binaryx",
+    icon: Github,
+    variant: "ghost" as const,
+  },
+] satisfies Array<{
+  label: string;
+  href: string;
+  icon: LucideIcon;
+  variant: "outline" | "secondary" | "ghost";
+}>;
+
+const secondaryLinks = [
+  {
+    label: "Documentación",
+    href: "https://github.com/ApocalixDeLuque/binaryx#readme",
+  },
+  {
+    label: "Guía de contribución",
+    href: "https://github.com/ApocalixDeLuque/binaryx/blob/main/CONTRIBUTING.md",
+  },
+  {
+    label: "Licencia",
+    href: "https://github.com/ApocalixDeLuque/binaryx/blob/main/LICENSE",
+  },
+  {
+    label: "Historial de cambios",
+    href: "https://github.com/ApocalixDeLuque/binaryx/releases",
+  },
+] satisfies Array<{
+  label: string;
+  href: string;
+}>;
+
+export default function Footer() {
+  const year = new Date().getFullYear();
+
+  return (
+    <footer className="border-t bg-background/80 backdrop-blur supports-[backdrop-filter]:bg-background/60">
+      <div className="mx-auto w-full max-w-6xl px-4 py-6 md:px-6 md:py-8">
+        <div className="flex flex-col items-center gap-6 text-center md:flex-row md:items-center md:justify-between md:text-left">
+          <div className="flex flex-col items-center gap-3 md:flex-row md:items-center">
+            <div className="relative h-8 w-8 shrink-0">
+              <Image
+                src="/favicon/binaryx.png"
+                alt="Logo de binaryx"
+                fill
+                sizes="32px"
+                className="object-contain dark:invert"
+              />
+            </div>
+            <div className="text-sm">
+              <p className="font-semibold tracking-tight">binaryx</p>
+              <p className="text-muted-foreground">
+                Herramientas abiertas para conversiones y operaciones binarias.
+              </p>
+            </div>
+          </div>
+
+          <div className="grid w-full gap-2 sm:grid-cols-2 md:w-auto md:flex md:flex-wrap md:justify-end md:gap-2">
+            {primaryActions.map(({ label, href, icon: Icon, variant }) => (
+              <Button key={label} asChild variant={variant} size="sm" className="w-full md:w-auto">
+                <Link href={href as any} target="_blank" rel="noreferrer">
+                  <Icon className="size-4" aria-hidden="true" />
+                  {label}
+                </Link>
+              </Button>
+            ))}
+          </div>
+        </div>
+
+        <div className="mt-6 flex flex-col items-center gap-4 border-t border-border/60 pt-4 text-xs text-muted-foreground md:flex-row md:items-center md:justify-between">
+          <p className="text-center md:text-left">
+            © {year} binaryx. Creado por la comunidad open source.
+          </p>
+          <div className="flex flex-wrap justify-center gap-x-4 gap-y-2 md:justify-end">
+            {secondaryLinks.map(({ label, href }) => (
+              <Link
+                key={label}
+                href={href as any}
+                target="_blank"
+                rel="noreferrer"
+                className="transition-colors hover:text-foreground"
+              >
+                {label}
+              </Link>
+            ))}
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+}

package.json

@@ -28,6 +28,7 @@
     "eslint-plugin-react": "^7.37.2",
     "eslint-plugin-react-hooks": "^5.1.0-rc.0",
     "globals": "^16.4.0",
+    "jsdom": "24.0.0",
     "prettier": "^3.3.3",
     "turbo": "^2.5.4",
     "typescript-eslint": "^8.44.0"