Merge pull request #166 from ethereum/grid-gap

chore: update spacing between sections on home and /downloads pages
This commit is contained in:
Corwin Smith 2022-12-15 09:57:01 -07:00 committed by GitHub
commit 77d4a92374
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 20 additions and 13 deletions

@ -2,10 +2,9 @@ import { FC } from 'react';
import { Box, Flex, Link, Stack, Text, useColorMode } from '@chakra-ui/react';
import NextLink from 'next/link';
import { Search } from '../UI';
import { HeaderButtons, Search } from './';
import { MoonIcon, SunIcon } from '../UI/icons';
import { HeaderButtons } from './';
import { MobileMenu } from '../layouts';
export const Header: FC = () => {
@ -14,7 +13,7 @@ export const Header: FC = () => {
return (
<Flex
mb={4}
mb={{ base: 4, lg: 8 }}
border='2px'
borderColor='primary'
justifyContent='space-between'

@ -8,7 +8,11 @@ interface Props {
export const SpecificVersionsSection: FC<Props> = ({ children }) => {
return (
<Grid id='specificversions' templateColumns={{ base: '1fr', md: '300px 1fr' }} gap={4}>
<Grid
id='specificversions'
templateColumns={{ base: '1fr', md: '300px 1fr' }}
gap={{ base: 4, lg: 8 }}
>
<GridItem w='auto'>
<Box h='100%'>
{/* TODO: replace with animated/video version */}

@ -20,7 +20,7 @@ const hoverStyles = {
export const Footer: FC = () => {
return (
<Flex mt={4} direction={{ base: 'column', lg: 'row' }}>
<Flex mt={{ base: 4, lg: 8 }} direction={{ base: 'column', lg: 'row' }}>
<Flex
direction={{ base: 'column', md: 'row' }}
justifyContent={{ md: 'space-between' }}

@ -299,7 +299,7 @@ const DownloadsPage: NextPage<Props> = ({ data }) => {
<PageMetadata title={METADATA.DOWNLOADS_TITLE} description={METADATA.DOWNLOADS_DESCRIPTION} />
<main id='main-content'>
<Stack spacing={4}>
<Stack spacing={{ base: 4, lg: 8 }}>
<DownloadsHero
currentBuild={LATEST_RELEASES_DATA.releaseName}
currentBuildVersion={LATEST_RELEASES_DATA.versionNumber}

@ -1,8 +1,6 @@
import { Box, Grid, GridItem, Link, Stack, Text } from '@chakra-ui/react';
import type { NextPage } from 'next';
import { GopherHomeFront } from '../components/UI/svgs';
import {
HomeHero,
HomeSection,
@ -11,7 +9,7 @@ import {
WhyRunANode
} from '../components/UI/homepage';
import { PageMetadata } from '../components/UI';
import { GopherHomeLinks } from '../components/UI/svgs';
import { GopherHomeFront, GopherHomeLinks } from '../components/UI/svgs';
import {
CONTRIBUTING_PAGE,
@ -29,10 +27,13 @@ const HomePage: NextPage = ({}) => {
<PageMetadata title={METADATA.HOME_TITLE} description={METADATA.HOME_DESCRIPTION} />
<main id='main-content'>
<Stack spacing={4}>
<Stack spacing={{ base: 4, lg: 8 }}>
<HomeHero />
<Grid templateColumns={{ base: 'repeat(1, 1fr)', lg: 'repeat(2, 1fr)' }} gap={4}>
<Grid
templateColumns={{ base: 'repeat(1, 1fr)', lg: 'repeat(2, 1fr)' }}
gap={{ base: 4, lg: 8 }}
>
<GridItem rowSpan={2}>
{/* SECTION: What is Geth */}
<HomeSection
@ -106,7 +107,10 @@ const HomePage: NextPage = ({}) => {
</GridItem>
</Grid>
<Grid templateColumns={{ base: 'repeat(1, 1fr)', md: 'repeat(2, 1fr)' }} gap={4}>
<Grid
templateColumns={{ base: 'repeat(1, 1fr)', md: 'repeat(2, 1fr)' }}
gap={{ base: 4, lg: 8 }}
>
<GridItem>
{/* SECTION: Contribute to Geth */}
<HomeSection
@ -142,7 +146,7 @@ const HomePage: NextPage = ({}) => {
</GridItem>
</Grid>
<Grid templateColumns={{ base: '1fr', md: '300px 1fr' }} gap={4}>
<Grid templateColumns={{ base: '1fr', md: '300px 1fr' }} gap={{ base: 4, lg: 8 }}>
<GridItem w='auto'>
<Box h='100%'>
{/* TODO: replace with animated/video version */}