Robosats/robosats
1
0
Fork 0
mirror of https://github.com/RoboSats/robosats.git synced 2025-07-20 17:53:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix basic Main styled components

Browse Source
This commit is contained in:
Reckless_Satoshi
2023-04-23 12:03:38 -07:00
parent 34e9557970
commit 4f9280e797
2 changed files with 24 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
frontend/src/basic/Main.tsx
View File

@ -1,6 +1,6 @@
import React, { useContext } from 'react'; import React, { useContext } from 'react';
import { MemoryRouter, BrowserRouter, Routes, Route } from 'react-router-dom'; import { MemoryRouter, BrowserRouter, Routes, Route } from 'react-router-dom';
import { Box, Slide, Typography } from '@mui/material'; import { Box, Slide, Typography, styled } from '@mui/material';
import RobotPage from './RobotPage'; import RobotPage from './RobotPage';
import MakerPage from './MakerPage'; import MakerPage from './MakerPage';
@ -18,7 +18,22 @@ import { UseAppStoreType, AppContext, closeAll } from '../contexts/AppContext';
const Router = window.NativeRobosats === undefined ? BrowserRouter : MemoryRouter; const Router = window.NativeRobosats === undefined ? BrowserRouter : MemoryRouter;
const Main = (): JSX.Element => { const TestnetTypography = styled(Typography)({
height: 0,
});
interface MainBoxProps {
navbarHeight: number;
}
const MainBox = styled(Box)<MainBoxProps>((props) => ({
position: 'absolute',
top: '50%',
left: '50%',
transform: `translate(-50%, -50%) translate(0, -${props.navbarHeight / 2}em)`,
}));
const Main: React.FC = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const { const {
settings, settings,
@ -55,23 +70,14 @@ const Main = (): JSX.Element => {
windowWidth={windowSize.width} windowWidth={windowSize.width}
/> />
{settings.network === 'testnet' ? ( {settings.network === 'testnet' ? (
<div style={{ height: 0 }}> <TestnetTypography color='secondary' align='center'>
<Typography color='secondary' align='center'>
<i>{t('Using Testnet Bitcoin')}</i> <i>{t('Using Testnet Bitcoin')}</i>
</Typography> </TestnetTypography>
</div>
) : ( ) : (
<></> <></>
)} )}
<Box <MainBox navbarHeight={navbarHeight}>
style={{
position: 'absolute',
top: '50%',
left: '50%',
transform: `translate(-50%, -50%) translate(0, -${navbarHeight / 2}em`,
}}
>
<Routes> <Routes>
{['/robot/:refCode?', '/', ''].map((path, index) => { {['/robot/:refCode?', '/', ''].map((path, index) => {
return ( return (
@ -153,10 +159,8 @@ const Main = (): JSX.Element => {
} }
/> />
</Routes> </Routes>
</Box> </MainBox>
<div style={{ alignContent: 'center', display: 'flex' }}>
<NavBar width={windowSize.width} height={navbarHeight} /> <NavBar width={windowSize.width} height={navbarHeight} />
</div>
<MainDialogs /> <MainDialogs />
</Router> </Router>
); );

1
frontend/src/basic/NavBar/NavBar.tsx
View File

@ -16,6 +16,7 @@ import {
} from '@mui/icons-material'; } from '@mui/icons-material';
import RobotAvatar from '../../components/RobotAvatar'; import RobotAvatar from '../../components/RobotAvatar';
import { AppContext, UseAppStoreType, closeAll } from '../../contexts/AppContext'; import { AppContext, UseAppStoreType, closeAll } from '../../contexts/AppContext';
import styled from '@emotion/styled';
interface NavBarProps { interface NavBarProps {
width: number; width: number;