prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Allow old home widths to work

Browse source
This commit is contained in:
Jackson Harper 2024-06-12 19:11:34 +08:00
parent cdf921c4b4
commit fec6e241b9
4 changed files with 56 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/web/components/patterns/LibraryCards/CardTypes.tsx
View file

@ -31,4 +31,6 @@ export type LinkedItemCardProps = {
isHovered?: boolean
isLoading?: boolean
legacyLayout?: boolean
}

34
packages/web/components/patterns/LibraryCards/LibraryListCard.tsx
View file

@ -54,6 +54,26 @@ export function LibraryListCard(props: LinkedItemCardProps): JSX.Element {
const { getReferenceProps, getFloatingProps } = useInteractions([hover])
const layoutWidths = props.legacyLayout
? {
width: '100vw',
'@media (min-width: 768px)': {
width: `calc(100vw - ${LIBRARY_LEFT_MENU_WIDTH})`,
},
'@media (min-width: 930px)': {
width: '580px',
},
'@media (min-width: 1280px)': {
width: '890px',
},
'@media (min-width: 1600px)': {
width: '1200px',
},
}
: {
width: '100%',
}
return (
<VStack
ref={refs.setReference}
@ -68,22 +88,10 @@ export function LibraryListCard(props: LinkedItemCardProps): JSX.Element {
borderStyle: 'none',
borderBottom: 'none',
borderRadius: '6px',
width: '100%',
// '@media (min-width: 768px)': {
// width: `calc(100vw - ${LIBRARY_LEFT_MENU_WIDTH})`,
// },
// '@media (min-width: 930px)': {
// width: '580px',
// },
// '@media (min-width: 1280px)': {
// width: '890px',
// },
// '@media (min-width: 1600px)': {
// width: '1200px',
// },
'@media (max-width: 930px)': {
borderRadius: '0px',
},
...layoutWidths,
}}
alignment="start"
distribution="start"

1
packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
View file

@ -1331,6 +1331,7 @@ function LibraryItems(props: LibraryItemsProps): JSX.Element {
>
{props.viewer && (
<LinkedItemCard
legacyLayout={true}
layout={props.layout}
item={linkedItem.node}
isLoading={linkedItem.isLoading}

32
packages/web/pages/home.tsx Normal file
View file

@ -0,0 +1,32 @@
import { PrimaryLayout } from '../components/templates/PrimaryLayout'
import { HomeFeedContainer } from '../components/templates/homeFeed/HomeFeedContainer'
import { VStack } from './../components/elements/LayoutPrimitives'
export default function Home(): JSX.Element {
return <LoadedContent />
}
function LoadedContent(): JSX.Element {
return (
<PrimaryLayout
pageMetaDataProps={{
title: 'Home - Omnivore',
path: '/home',
}}
pageTestId="home-page-tag"
>
<VStack
alignment="start"
distribution="center"
css={{
px: '70px',
backgroundColor: '$thLibraryBackground',
'@lgDown': { px: '20px' },
'@mdDown': { px: '10px' },
}}
>
<HomeFeedContainer />
</VStack>
</PrimaryLayout>
)
}