diff --git a/client/src/components/molecules/Asset.module.scss b/client/src/components/molecules/Asset.module.scss index 5b9a2f1..c172c22 100644 --- a/client/src/components/molecules/Asset.module.scss +++ b/client/src/components/molecules/Asset.module.scss @@ -37,6 +37,7 @@ padding-bottom: $spacer / 2; display: flex; justify-content: space-between; + align-items: center; &:hover, &:focus { diff --git a/client/src/routes/Publish/Files/Item.module.scss b/client/src/routes/Publish/Files/Item.module.scss index a88e706..45771f8 100644 --- a/client/src/routes/Publish/Files/Item.module.scss +++ b/client/src/routes/Publish/Files/Item.module.scss @@ -1,9 +1,9 @@ @import '../../../styles/variables'; .linkUrl { - font-size: $font-size-mini; + font-size: $font-size-small; display: block; - font-family: $font-family-base; + margin-bottom: $spacer / 8; // TODO: truncate long urls with ellipsis } @@ -23,7 +23,7 @@ display: inline-block; vertical-align: middle; position: absolute; - top: $spacer / 4; + top: $spacer / 8; right: 0; transition: .2s ease-out; @@ -35,10 +35,9 @@ .details { font-size: $font-size-mini; - font-size: .85rem; - color: #6e7e93; + color: $brand-grey-light; span { - padding-right: .5rem; + padding-right: $spacer; } } diff --git a/client/src/routes/Publish/Files/Item.tsx b/client/src/routes/Publish/Files/Item.tsx index 2fb57da..548e8f6 100644 --- a/client/src/routes/Publish/Files/Item.tsx +++ b/client/src/routes/Publish/Files/Item.tsx @@ -4,14 +4,19 @@ import filesize from 'filesize' const Item = ({ item, removeItem }: { item: any; removeItem: any }) => (
  • - {item.url} + + {item.url} +
    - url: {item.found ? 'confirmed' : 'unconfirmed'} + URL {item.found ? 'confirmed' : ' not confirmed'} - size: - {item.found && item.size ? filesize(item.size) : 'unknown'} + {item.found && item.size ? filesize(item.size) : 'unknown size'} + + + {item.found && item.type + ? item.type.split('/')[1] + : 'unknown type'} - type: {item.found && item.type ? item.type : 'unknown'}