LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

make file details smaller

Browse source
This commit is contained in:
Sean Yesmunt 2020-10-29 23:47:18 -04:00
parent 57a69be7e8
commit b33f14cca4
3 changed files with 68 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
static/app-strings.json
View file

@ -1480,5 +1480,6 @@
"Español": "Español",
"Türkçe": "Türkçe",
"Česky": "Česky",
"LBRY LATAM": "LBRY LATAM",
"--end--": "--end--"
}

104
ui/component/fileDetails/view.jsx
View file

@ -1,4 +1,5 @@
// @flow
import { SIMPLE_SITE } from 'config';
import React, { PureComponent } from 'react';
import Button from 'component/button';
import path from 'path';
@ -38,58 +39,63 @@ class FileDetails extends PureComponent<Props> {
}
return (
<table className="table table--condensed table--fixed table--file-details">
<tbody>
<tr>
<td> {__('Content Type')}</td>
<td>{mediaType}</td>
</tr>
{fileSize && (
<tr>
<td> {__('File Size')}</td>
<td>{fileSize}</td>
</tr>
)}
<>
<div className="media__details">
<span>{__('LBRY URL')}</span>
<span>{claim.canonical_url}</span>
</div>
<div className="media__details">
<span>{__('Claim ID')}</span>
<span>{claim.claim_id}</span>
</div>
<tr>
<td> {__('URL')}</td>
<td>{claim.canonical_url}</td>
</tr>
{!SIMPLE_SITE && (
<>
{languages && (
<div className="media__details">
<span>{__('Languages')}</span>
<span>{languages.join(' ')}</span>
</div>
)}
<tr>
<td> {__('Claim ID')}</td>
<td>{claim.claim_id}</td>
</tr>
{languages && (
<div className="media__details">
<span>{__('Media Type')}</span>
<span>{mediaType}</span>
</div>
)}
{languages && (
<tr>
<td>{__('Languages')}</td>
<td>{languages.join(' ')}</td>
</tr>
)}
<tr>
<td>{__('License')}</td>
<td>{license}</td>
</tr>
{downloadPath && (
<tr>
<td>{__('Downloaded to')}</td>
<td>
<Button
button="link"
className="button--download-link"
onClick={() => {
if (downloadPath) {
openFolder(downloadPath);
}
}}
label={downloadNote || downloadPath.replace(/(.{10})/g, '$1\u200b')}
/>
</td>
</tr>
)}
</tbody>
</table>
<div className="media__details">
<span>{__('License')}</span>
<span>{license}</span>
</div>
{downloadPath && (
<div className="media__details">
<span>{__('Downloaded to')}</span>
<span>
<Button
button="link"
className="button--download-link"
onClick={() => {
if (downloadPath) {
openFolder(downloadPath);
}
}}
label={downloadNote || downloadPath.replace(/(.{10})/g, '$1\u200b')}
/>
</span>
</div>
)}
</>
)}
{fileSize && (
<div className="media__details">
<span>{fileSize}</span>
</div>
)}
</>
);
}
}

12
ui/scss/component/_media.scss
View file

@ -153,3 +153,15 @@
}
}
}
.media__details {
@extend .help;
font-size: var(--font-xxsmall);
display: flex;
flex-direction: column;
// margin-top: 0;
&:first-of-type {
// margin-top: var(--spacing-m);
}
}