open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Clean up some markup around the top of the page (#189)

Browse Source 
* Remove unnecessary wrapper div around sidebar

* Remove extra column used for alignment on homepage

* Remove extra wrapper div around whole page
This commit is contained in:
Marshall Polaris 2022-05-13 16:47:50 -07:00 committed by GitHub
parent babca140f1
commit 33c0471c29
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 21 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/components/nav/nav-bar.tsx
View File

@ -137,7 +137,7 @@ export function MobileSidebar(props: {
</div> </div>
</Transition.Child> </Transition.Child>
<div className="mx-2 mt-5 h-0 flex-1 overflow-y-auto"> <div className="mx-2 mt-5 h-0 flex-1 overflow-y-auto">
<Sidebar /> <Sidebar className="pl-2" />
</div> </div>
</div> </div>
</Transition.Child> </Transition.Child>

5
web/components/nav/sidebar.tsx
View File

@ -110,7 +110,8 @@ function MoreButton() {
) )
} }
export default function Sidebar() { export default function Sidebar(props: { className?: string }) {
const { className } = props
const router = useRouter() const router = useRouter()
const currentPage = router.pathname const currentPage = router.pathname
@ -124,7 +125,7 @@ export default function Sidebar() {
user === null ? signedOutMobileNavigation : mobileNavigation user === null ? signedOutMobileNavigation : mobileNavigation
return ( return (
<nav aria-label="Sidebar" className="sticky top-4 divide-gray-300 pl-2"> <nav aria-label="Sidebar" className={className}>
<div className="space-y-1 pb-6"> <div className="space-y-1 pb-6">
<ManifoldLogo twoLine /> <ManifoldLogo twoLine />
</div> </div>

8
web/components/page.tsx
View File

@ -12,7 +12,7 @@ export function Page(props: {
const { margin, assertUser, children, rightSidebar, suspend } = props const { margin, assertUser, children, rightSidebar, suspend } = props
return ( return (
<div> <>
<div <div
className={clsx( className={clsx(
'mx-auto w-full pb-14 lg:grid lg:grid-cols-12 lg:gap-8 lg:pt-6 xl:max-w-7xl', 'mx-auto w-full pb-14 lg:grid lg:grid-cols-12 lg:gap-8 lg:pt-6 xl:max-w-7xl',
@ -20,9 +20,7 @@ export function Page(props: {
)} )}
style={suspend ? visuallyHiddenStyle : undefined} style={suspend ? visuallyHiddenStyle : undefined}
> >
<div className="hidden lg:col-span-2 lg:block"> <Sidebar className="sticky top-4 hidden divide-gray-300 self-start pl-2 lg:col-span-2 lg:block" />
<Sidebar />
</div>
<main <main
className={clsx( className={clsx(
'lg:col-span-8', 'lg:col-span-8',
@ -40,7 +38,7 @@ export function Page(props: {
</div> </div>
<BottomNavBar /> <BottomNavBar />
</div> </>
) )
} }

35
web/pages/home.tsx
View File

@ -40,27 +40,20 @@ const Home = () => {
return ( return (
<> <>
<Page assertUser="signed-in" suspend={!!contract}> <Page assertUser="signed-in" suspend={!!contract}>
<Col className="items-center"> <Col className="mx-auto w-full max-w-[700px]">
<Col className="w-full max-w-[700px]"> <FeedCreate user={user ?? undefined} />
<FeedCreate user={user ?? undefined} /> <Spacer h={2} />
<Spacer h={2} /> <CategorySelector user={user} />
<Spacer h={1} />
<CategorySelector user={user} /> {feed ? (
<ActivityFeed
<Spacer h={1} /> feed={feed}
mode="only-recent"
{feed ? ( getContractPath={(c) => `home?u=${c.creatorUsername}&s=${c.slug}`}
<ActivityFeed />
feed={feed} ) : (
mode="only-recent" <LoadingIndicator className="mt-4" />
getContractPath={(c) => )}
`home?u=${c.creatorUsername}&s=${c.slug}`
}
/>
) : (
<LoadingIndicator className="mt-4" />
)}
</Col>
</Col> </Col>
</Page> </Page>