Commit 68176c65 authored by tom's avatar tom

Revert "fix footer placement"

This reverts commit f05c6d41.
parent 6f66908c
......@@ -60,14 +60,9 @@ const Page = ({
) : children;
return (
<Flex w="100%" minH="100vh" alignItems="flex-start">
<Flex w="100%" minH="100vh" alignItems="stretch">
<NavigationDesktop/>
<Flex
flexDir="column"
flexGrow={ 1 } w={{ base: '100%', lg: 'auto' }}
borderLeft="1px solid"
borderColor="divider"
>
<Flex flexDir="column" flexGrow={ 1 } w={{ base: '100%', lg: 'auto' }}>
{ renderHeader ?
renderHeader() :
<Header isHomePage={ isHomePage }/>
......
......@@ -20,10 +20,18 @@ const VERSION_URL = `https://github.com/blockscout/blockscout/tree/${ appConfig.
interface Props {
isCollapsed?: boolean;
hasAccount?: boolean;
}
const NavFooter = ({ isCollapsed }: Props) => {
const NavFooter = ({ isCollapsed, hasAccount }: Props) => {
const isExpanded = isCollapsed === false;
const marginTop = (() => {
if (!hasAccount) {
return 'auto';
}
return { base: 6, lg: 20 };
})();
return (
<VStack
......@@ -31,7 +39,7 @@ const NavFooter = ({ isCollapsed }: Props) => {
borderTop="1px solid"
borderColor="divider"
width={{ base: '100%', lg: isExpanded ? '180px' : '20px', xl: isCollapsed ? '20px' : '180px' }}
marginTop="auto"
marginTop={ marginTop }
alignItems="flex-start"
alignSelf="center"
color="gray.500"
......
......@@ -54,9 +54,10 @@ const NavigationDesktop = () => {
position="relative"
flexDirection="column"
alignItems="stretch"
borderRight="1px solid"
borderColor="divider"
px={{ lg: isExpanded ? 6 : 4, xl: isCollapsed ? 4 : 6 }}
py={ 12 }
minH="100vh"
width={{ lg: isExpanded ? '229px' : '92px', xl: isCollapsed ? '92px' : '229px' }}
{ ...getDefaultTransitionProps({ transitionProperty: 'width, padding' }) }
>
......@@ -90,13 +91,13 @@ const NavigationDesktop = () => {
</VStack>
</Box>
{ hasAccount && (
<Box as="nav" borderTopWidth="1px" borderColor="divider" w="100%" mt={ 6 } pt={ 6 } mb={ 20 }>
<Box as="nav" borderTopWidth="1px" borderColor="divider" w="100%" mt={ 6 } pt={ 6 }>
<VStack as="ul" spacing="1" alignItems="flex-start">
{ accountNavItems.map((item) => <NavLink key={ item.text } item={ item } isCollapsed={ isCollapsed }/>) }
</VStack>
</Box>
) }
<NavFooter isCollapsed={ isCollapsed }/>
<NavFooter isCollapsed={ isCollapsed } hasAccount={ hasAccount }/>
<Icon
as={ chevronIcon }
width={ 6 }
......
......@@ -71,7 +71,6 @@ const NavigationMobile = () => {
<Box
as="nav"
mt={ 6 }
mb={ 6 }
pt={ 6 }
borderTopWidth="1px"
borderColor="divider"
......@@ -81,7 +80,7 @@ const NavigationMobile = () => {
</VStack>
</Box>
) }
<NavFooter/>
<NavFooter hasAccount={ hasAccount }/>
</Box>
{ openedGroupIndex >= 0 && (
<Box
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment