diff --git a/src/components/WindowSideBarCanvasPanel.js b/src/components/WindowSideBarCanvasPanel.js index 8ea64a7bf9e75393b88f1ef97b562cf13685c5f8..f97cb053655e1deab8649869a59d0b57c2e3f103 100644 --- a/src/components/WindowSideBarCanvasPanel.js +++ b/src/components/WindowSideBarCanvasPanel.js @@ -36,10 +36,11 @@ export class WindowSideBarCanvasPanel extends Component { return ( <ListItem key={canvas.id} + alignItems="flex-start" onClick={onClick} button > - <div> + <div style={{ minWidth: 50 }}> <CanvasThumbnail className={classNames(classes.clickable)} isValid={isValid} @@ -47,17 +48,11 @@ export class WindowSideBarCanvasPanel extends Component { maxHeight={config.canvasNavigation.height} maxWidth={config.canvasNavigation.width} aspectRatio={manifestoCanvas.aspectRatio} - style={{ - cursor: 'pointer', - height: config.canvasNavigation.height, - width: isValid ? WindowSideBarCanvasPanel.calculateScaledWidth(config.canvasNavigation.height, validationCanvas.aspectRatio) : 'auto', - }} /> </div> <Typography className={classNames(classes.label)} variant="body2" - color="secondary" > {canvas.label} </Typography> diff --git a/src/containers/WindowSideBarCanvasPanel.js b/src/containers/WindowSideBarCanvasPanel.js index a5ff9e6ade46f6e4423d6bcf28b2581100543ae2..27432454fdceb75435187354de7eb35117fc377d 100644 --- a/src/containers/WindowSideBarCanvasPanel.js +++ b/src/containers/WindowSideBarCanvasPanel.js @@ -27,13 +27,12 @@ const mapDispatchToProps = { setCanvas: actions.setCanvas }; /** * * @param theme - * @returns {label: {fontSize: string, paddingLeft: number}, windowSideBarH2: *}} + * @returns {label: {paddingLeft: number}, windowSideBarH2: *}} */ const styles = theme => ({ windowSideBarH2: theme.typography.h5, label: { - fontSize: '8pt', - paddingLeft: 8, + paddingLeft: theme.spacing.unit, }, });