fix: replace Outlined icon variants with filled equivalents for visual consistency

Replace DeleteOutline→Delete, CheckCircleOutline→CheckCircle, ErrorOutline→Error,
RemoveCircleOutline→RemoveCircle, InfoOutlined→Info across all dashboard components.
Replace custom SVG bar chart in OverviewClient with BarChartIcon.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
fuomag9
2026-02-27 15:25:19 +01:00
parent bfb6b2060f
commit 2096ebf1ed
4 changed files with 11 additions and 12 deletions
+2 -3
View File
@@ -3,6 +3,7 @@
import Link from "next/link";
import Grid from "@mui/material/Grid";
import { Card, CardActionArea, CardContent, Paper, Stack, Typography, Box } from "@mui/material";
import BarChartIcon from "@mui/icons-material/BarChart";
import { ReactNode } from "react";
type StatCard = {
@@ -114,9 +115,7 @@ export default function OverviewClient({
>
<CardContent sx={{ display: "flex", flexDirection: "column", gap: 1 }}>
<Box sx={{ color: "rgba(127, 91, 255, 0.8)", display: "flex", alignItems: "center" }}>
<svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" viewBox="0 0 24 24" fill="currentColor">
<path d="M5 9.2h3V19H5zM10.6 5h2.8v14h-2.8zm5.6 8H19v6h-2.8z"/>
</svg>
<BarChartIcon fontSize="large" />
</Box>
{trafficSummary ? (
<>
@@ -1,7 +1,7 @@
"use client";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
import InfoIcon from "@mui/icons-material/Info";
import {
Accordion,
AccordionDetails,
@@ -39,7 +39,7 @@ export default function CertificatesClient({ certificates }: Props) {
</Typography>
</Stack>
<Alert severity="info" icon={<InfoOutlinedIcon />}>
<Alert severity="info" icon={<InfoIcon />}>
<Typography variant="body2" fontWeight={600} gutterBottom>
How Caddy handles certificates:
</Typography>
@@ -25,9 +25,9 @@ import {
} from "@mui/material";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import AddIcon from "@mui/icons-material/Add";
import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline";
import DeleteIcon from "@mui/icons-material/Delete";
import CheckCircleIcon from "@mui/icons-material/CheckCircle";
import ErrorIcon from "@mui/icons-material/Error";
import WarningAmberIcon from "@mui/icons-material/WarningAmber";
import PublicIcon from "@mui/icons-material/Public";
import SearchIcon from "@mui/icons-material/Search";
@@ -61,7 +61,7 @@ function GeoIpStatus() {
const noneLoaded = !status?.country && !status?.asn;
const color = allLoaded ? "success" : noneLoaded ? "error" : "warning";
const Icon = allLoaded ? CheckCircleOutlineIcon : noneLoaded ? ErrorOutlineIcon : WarningAmberIcon;
const Icon = allLoaded ? CheckCircleIcon : noneLoaded ? ErrorIcon : WarningAmberIcon;
const label = allLoaded ? "GeoIP ready" : noneLoaded ? "GeoIP missing" : "GeoIP partial";
const tooltip = noneLoaded
? "GeoIP databases not found — country/continent/ASN blocking will not work. Enable the geoipupdate service."
@@ -552,7 +552,7 @@ function ResponseHeadersEditor({ initialHeaders }: { initialHeaders: Record<stri
/>
<Tooltip title="Remove">
<IconButton size="small" color="error" onClick={() => setRows((prev) => prev.filter((_, j) => j !== i))} sx={{ mt: 0.5 }}>
<DeleteOutlineIcon fontSize="small" />
<DeleteIcon fontSize="small" />
</IconButton>
</Tooltip>
</Stack>
+2 -2
View File
@@ -1,7 +1,7 @@
import { Box, Button, IconButton, Stack, TextField, Tooltip, Typography, Autocomplete, InputAdornment } from "@mui/material";
import AddIcon from "@mui/icons-material/Add";
import RemoveCircleOutlineIcon from "@mui/icons-material/RemoveCircleOutline";
import RemoveCircleIcon from "@mui/icons-material/RemoveCircle";
import { useState } from "react";
const PROTOCOL_OPTIONS = ["http://", "https://"];
@@ -115,7 +115,7 @@ export function UpstreamInput({
color="error"
sx={{ mt: 0.5 }}
>
<RemoveCircleOutlineIcon fontSize="small" />
<RemoveCircleIcon fontSize="small" />
</IconButton>
</span>
</Tooltip>