rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: improve list item vault info spacing

Browse Source
This commit is contained in:
Aman Harwara
2023-09-05 23:40:11 +05:30
parent 5e661c95da
commit 9430bf4507
3 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/web/src/javascripts/Components/ContentListView/FileListItem.tsx
View File

@@ -104,7 +104,7 @@ const FileListItemCard: FunctionComponent<DisplayableListItemProps<FileItem>> =
<ListItemMetadata item={file} hideDate={hideDate} sortBy={sortBy} /> <ListItemMetadata item={file} hideDate={hideDate} sortBy={sortBy} />
<ListItemTags hideTags={hideTags} tags={tags} /> <ListItemTags hideTags={hideTags} tags={tags} />
<ListItemConflictIndicator item={file} /> <ListItemConflictIndicator item={file} />
<ListItemVaultInfo item={file} /> <ListItemVaultInfo item={file} className="mt-1.5" />
</div> </div>
<ListItemFlagIcons className="p-4" item={file} isFileBackedUp={!!backupInfo} /> <ListItemFlagIcons className="p-4" item={file} isFileBackedUp={!!backupInfo} />
</div> </div>

7
packages/web/src/javascripts/Components/ContentListView/ListItemVaultInfo.tsx
View File

@@ -1,15 +1,16 @@
import { FunctionComponent } from 'react' import { FunctionComponent } from 'react'
import { useApplication } from '../ApplicationProvider' import { useApplication } from '../ApplicationProvider'
import Icon from '../Icon/Icon' import Icon from '../Icon/Icon'
import { DecryptedItemInterface } from '@standardnotes/snjs' import { DecryptedItemInterface, classNames } from '@standardnotes/snjs'
import VaultNameBadge from '../Vaults/VaultNameBadge' import VaultNameBadge from '../Vaults/VaultNameBadge'
import { featureTrunkVaultsEnabled } from '@/FeatureTrunk' import { featureTrunkVaultsEnabled } from '@/FeatureTrunk'
type Props = { type Props = {
item: DecryptedItemInterface item: DecryptedItemInterface
className?: string
} }
const ListItemVaultInfo: FunctionComponent<Props> = ({ item }) => { const ListItemVaultInfo: FunctionComponent<Props> = ({ item, className }) => {
const application = useApplication() const application = useApplication()
if (!featureTrunkVaultsEnabled()) { if (!featureTrunkVaultsEnabled()) {
@@ -28,7 +29,7 @@ const ListItemVaultInfo: FunctionComponent<Props> = ({ item }) => {
const sharedByContact = application.sharedVaults.getItemSharedBy(item) const sharedByContact = application.sharedVaults.getItemSharedBy(item)
return ( return (
<div className="flex flex-wrap items-center gap-2"> <div className={classNames('flex flex-wrap items-center gap-2', className)}>
<VaultNameBadge vault={vault} /> <VaultNameBadge vault={vault} />
{sharedByContact && ( {sharedByContact && (

2
packages/web/src/javascripts/Components/ContentListView/NoteListItem.tsx
View File

@@ -146,7 +146,7 @@ const NoteListItem: FunctionComponent<DisplayableListItemProps<SNNote>> = ({
<ListItemMetadata item={item} hideDate={hideDate} sortBy={sortBy} /> <ListItemMetadata item={item} hideDate={hideDate} sortBy={sortBy} />
<ListItemTags hideTags={hideTags} tags={tags} /> <ListItemTags hideTags={hideTags} tags={tags} />
<ListItemConflictIndicator item={item} /> <ListItemConflictIndicator item={item} />
<ListItemVaultInfo item={item} /> <ListItemVaultInfo item={item} className="mt-1.5" />
</div> </div>
<ListItemFlagIcons className="p-4" item={item} hasFiles={hasFiles} hasBorder={hasOffsetBorder} /> <ListItemFlagIcons className="p-4" item={item} hasFiles={hasFiles} hasBorder={hasOffsetBorder} />
</div> </div>