diff --git a/apps/frontend/src/components/bookkeeper/BkprHome/AccountEventsInfo/AccountEventsInfo.tsx b/apps/frontend/src/components/bookkeeper/BkprHome/AccountEventsInfo/AccountEventsInfo.tsx index 47b169f9..3a83e5a9 100644 --- a/apps/frontend/src/components/bookkeeper/BkprHome/AccountEventsInfo/AccountEventsInfo.tsx +++ b/apps/frontend/src/components/bookkeeper/BkprHome/AccountEventsInfo/AccountEventsInfo.tsx @@ -41,7 +41,7 @@ const AccountEventsInfo = () => { : - <> + Total Invoice Received @@ -51,8 +51,6 @@ const AccountEventsInfo = () => { Total Payments Sent - - - Routing Revenue + @@ -62,7 +60,7 @@ const AccountEventsInfo = () => { - - > + } diff --git a/apps/frontend/src/components/bookkeeper/BkprHome/BkprHome.scss b/apps/frontend/src/components/bookkeeper/BkprHome/BkprHome.scss index d433805f..dc14b473 100644 --- a/apps/frontend/src/components/bookkeeper/BkprHome/BkprHome.scss +++ b/apps/frontend/src/components/bookkeeper/BkprHome/BkprHome.scss @@ -1,12 +1,5 @@ @use '../../../styles/constants' as *; -[data-screensize='SM'], -[data-screensize='XS'] { - & .cards-container { - height: 77vh; - } -} - .bookkeeper-dashboard-container { padding: 0 1rem; } diff --git a/apps/frontend/src/components/bookkeeper/BkprHome/SatsFlowInfo/SatsFlowInfo.tsx b/apps/frontend/src/components/bookkeeper/BkprHome/SatsFlowInfo/SatsFlowInfo.tsx index 805a0cc7..033fba35 100644 --- a/apps/frontend/src/components/bookkeeper/BkprHome/SatsFlowInfo/SatsFlowInfo.tsx +++ b/apps/frontend/src/components/bookkeeper/BkprHome/SatsFlowInfo/SatsFlowInfo.tsx @@ -41,7 +41,7 @@ const SatsFlowInfo = () => { : - + Inflow this month @@ -54,7 +54,7 @@ const SatsFlowInfo = () => { - + } diff --git a/apps/frontend/src/components/bookkeeper/BkprHome/VolumeInfo/VolumeInfo.tsx b/apps/frontend/src/components/bookkeeper/BkprHome/VolumeInfo/VolumeInfo.tsx index bae84dc5..057d0d4c 100644 --- a/apps/frontend/src/components/bookkeeper/BkprHome/VolumeInfo/VolumeInfo.tsx +++ b/apps/frontend/src/components/bookkeeper/BkprHome/VolumeInfo/VolumeInfo.tsx @@ -55,7 +55,7 @@ const VolumeInfo = () => { : <> - + Route with Most Traffic { > {bkprSummary.most_traffic_route?.channel_scids} - - Route with Least Traffic { > {bkprSummary.least_traffic_route?.channel_scids} - + > } diff --git a/apps/frontend/src/components/ui/Header/Header.tsx b/apps/frontend/src/components/ui/Header/Header.tsx index ece5ce09..ed1d345e 100755 --- a/apps/frontend/src/components/ui/Header/Header.tsx +++ b/apps/frontend/src/components/ui/Header/Header.tsx @@ -42,75 +42,84 @@ const Header = (props) => { if (currentScreenSize === Breakpoints.XS || currentScreenSize === Breakpoints.SM) { return ( - + - - - - - - CLN - - - - - {serverConfig.singleSignOn === true || serverConfig.singleSignOn === "true" ? - - : - - - - } - - {(isDarkMode) ? : } - - - - - - {isAuthenticated && nodeInfo.isLoading ? - <> - Loading} - > - - - Loading... - > - : - nodeInfo.error ? - <> - Error} - > - - - {('Error: ' + nodeInfo.error)} - > - : - <> - Connected} - > - - - {nodeInfo.alias?.replace('--', '-').replace(/-\d+-.*$/, '') + ' (' + nodeInfo.version + ')'} - > - } + + + + + + + + + Core Lightning Node + + + + {isAuthenticated && nodeInfo.isLoading ? + <> + Loading} + > + + + Loading... + > + : + nodeInfo.error ? + <> + Error} + > + + + {('Error: ' + nodeInfo.error)} + > + : + <> + Connected} + > + + + {nodeInfo.alias?.replace('--', '-').replace(/-\d+-.*$/, '')} + > + } + + + + + + + + {serverConfig.singleSignOn === true || serverConfig.singleSignOn === "true" ? + + : + + + + } + + {(isDarkMode) ? : } + + + + + @@ -213,4 +222,3 @@ const Header = (props) => { }; export default Header; - diff --git a/apps/frontend/src/components/ui/Menu/Menu.scss b/apps/frontend/src/components/ui/Menu/Menu.scss index 2e6aeddb..900a02d8 100644 --- a/apps/frontend/src/components/ui/Menu/Menu.scss +++ b/apps/frontend/src/components/ui/Menu/Menu.scss @@ -4,7 +4,6 @@ text-decoration: none; & .dropdown-toggle.btn-menu { background-color: $primary; - width: 8rem; padding: 1.25rem 1.375rem; &::after { display: none; @@ -32,8 +31,13 @@ .menu-dropdown.dropdown { & .dropdown-toggle.btn-menu { color: $white; - & svg path { - fill: $white; + & svg { + .cls-1 { + fill:none; + stroke:$white; + stroke-linecap:round; + stroke-linejoin:round; + } } } & > .dropdown-menu { @@ -42,9 +46,14 @@ } .btn-compact { background-color: $primary; - & svg > path { - fill: $dark; - } + & svg { + .cls-1 { + fill:none; + stroke:$dark; + stroke-linecap:round; + stroke-linejoin:round; + } + } } } @@ -52,8 +61,13 @@ .menu-dropdown.dropdown { & .dropdown-toggle.btn-menu { color: $card-bg-dark; - & svg path { - fill: $card-bg-dark; + & svg { + .cls-1 { + fill:none; + stroke:$card-bg-dark; + stroke-linecap:round; + stroke-linejoin:round; + } } } & .dropdown-menu { @@ -64,8 +78,13 @@ } .btn-compact { background-color: $primary; - & svg > path { - fill: $dark; + & svg { + .cls-1 { + fill:none; + stroke:$dark; + stroke-linecap:round; + stroke-linejoin:round; + } } } } diff --git a/apps/frontend/src/components/ui/Menu/Menu.tsx b/apps/frontend/src/components/ui/Menu/Menu.tsx index 423fe126..9a0ef6e9 100644 --- a/apps/frontend/src/components/ui/Menu/Menu.tsx +++ b/apps/frontend/src/components/ui/Menu/Menu.tsx @@ -3,6 +3,8 @@ import { Link, useLocation } from 'react-router-dom'; import Dropdown from 'react-bootstrap/Dropdown'; import { useSelector } from 'react-redux'; import { selectIsAuthenticated, selectNodeInfo } from '../../../store/rootSelectors'; +import { HomeSVG } from '../../../svgs/Home'; +import { BookkeeperSVG } from '../../../svgs/Bookkeeper'; const Menu = props => { const isAuthenticated = useSelector(selectIsAuthenticated); @@ -21,19 +23,17 @@ const Menu = props => { > - {location.pathname.includes('bookkeeper') ? 'Dashboard' : 'Bookkeeper'} + + {props.compact ? '' : location.pathname.includes('bookkeeper') ? 'Dashboard' : 'Bookkeeper'} + {location.pathname.includes('bookkeeper') ? : } + ); diff --git a/apps/frontend/src/components/ui/Settings/Settings.scss b/apps/frontend/src/components/ui/Settings/Settings.scss index b76d2654..31b0cfc9 100644 --- a/apps/frontend/src/components/ui/Settings/Settings.scss +++ b/apps/frontend/src/components/ui/Settings/Settings.scss @@ -2,6 +2,9 @@ .settings-menu.dropdown { & .dropdown-toggle.btn-settings-menu { + &.btn-compact { + margin-left: 0; + } margin-left: 0.5rem; padding: 1.25rem 1.375rem; &::after { diff --git a/apps/frontend/src/svgs/Bookkeeper.tsx b/apps/frontend/src/svgs/Bookkeeper.tsx new file mode 100644 index 00000000..e191fd77 --- /dev/null +++ b/apps/frontend/src/svgs/Bookkeeper.tsx @@ -0,0 +1,21 @@ +import React from 'react'; + +export const BookkeeperSVG = props => { + return ( + + + + + + ); +}; diff --git a/apps/frontend/src/svgs/Home.tsx b/apps/frontend/src/svgs/Home.tsx new file mode 100644 index 00000000..53b7f216 --- /dev/null +++ b/apps/frontend/src/svgs/Home.tsx @@ -0,0 +1,20 @@ +import React from 'react'; + +export const HomeSVG = props => { + return ( + + + + ); +};