From 3b92e34309cf89b52406f36251a26209d87fd137 Mon Sep 17 00:00:00 2001 From: Paul Miller Date: Wed, 12 Apr 2023 12:30:28 -0500 Subject: [PATCH 01/24] aesthetic improvements --- src/assets/icons/airplane.svg | 3 + src/components/App.tsx | 30 +++++---- src/components/BalanceBox.tsx | 14 ++-- src/components/KitchenSink.tsx | 4 +- src/components/NavBar.tsx | 12 +++- src/components/layout/Button.tsx | 10 +-- src/components/layout/index.tsx | 24 ++++++- src/root.css | 2 +- src/routes/Receive.tsx | 108 +++++++++++++++---------------- src/routes/Send.tsx | 13 ++++ src/routes/index.tsx | 16 ++--- tailwind.config.cjs | 37 +++++++++-- 12 files changed, 164 insertions(+), 109 deletions(-) create mode 100644 src/assets/icons/airplane.svg create mode 100644 src/routes/Send.tsx diff --git a/src/assets/icons/airplane.svg b/src/assets/icons/airplane.svg new file mode 100644 index 0000000..148e25c --- /dev/null +++ b/src/assets/icons/airplane.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/App.tsx b/src/components/App.tsx index 5dc0c90..b8da43e 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -1,5 +1,5 @@ import logo from '~/assets/icons/mutiny-logo.svg'; -import { SafeArea } from "~/components/layout"; +import { NodeManagerGuard, SafeArea } from "~/components/layout"; import BalanceBox from "~/components/BalanceBox"; import NavBar from "~/components/NavBar"; @@ -9,18 +9,20 @@ import KitchenSink from './KitchenSink'; export default function App() { return ( - -
-
- -
- - - - {/* safety div */} -
-
- -
+ + +
+
+ +
+ + + + {/* safety div */} +
+
+ +
+
); } diff --git a/src/components/BalanceBox.tsx b/src/components/BalanceBox.tsx index 9e23535..40eefdf 100644 --- a/src/components/BalanceBox.tsx +++ b/src/components/BalanceBox.tsx @@ -15,14 +15,10 @@ export default function BalanceBox() { const [state, _] = useMegaStore(); const fetchBalance = async () => { - if (state.node_manager) { - console.log("Refetching balance"); - await state.node_manager.sync(); - const balance = await state.node_manager.get_balance(); - return balance - } else { - return undefined - } + console.log("Refetching balance"); + await state.node_manager?.sync(); + const balance = await state.node_manager?.get_balance(); + return balance }; const [balance, { refetch: refetchBalance }] = createResource(fetchBalance); @@ -63,7 +59,7 @@ export default function BalanceBox() {
- Send + Send Receive
diff --git a/src/components/KitchenSink.tsx b/src/components/KitchenSink.tsx index bf43885..4dcf37e 100644 --- a/src/components/KitchenSink.tsx +++ b/src/components/KitchenSink.tsx @@ -60,12 +60,12 @@ function ConnectPeer(props: { refetchPeers: RefetchPeersType }) { }; return ( -
+ Connect Peer diff --git a/src/components/NavBar.tsx b/src/components/NavBar.tsx index 9c6e97d..b41f382 100644 --- a/src/components/NavBar.tsx +++ b/src/components/NavBar.tsx @@ -1,16 +1,17 @@ import mutiny_m from '~/assets/icons/m.svg'; import scan from '~/assets/icons/scan.svg'; +import airplane from '~/assets/icons/airplane.svg'; import settings from '~/assets/icons/settings.svg'; import { A } from "solid-start"; -type ActiveTab = 'home' | 'scan' | 'settings' | 'none'; +type ActiveTab = 'home' | 'scan' | 'send' | 'settings' | 'none'; export default function NavBar(props: { activeTab: ActiveTab }) { - const activeStyle = 'h-full border-t-2 border-b-2 border-b-black flex flex-col justify-center md:border-t-0 md:border-b-0 md:p-2 md:bg-white/20 md:rounded-xl' + const activeStyle = 'h-full border-t-2 border-b-2 border-b-sidebar-gray flex flex-col justify-center md:border-t-0 md:border-b-0 md:p-2 md:bg-white/20 md:rounded-xl' const inactiveStyle = "md:p-2 md:hover:bg-white/10 md:rounded-xl" return ( -