Benature/omnivore
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Some layout tweaks

Browse Source
This commit is contained in:
Jackson Harper
2024-02-29 15:27:47 +08:00
parent 6831fed786
commit b319a5a5c9
3 changed files with 43 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/web/components/patterns/LibraryCards/LibraryGridCard.tsx
View File

@ -74,9 +74,11 @@ export function LibraryGridCard(props: LinkedItemCardProps): JSX.Element {
overflow: 'hidden',
cursor: 'pointer',
'@media (max-width: 930px)': {
// m: '15px',
width: 'calc(100% - 30px)',
},
'@mdDown': {
width: '100%',
},
}}
alignment="start"
distribution="start"

17
packages/web/components/templates/homeFeed/MultiSelectControls.tsx
View File

@ -85,13 +85,30 @@ export const MultiSelectControls = (props: LibraryHeaderProps): JSX.Element => {
>
<SpanBox
css={{
display: 'flex',
fontSize: '14px',
fontFamily: '$display',
marginRight: 'auto',
'@mdDown': {
display: 'none',
},
}}
>
{props.numItemsSelected} items selected
</SpanBox>
<SpanBox
css={{
display: 'none',
fontSize: '14px',
fontFamily: '$display',
marginRight: 'auto',
'@mdDown': {
display: 'flex',
},
}}
>
{props.numItemsSelected} items
</SpanBox>
<ArchiveButton {...props} />
<AddLabelsButton setShowLabelsModal={setShowLabelsModal} />
<RemoveItemsButton setShowConfirmDelete={setShowConfirmDelete} />

25
packages/web/components/templates/homeFeed/TLDRLayout.tsx
View File

@ -58,11 +58,14 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
{props.isValidating && props.items.length == 0 && <TopBarProgress />}
{props.items.map((item) => {
const source = siteName(
const sourceName = siteName(
item.node.originalArticleUrl,
item.node.url,
item.node.siteName
)
const source =
sourceName == item.node.author ? undefined : item.node.author
return (
<VStack key={`tldr-${item.node.id}`} css={{ gap: '10px' }}>
<HStack
@ -96,6 +99,12 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
display: 'flex',
fontFamily: '$inter',
fontSize: '16px',
maxWidth: '150px',
maxLines: '1',
textOverflow: 'ellipsis',
'@mdDown': {
fontSize: '12px',
},
}}
>
{item.node.siteName}
@ -104,9 +113,14 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
{source && item.node.author && (
<SpanBox
css={{
maxLines: '1',
display: 'flex',
fontFamily: '$inter',
fontSize: '16px',
maxWidth: '150px',
textOverflow: 'ellipsis',
'@mdDown': {
fontSize: '12px',
},
}}
>
•
@ -118,6 +132,12 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
display: 'flex',
fontFamily: '$inter',
fontSize: '16px',
maxWidth: '120px',
maxLines: '1',
textOverflow: 'ellipsis',
'@mdDown': {
fontSize: '12px',
},
}}
>
{item.node.author}
@ -145,6 +165,7 @@ export function TLDRLayout(props: TLDRLayoutProps): JSX.Element {
fontFamily: '$inter',
fontWeight: '700',
fontSize: '20px',
wordBreak: 'break-all',
textDecoration: 'underline',
a: {
color: '$thTLDRText',