diff --git a/components/boardMemberCard.jsx b/components/boardMemberCard.jsx index e77bc6bdcf00928fa6aad35c65add761ed93ac70..fc6561703fe016cabfe4a65c4bf6c39966aa59fb 100644 --- a/components/boardMemberCard.jsx +++ b/components/boardMemberCard.jsx @@ -1,4 +1,5 @@ import { useRouter } from "next/router"; +import Image from "next/image"; import { Avatar, Button, Paper, Text, useMantineTheme } from "@mantine/core"; @@ -28,7 +29,24 @@ export default function BoardMemberCard({ entry }) { shadow="sm" > <div> - <Avatar src={entry.image} size={120} radius={20} mx="auto" /> + <div + style={{ + width: "120px", + height: "120px", + borderRadius: "1rem", + margin: "auto", + overflow: "hidden", + }} + > + <Image + src={entry.image} + width={0} + height={0} + sizes="100vw" + style={{ width: "30rem", maxWidth: "100%", height: "auto" }} + alt={entry.name} + /> + </div> <Text ta="center" fz="lg" weight={500} mt="md"> {entry.name} </Text> diff --git a/components/eventCard.jsx b/components/eventCard.jsx index 827cd297f6179f4d37a6ba4e3a9aae0aa697b173..f869d22207696a0abcfe9e6b7d234c5d2501fe8b 100644 --- a/components/eventCard.jsx +++ b/components/eventCard.jsx @@ -153,7 +153,7 @@ export default function EventCard({ </div> <div> {!event.isStammtisch && ( - <Group style={{ verticalAlign: "middle", marginTop: "20px" }} grow> + <Group mt="xl" style={{ verticalAlign: "middle" }} grow> {event.signUp ? ( <Button href={event.signUp} @@ -185,28 +185,26 @@ export default function EventCard({ )} </Group> )} - <Group grow mt="md" style={{ verticalAlign: "middle" }}> - {hasAccess(session, true) && ( - <> + {hasAccess(session, true) && ( + <Group grow mt="md" style={{ verticalAlign: "middle" }}> + <Button + leftIcon={<Icon icon={ICONS.EDIT} color={accentColor} />} + variant="light" + onClick={() => editEvent(event)} + > + {t("editEvent")} + </Button> + {!event.isStammtisch && ( <Button - leftIcon={<Icon icon={ICONS.EDIT} color={accentColor} />} + leftIcon={<Icon icon={ICONS.LIST} color={accentColor} />} variant="light" - onClick={() => editEvent(event)} + onClick={() => viewSignUps(event)} > - {t("editEvent")} + {t("viewParticipants")} </Button> - {!event.isStammtisch && ( - <Button - leftIcon={<Icon icon={ICONS.LIST} color={accentColor} />} - variant="light" - onClick={() => viewSignUps(event)} - > - {t("viewParticipants")} - </Button> - )} - </> - )} - </Group> + )} + </Group> + )} </div> </Card> );