From c790465857c06dd544fe591769be9c09c41617e9 Mon Sep 17 00:00:00 2001 From: Donkie Date: Sat, 14 Oct 2023 12:35:55 +0200 Subject: [PATCH] Added tip button to bottom of page --- client/public/kofi_s_logo_nolabel.png | Bin 0 -> 4305 bytes client/src/App.tsx | 27 ++--------- client/src/components/layout.tsx | 67 ++++++++++++++++++++++++++ 3 files changed, 71 insertions(+), 23 deletions(-) create mode 100644 client/public/kofi_s_logo_nolabel.png create mode 100644 client/src/components/layout.tsx diff --git a/client/public/kofi_s_logo_nolabel.png b/client/public/kofi_s_logo_nolabel.png new file mode 100644 index 0000000000000000000000000000000000000000..0268ce756f36ec6601eed4be0eabc8fa7718f93b GIT binary patch literal 4305 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 am@&_Y?mD)lE;qXN(E)GcjH|E;Ncb0Z&{Bf{ literal 0 HcmV?d00001 diff --git a/client/src/App.tsx b/client/src/App.tsx index 1c1010c..6caec8f 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -2,7 +2,7 @@ import { Refine } from "@refinedev/core"; import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar"; import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; -import { ErrorComponent, ThemedLayoutV2, ThemedSiderV2, ThemedTitleV2 } from "@refinedev/antd"; +import { ErrorComponent } from "@refinedev/antd"; import "@refinedev/antd/dist/reset.css"; import routerBindings, { @@ -13,19 +13,15 @@ import routerBindings, { import dataProvider from "./components/dataProvider"; import { useTranslation } from "react-i18next"; import { BrowserRouter, Outlet, Route, Routes } from "react-router-dom"; -import { Header } from "./components/header"; import { ColorModeContextProvider } from "./contexts/color-mode"; -// @ts-expect-error: svg file -import Logo from "./icon.svg?react"; import { FileOutlined, HighlightOutlined, UserOutlined } from "@ant-design/icons"; import { ConfigProvider } from "antd"; -import { Footer } from "antd/es/layout/layout"; -import { Version } from "./components/version"; import React from "react"; import { Locale } from "antd/es/locale"; import { languages } from "./i18n"; import loadable from "@loadable/component"; import SpoolmanNotificationProvider from "./components/notificationProvider"; +import { SpoolmanLayout } from "./components/layout"; interface PageProps { resource: "spools" | "filaments" | "vendors"; @@ -135,24 +131,9 @@ function App() {
} - Sider={() => ( - ( - } /> - )} - /> - )} - Footer={() => ( -
- Spoolman - {t("version")} -
- )} - > + - + } > } /> diff --git a/client/src/components/layout.tsx b/client/src/components/layout.tsx new file mode 100644 index 0000000..28a06c3 --- /dev/null +++ b/client/src/components/layout.tsx @@ -0,0 +1,67 @@ +import { ThemedLayoutV2, ThemedSiderV2, ThemedTitleV2 } from "@refinedev/antd"; +import { Header } from "./header"; +import { Footer } from "antd/es/layout/layout"; +import { Version } from "./version"; +import { Button } from "antd"; +// @ts-expect-error: svg file +import Logo from "../icon.svg?react"; +import { useTranslate } from "@refinedev/core"; + +const SpoolmanFooter: React.FC = () => { + const t = useTranslate(); + + return ( +
+
+
+ {t("version")} +
+
+ +
+
+
+ ); +}; + +interface SpoolmanLayoutProps { + children: React.ReactNode; +} + +export const SpoolmanLayout: React.FC = ({ children }) => ( +
} + Sider={() => ( + } />} + /> + )} + Footer={() => } + > + {children} + +);