Set buttons and links to use MUI secondary color

src/components/ManifestForm.js

@@ -75,7 +75,7 @@ export class ManifestForm extends Component {
                 {t('cancel')}
               </Button>
             )}
-            <Button id="fetchBtn" type="submit" variant="contained" color="primary">
+            <Button id="fetchBtn" type="submit" variant="contained" color="secondary">
               {t('fetchManifest')}
             </Button>
           </Grid>

src/components/ManifestListItem.js

@@ -107,7 +107,7 @@ export class ManifestListItem extends React.Component {
                     }
                   </Grid>
                   <Grid item xs={8} sm={9}>
-                    <Typography component="span" variant="subtitle1" color="primary">
+                    <Typography component="span" variant="subtitle1" color="secondary">
                       {title || manifestId}
                     </Typography>
                   </Grid>

src/components/WindowSideBarButtons.js

@@ -37,7 +37,7 @@ export class WindowSideBarButtons extends Component {
           onClick={() => (toggleWindowSideBarPanel('info'))}
         >
           <InfoIcon
-            color={this.sideBarPanelCurrentlySelected('info') ? 'primary' : 'inherit'}
+            color={this.sideBarPanelCurrentlySelected('info') ? 'secondary' : 'inherit'}
           />
         </IconButton>
         <IconButton
@@ -49,7 +49,7 @@ export class WindowSideBarButtons extends Component {
           onClick={() => (toggleWindowSideBarPanel('canvas_navigation'))}
         >
           <CanvasIndexIcon
-            color={this.sideBarPanelCurrentlySelected('canvas_navigation') ? 'primary' : 'inherit'}
+            color={this.sideBarPanelCurrentlySelected('canvas_navigation') ? 'secondary' : 'inherit'}
           />
         </IconButton>
       </>

src/components/WindowThumbnailSettings.js

@@ -42,19 +42,19 @@ export class WindowThumbnailSettings extends Component {
         <RadioGroup aria-label={t('position')} name="position" value={thumbnailNavigationPosition} onChange={this.handleChange} row>
           <FormControlLabel
             value="off"
-            control={<Radio color="primary" icon={<ThumbnailsOffIcon />} checkedIcon={<ThumbnailsOffIcon />} />}
+            control={<Radio color="secondary" icon={<ThumbnailsOffIcon />} checkedIcon={<ThumbnailsOffIcon />} />}
             label={t('off')}
             labelPlacement="bottom"
           />
           <FormControlLabel
             value="bottom"
-            control={<Radio color="primary" icon={<ThumbnailNavigationBottomIcon />} checkedIcon={<ThumbnailNavigationBottomIcon />} />}
+            control={<Radio color="secondary" icon={<ThumbnailNavigationBottomIcon />} checkedIcon={<ThumbnailNavigationBottomIcon />} />}
             label={t('bottom')}
             labelPlacement="bottom"
           />
           <FormControlLabel
             value="right"
-            control={<Radio color="primary" icon={<ThumbnailNavigationRightIcon />} checkedIcon={<ThumbnailNavigationRightIcon />} />}
+            control={<Radio color="secondary" icon={<ThumbnailNavigationRightIcon />} checkedIcon={<ThumbnailNavigationRightIcon />} />}
             label={t('right')}
             labelPlacement="bottom"
           />

src/components/WindowViewSettings.js

@@ -42,13 +42,13 @@ export class WindowViewSettings extends Component {
         <RadioGroup aria-label={t('position')} name="position" value={windowViewType} onChange={this.handleChange} row>
           <FormControlLabel
             value="single"
-            control={<Radio color="primary" icon={<SingleIcon />} checkedIcon={<SingleIcon />} />}
+            control={<Radio color="secondary" icon={<SingleIcon />} checkedIcon={<SingleIcon />} />}
             label={t('single')}
             labelPlacement="bottom"
           />
           <FormControlLabel
             value="book"
-            control={<Radio color="primary" icon={<BookViewIcon />} checkedIcon={<BookViewIcon />} />}
+            control={<Radio color="secondary" icon={<BookViewIcon />} checkedIcon={<BookViewIcon />} />}
             label={t('book')}
             labelPlacement="bottom"
           />

src/components/WorkspaceAdd.js

@@ -56,7 +56,7 @@ export class WorkspaceAdd extends React.Component {
       <div className={ns('workspace-add')}>
         {manifestList}
 
-        <Fab variant="extended" disabled={addResourcesOpen} className={classes.fab} color="primary" onClick={() => (this.setAddResourcesVisibility(true))}>
+        <Fab variant="extended" disabled={addResourcesOpen} className={classes.fab} color="secondary" onClick={() => (this.setAddResourcesVisibility(true))}>
           <AddIcon />
           {t('addResource')}
         </Fab>
@@ -75,9 +75,9 @@ export class WorkspaceAdd extends React.Component {
           <Paper
             className={classes.form}
           >
-            <AppBar position="absolute" color="primary" onClick={() => (this.setAddResourcesVisibility(false))}>
+            <AppBar position="absolute" color="secondary" onClick={() => (this.setAddResourcesVisibility(false))}>
               <Toolbar>
-                <IconButton className={classes.menuButton} color="inherit" aria-label={t('closeMenu')}>
+                <IconButton className={classes.menuButton} color="secondary" aria-label={t('closeMenu')}>
                   <ExpandMoreIcon />
                 </IconButton>
                 <Typography variant="h2" noWrap color="inherit" className={classes.typographyBody}>

src/components/WorkspaceAddButton.js

@@ -19,7 +19,7 @@ export class WorkspaceAddButton extends Component {
     return (
       <ListItem>
         <Fab
-          color="primary"
+          color="secondary"
           id="addBtn"
           aria-label={isWorkspaceAddVisible ? t('closeWindow') : t('add')}
           className={classes.fab}