fix(client): tighten the toast appearance

- Drop the per-type icon
- Lower min-height to 40px and tighten padding
- Thin both the active progress bar and its track to 2px and pin them to the same baseline so they sit on top of each other
This commit is contained in:
gorkem-bwl committed 2026-04-26 01:32:05 -04:00
1 parent 2016a208f2
commit 1bff81c6bb
1 file changed
+10
+10
View File
@@ -33,6 +33,11 @@ function App() {
body: {
backgroundColor: theme.palette.background.default,
},
".Toastify__progress-bar, .Toastify__progress-bar--bg": {
height: 2,
bottom: 0,
top: "auto",
},
}}
/>
<AppLayout>
@@ -41,12 +46,17 @@ function App() {
<ToastContainer
newestOnTop={true}
theme={mode}
icon={false}
style={
{
"--toastify-color-progress-light": theme.palette.primary.main,
"--toastify-color-progress-dark": theme.palette.primary.main,
"--toastify-toast-min-height": "40px",
"--toastify-toast-padding": "8px 12px",
} as CSSProperties
}
toastStyle={{ minHeight: 40, padding: "8px 12px" }}
progressStyle={{ height: 2 }}
/>
</ThemeProvider>
</SWRConfig>