a
/
otterscan
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'feature/fix-home-flickering' into develop

This commit is contained in:
Willian Mitsuda 2021-10-22 15:15:09 -03:00
parent 1d044cee85 f62f41759f
commit eaa520c21e
4 changed files with 25 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/App.tsx
View File

@ -53,21 +53,19 @@ const App = () => {
</Route> </Route>
<Route> <Route>
<AppConfigContext.Provider value={appConfig}> <AppConfigContext.Provider value={appConfig}>
<div className="mb-auto"> <Title />
<Title /> <Route path="/block/:blockNumberOrHash" exact>
<Route path="/block/:blockNumberOrHash" exact> <Block />
<Block /> </Route>
</Route> <Route path="/block/:blockNumber/txs" exact>
<Route path="/block/:blockNumber/txs" exact> <BlockTransactions />
<BlockTransactions /> </Route>
</Route> <Route path="/tx/:txhash">
<Route path="/tx/:txhash"> <Transaction />
<Transaction /> </Route>
</Route> <Route path="/address/:addressOrName/:direction?">
<Route path="/address/:addressOrName/:direction?"> <AddressTransactions />
<AddressTransactions /> </Route>
</Route>
</div>
</AppConfigContext.Provider> </AppConfigContext.Provider>
</Route> </Route>
</Switch> </Switch>

15
src/Home.tsx
View File

@ -38,9 +38,11 @@ const Home: React.FC = () => {
document.title = "Home | Otterscan"; document.title = "Home | Otterscan";
return ( return (
<div className="m-auto"> <div className="mx-auto flex flex-col h-full">
{isScanning && <CameraScanner turnOffScan={() => setScanning(false)} />} {isScanning && <CameraScanner turnOffScan={() => setScanning(false)} />}
<Logo /> <div className="m-5 mb-10 flex items-end flex-grow max-h-72">
<Logo />
</div>
<form <form
className="flex flex-col" className="flex flex-col"
onSubmit={handleSubmit} onSubmit={handleSubmit}
@ -71,7 +73,9 @@ const Home: React.FC = () => {
> >
Search Search
</button> </button>
<div className="mx-auto mt-5 mb-5 text-lg text-link-blue hover:text-link-blue-hover font-bold"> </form>
<div className="mx-auto h-32">
<div className="text-lg text-link-blue hover:text-link-blue-hover font-bold">
<NavLink to="/special/london"> <NavLink to="/special/london">
<div className="flex space-x-2 items-baseline text-orange-500 hover:text-orange-700 hover:underline"> <div className="flex space-x-2 items-baseline text-orange-500 hover:text-orange-700 hover:underline">
<span> <span>
@ -86,14 +90,15 @@ const Home: React.FC = () => {
</div> </div>
{latestBlock && ( {latestBlock && (
<NavLink <NavLink
className="mx-auto flex flex-col items-center space-y-1 mt-5 text-sm text-gray-500 hover:text-link-blue" className="flex flex-col items-center space-y-1 mt-5 text-sm text-gray-500 hover:text-link-blue"
to={blockURL(latestBlock.number)} to={blockURL(latestBlock.number)}
> >
<div>Latest block: {commify(latestBlock.number)}</div> <div>Latest block: {commify(latestBlock.number)}</div>
<Timestamp value={latestBlock.timestamp} /> <Timestamp value={latestBlock.timestamp} />
</NavLink> </NavLink>
)} )}
</form> </div>
<div className="flex-grow pb-5"></div>
</div> </div>
); );
}; };

2
src/Logo.tsx
View File

@ -2,7 +2,7 @@ import React from "react";
import Otter from "./otter.jpg"; import Otter from "./otter.jpg";
const Logo: React.FC = () => ( const Logo: React.FC = () => (
<div className="mx-auto mb-16 text-6xl text-link-blue font-title font-bold cursor-default flex items-center space-x-4"> <div className="mx-auto text-6xl text-link-blue font-title font-bold cursor-default flex items-center space-x-4">
<img <img
className="rounded-full" className="rounded-full"
src={Otter} src={Otter}

2
src/StandardFrame.tsx
View File

@ -1,7 +1,7 @@
import React from "react"; import React from "react";
const StandardFrame: React.FC = ({ children }) => ( const StandardFrame: React.FC = ({ children }) => (
<div className="bg-gray-100 px-9 pt-3 pb-12">{children}</div> <div className="flex-grow bg-gray-100 px-9 pt-3 pb-12">{children}</div>
); );
export default StandardFrame; export default StandardFrame;