Merge pull request #5
fix: all suggestions in a row should have the same height
This commit is contained in:
commit
836f0e701a
|
@ -3,6 +3,7 @@ import { Qualification } from 'libs/graphql';
|
|||
import { QUESTIONS } from 'config/app';
|
||||
import { Route } from 'config/routing';
|
||||
|
||||
import { makeStyles } from '@material-ui/core/styles';
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
|
@ -20,6 +21,8 @@ export interface SuggestionsProps {
|
|||
}
|
||||
|
||||
const Suggestions = ({ suggestions }: SuggestionsProps) => {
|
||||
const classes = useStyles();
|
||||
|
||||
return (
|
||||
<Section>
|
||||
<Container>
|
||||
|
@ -30,11 +33,12 @@ const Suggestions = ({ suggestions }: SuggestionsProps) => {
|
|||
{suggestions.map(suggestion => {
|
||||
return (
|
||||
<Grid item xs={12} sm={6} md={4} key={suggestion.id}>
|
||||
<Card>
|
||||
<Card className={classes.card}>
|
||||
<CardHeader
|
||||
title={suggestion.name}
|
||||
subheader={suggestion.code}
|
||||
/>
|
||||
<div className={classes.spacer} />
|
||||
<CardActions>
|
||||
{QUESTIONS.map(limit => {
|
||||
return (
|
||||
|
@ -68,4 +72,15 @@ const Suggestions = ({ suggestions }: SuggestionsProps) => {
|
|||
);
|
||||
};
|
||||
|
||||
const useStyles = makeStyles(() => ({
|
||||
card: {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
height: '100%',
|
||||
},
|
||||
spacer: {
|
||||
flex: 1,
|
||||
},
|
||||
}));
|
||||
|
||||
export default Suggestions;
|
||||
|
|
Reference in New Issue