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 layout of library page headers

Browse source
This commit is contained in:
Jackson Harper 2022-08-15 10:37:26 +08:00
parent e4ee66e6ab
commit e2a04c0ea6
3 changed files with 5 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/web/components/templates/library/LibraryAvatar.tsx
View file

@ -10,7 +10,7 @@ type AvatarProps = {
export function LibraryAvatar(props: AvatarProps): JSX.Element {
return (
<VStack alignment="center" distribution="start" css={{ pl: '8px', pt: '20px', width: '100%', height: '100%' }}>
<VStack alignment="center" distribution="start" css={{ pl: '8px', width: '100%', height: '100%' }}>
<VStack css={{ height: '100%' }}>
<StyledAvatar
css={{

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

@ -17,7 +17,9 @@ export function LibraryContainer(): JSX.Element {
<>
<VStack alignment="start" distribution="start" css={{ width: '100vw', height: '100vh', overflow: 'hidden', bg: '$libraryBackground' }}>
<HStack alignment="start" distribution="start" css={{ width: '100%' }}>
<LibrarySearchBar />
<SpanBox css={{ width: '100%', height: '90px' }}>
<LibrarySearchBar />
</SpanBox>
<SpanBox css={{ marginLeft: 'auto', width: '130px', height: '100%' }}>
<LibraryAvatar viewer={viewerData?.me} />
</SpanBox>

2
packages/web/components/templates/library/LibrarySearchBar.tsx
View file

@ -19,7 +19,7 @@ export function LibrarySearchBar(): JSX.Element {
return (
<>
<VStack alignment="start" distribution="start" css={{ pl: '32px', pt: '20px', width: '100%', height: '110px' }}>
<VStack alignment="start" distribution="start" css={{ pl: '32px', width: '100%', height: '100%' }}>
<HStack alignment="start" distribution="start" css={{ width: '100%' }}>
<form
style={{ width: '100%' }}