Added Panel component. New color scheme.

src/components/metrics/MetricsTable.tsx

@@ -91,7 +91,7 @@ export function MetricsTable({
         background: 'var(--background-color)',
         border: '1px solid var(--border-color)',
         borderRadius: 'var(--border-radius)',
-        padding: '10px',
+        padding: '16px',
       }}
     >
       {error && <ErrorMessage />}

src/components/metrics/PageviewsChart.tsx

@@ -2,6 +2,7 @@ import { useMemo } from 'react';
 import { BarChart, BarChartProps } from '@/components/charts/BarChart';
 import { useLocale, useTheme, useMessages } from '@/components/hooks';
 import { renderDateLabels } from '@/lib/charts';
+import { Panel } from '@/components/layout/Panel';
 
 export interface PageviewsChartProps extends BarChartProps {
   data: {
@@ -76,13 +77,15 @@ export function PageviewsChart({
   }, [data, locale]);
 
   return (
-    <BarChart
-      {...props}
-      data={chartData}
-      unit={unit}
-      isLoading={isLoading}
-      isAllTime={isAllTime}
-      renderXLabel={renderDateLabels(unit, locale)}
-    />
+    <Panel>
+      <BarChart
+        {...props}
+        data={chartData}
+        unit={unit}
+        isLoading={isLoading}
+        isAllTime={isAllTime}
+        renderXLabel={renderDateLabels(unit, locale)}
+      />
+    </Panel>
   );
 }