From 218a891c6d582216454619142c49aed9f0b753ed Mon Sep 17 00:00:00 2001
From: davidmonterocrespo24 <davidmonterocrespo24@gmail.com>
Date: Thu, 14 May 2026 22:32:42 +0200
Subject: [PATCH] feat(minimap): shrink to 140x105 + red viewport rect
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

User feedback: the default 200x150 minimap eats too much of the
canvas-content area on a typical 13"/14" laptop, and the white
viewport rectangle against a dark canvas blends with the boards
once enough components are placed.

Drop the desktop default down to the size we already use on phones
(140x105 — the mobile media query still wins on screens ≤720px so
that block continues to apply identically). At this size the rect
becomes the focal indicator of where you are in the world; switch
its outline to brand red (#ef4444 — Tailwind red-500) with a faint
red fill so it pops without overpowering the boards (which stay
brand blue).

Body of the work is two number changes + two color tokens; the
rest of the component logic (pointer routing, world rendering,
clamping) is untouched.
---
 frontend/src/components/simulator/CanvasMinimap.css | 4 ++--
 frontend/src/components/simulator/CanvasMinimap.tsx | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/simulator/CanvasMinimap.css b/frontend/src/components/simulator/CanvasMinimap.css
index b1ea4ce8..3bcac176 100644
--- a/frontend/src/components/simulator/CanvasMinimap.css
+++ b/frontend/src/components/simulator/CanvasMinimap.css
@@ -53,8 +53,8 @@
  * based on the calculated rect bounds. */
 .canvas-minimap-viewport {
   position: absolute;
-  border: 1.5px solid rgba(255, 255, 255, 0.85);
-  background: rgba(255, 255, 255, 0.08);
+  border: 1.5px solid rgba(239, 68, 68, 0.95);
+  background: rgba(239, 68, 68, 0.10);
   border-radius: 2px;
   pointer-events: none;
   /* No transition on left/top — those values change every frame during
diff --git a/frontend/src/components/simulator/CanvasMinimap.tsx b/frontend/src/components/simulator/CanvasMinimap.tsx
index 9eb160ec..840b837f 100644
--- a/frontend/src/components/simulator/CanvasMinimap.tsx
+++ b/frontend/src/components/simulator/CanvasMinimap.tsx
@@ -28,8 +28,8 @@ import type { Component } from '../../types/components';
 import type { BoardInstance } from '../../types/board';
 import './CanvasMinimap.css';
 
-const MINIMAP_W = 200;
-const MINIMAP_H = 150;
+const MINIMAP_W = 140;
+const MINIMAP_H = 105;
 const WORLD_W = 4000;
 const WORLD_H = 3000;
 const SCALE_X = MINIMAP_W / WORLD_W;