Files
MIKROTIK-RMM/frontend/public/logo-light.svg
T
2GT-RichandClaude Opus 4.8 d79eb13119 feat(ui): theme-aware logo, dashboard bar graph, server-side client sorting (v0.14.1-beta)
UI/UX refinements on top of v0.14.0-beta, all validated on the test server:

- Logo: new theme-aware compass iconmark (light/dark SVGs swapped via the
  dark class), sized to 45px; favicon updated to match. Wordmark casing
  corrected to "MikroTik Manager" (font size unchanged).
- Navigation icons enlarged 15 -> 17px.
- Dashboard: "Connected clients" line chart converted to a bar chart with a
  category axis + light downsampling so bars stay readably thick across ranges.
- Clients: sorting is now server-side across the whole dataset (was sorting
  only the current page, so Type/others appeared to do nothing on a uniform
  page); table uses a fixed column layout + keepPreviousData so columns no
  longer jump or blank out when sorting/paging. Backend clients route gains
  whitelisted sort/dir params (safe numeric IP sort, deterministic tiebreaker).
- Connections tab: surfaces the live /ip/firewall/connection/tracking state
  (on/auto/off pill) and clearer empty-state copy explaining auto-mode.

Lint/typecheck/build/jest green in both workspaces; npm audit --audit-level=high
clean.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-18 13:37:11 -07:00

50 lines
3.7 KiB
XML

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" role="img" aria-labelledby="title desc" version="1.1" id="svg24" xmlns="http://www.w3.org/2000/svg">
<title id="title">MikroTik Manager Config Compass Icon - Light Mode</title>
<desc id="desc">A light-mode SVG app icon showing a network compass with a central manager node and four directional service nodes.</desc>
<defs id="defs13">
<linearGradient id="bgLight" x1="96" y1="80" x2="928" y2="944" gradientUnits="userSpaceOnUse">
<stop stop-color="#FFFFFF" id="stop1" />
<stop offset="1" stop-color="#EAF2FF" id="stop2" />
</linearGradient>
<linearGradient id="ringLight" x1="236" y1="244" x2="788" y2="780" gradientUnits="userSpaceOnUse">
<stop stop-color="#6757F5" id="stop3" />
<stop offset="0.48" stop-color="#0777D8" id="stop4" />
<stop offset="1" stop-color="#00A98F" id="stop5" />
</linearGradient>
<linearGradient id="northLight" x1="512" y1="136" x2="512" y2="318" gradientUnits="userSpaceOnUse">
<stop stop-color="#00BFB3" id="stop6" />
<stop offset="1" stop-color="#0877D8" id="stop7" />
</linearGradient>
<linearGradient id="eastLight" x1="702" y1="512" x2="900" y2="512" gradientUnits="userSpaceOnUse">
<stop stop-color="#0877D8" id="stop8" />
<stop offset="1" stop-color="#00BFB3" id="stop9" />
</linearGradient>
<linearGradient id="southLight" x1="512" y1="708" x2="512" y2="900" gradientUnits="userSpaceOnUse">
<stop stop-color="#79C900" id="stop10" />
<stop offset="1" stop-color="#1CB85E" id="stop11" />
</linearGradient>
<linearGradient id="westLight" x1="320" y1="512" x2="126" y2="512" gradientUnits="userSpaceOnUse">
<stop stop-color="#6757F5" id="stop12" />
<stop offset="1" stop-color="#914AF8" id="stop13" />
</linearGradient>
</defs>
<rect x="64" y="64" width="896" height="896" rx="208" fill="url(#bgLight)" id="rect13" />
<rect x="76" y="76" width="872" height="872" rx="196" stroke="#D5E2F2" stroke-width="20" id="rect14" />
<circle cx="512" cy="512" r="262" stroke="url(#ringLight)" stroke-width="32" stroke-linecap="round" stroke-dasharray="360 70 360 70" id="circle14" />
<circle cx="512" cy="512" r="116" stroke="#152238" stroke-width="28" id="circle15" />
<path d="M512 194 L552 306 H472 L512 194Z" fill="url(#northLight)" id="path15" />
<path d="M830 512 L718 552 V472 L830 512Z" fill="url(#eastLight)" id="path16" />
<path d="M512 830 L472 718 H552 L512 830Z" fill="url(#southLight)" id="path17" />
<path d="M194 512 L306 472 V552 L194 512Z" fill="url(#westLight)" id="path18" />
<line x1="512" y1="300" x2="512" y2="396" stroke="#152238" stroke-width="28" stroke-linecap="round" id="line18" />
<line x1="628" y1="512" x2="724" y2="512" stroke="#152238" stroke-width="28" stroke-linecap="round" id="line19" />
<line x1="512" y1="628" x2="512" y2="724" stroke="#152238" stroke-width="28" stroke-linecap="round" id="line20" />
<line x1="300" y1="512" x2="396" y2="512" stroke="#152238" stroke-width="28" stroke-linecap="round" id="line21" />
<circle cx="512" cy="294" r="46" fill="#FFFFFF" stroke="url(#northLight)" stroke-width="28" id="circle21" />
<circle cx="730" cy="512" r="46" fill="#FFFFFF" stroke="url(#eastLight)" stroke-width="28" id="circle22" />
<circle cx="512" cy="730" r="46" fill="#FFFFFF" stroke="url(#southLight)" stroke-width="28" id="circle23" />
<circle cx="294" cy="512" r="46" fill="#FFFFFF" stroke="url(#westLight)" stroke-width="28" id="circle24" />
<path d="M 454.87456,567.20426 V 458.79529 L 512,535.88611 569.12545,458.79529 v 108.40897" stroke="#152238" stroke-width="38" stroke-linecap="round" stroke-linejoin="round" id="path24" />
</svg>