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

Improve smaller screen layouts

Browse source
This commit is contained in:
Jackson Harper 2024-06-25 15:22:30 +08:00
parent 0402d1d60d
commit 1acf0b5765
2 changed files with 6 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/web/components/templates/library/LibraryContainer.tsx
View file

@ -934,7 +934,7 @@ function HomeFeedGrid(props: HomeFeedContentProps): JSX.Element {
py: '20px',
width: '100%',
'@mdDown': {
px: layout == 'GRID_LAYOUT' ? '20px' : '0px',
px: '0px',
},
}}
distribution="start"
@ -1030,6 +1030,9 @@ export function LibraryItemsLayout(
height: '100%',
width: '100%',
paddingX: '40px',
'@mdDown': {
mx: props.layout == 'GRID_LAYOUT' ? '20px' : '0px',
},
}}
>
<Toaster />

25
packages/web/components/templates/library/LibraryHeader.tsx
View file

@ -38,27 +38,6 @@ export type LibraryHeaderProps = {
performMultiSelectAction: (action: BulkAction, labelIds?: string[]) => void
}
export const headerControlWidths = (
layout: LayoutType,
multiSelectMode: MultiSelectMode
) => {
return {
width: '95%',
'@mdDown': {
width: '100%',
},
'@media (min-width: 930px)': {
width: '620px',
},
'@media (min-width: 1280px)': {
width: '940px',
},
'@media (min-width: 1600px)': {
width: '1232px',
},
}
}
export function LibraryHeader(props: LibraryHeaderProps): JSX.Element {
const [small, setSmall] = useState(false)
@ -89,8 +68,8 @@ export function LibraryHeader(props: LibraryHeaderProps): JSX.Element {
right: '0',
},
'@xlgDown': {
px: props.showFilterMenu ? '0px' : '40px',
pr: '0px',
px: props.showFilterMenu ? '0px' : '60px',
pr: '10px',
},
}}
>