upload-data-button
authorPawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Wed, 19 Sep 2018 10:38:29 +0000 (12:38 +0200)
committerPawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>
Wed, 19 Sep 2018 10:38:29 +0000 (12:38 +0200)
Feature #14041

Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>

src/components/collection-panel-files/collection-panel-files.tsx

index d08d36d6bb80c07ce1a3074449c883c619f94299..c3cb4acc486d55bd297f41d020721bb15e475b1c 100644 (file)
@@ -19,7 +19,7 @@ export interface CollectionPanelFilesProps {
     onCollapseToggle: (id: string, status: TreeItemStatus) => void;
 }
 
-type CssRules = 'root' | 'cardSubheader' | 'nameHeader' | 'fileSizeHeader' | 'uploadIcon';
+type CssRules = 'root' | 'cardSubheader' | 'nameHeader' | 'fileSizeHeader' | 'uploadIcon' | 'button';
 
 const styles: StyleRulesCallback<CssRules> = theme => ({
     root: {
@@ -37,6 +37,10 @@ const styles: StyleRulesCallback<CssRules> = theme => ({
     },
     uploadIcon: {
         transform: 'rotate(180deg)'
+    },
+    button: {
+        marginRight: -theme.spacing.unit,
+        marginTop: '0px'
     }
 });
 
@@ -46,12 +50,13 @@ export const CollectionPanelFiles =
             <Card className={classes.root}>
                 <CardHeader
                     title="Files"
+                    classes={{ action: classes.button }}
                     action={
                         <Button onClick={onUploadDataClick}
                             variant='raised'
                             color='primary'
                             size='small'>
-                            <DownloadIcon className={classes.uploadIcon}/>
+                            <DownloadIcon className={classes.uploadIcon} />
                             Upload data
                     </Button>
                     } />