edb/neuf-www
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

show contact portraits

Browse Source
This commit is contained in:
Jonas Braathen
2024-08-10 14:13:03 +02:00
parent 566bd4964a
commit ebf5007e20
1 changed files with 23 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
web/src/components/blocks/ContactEntityBlock.tsx
View File

@ -2,6 +2,7 @@ import { ContactEntityBlock as ContactEntityBlockType } from "@/gql/graphql";
import styles from "./contactEntityBlock.module.scss";
import { formatNorwegianPhoneNumber, formatPhoneE164 } from "@/lib/common";
import { Icon } from "../general/Icon";
import { Image } from "../general/Image";
export const ContactEntityBlock = ({
block,
@ -22,7 +23,22 @@ export const ContactEntityBlock = ({
return (
<li className={styles.contactItem}>
<div className={styles.image}>
<img src="/assets/graphics/portrait-pig.svg" className={styles.portraitPlaceholder} />
{!contact.image && (
<img
src="/assets/graphics/portrait-pig.svg"
className={styles.portraitPlaceholder}
/>
)}
{contact.image && (
<Image
src={contact.image.url}
alt={contact.image.alt ?? ""}
width={contact.image.width}
height={contact.image.height}
sizes="10vw"
className={styles.portrait}
/>
)}
</div>
<div className={styles.text}>
<h1 className={styles.name}>{contact.name}</h1>
@ -31,7 +47,9 @@ export const ContactEntityBlock = ({
<ul className={styles.contact}>
{contact.email && (
<li>
<span className={styles.icon}><Icon type="email" /></span>
<span className={styles.icon}>
<Icon type="email" />
</span>
<a href={`mailto:${contact.email}`} target="_blank">
{contact.email}
</a>
@ -39,7 +57,9 @@ export const ContactEntityBlock = ({
)}
{phoneE164 && (
<li>
<span className={styles.icon}><Icon type="phone" /></span>
<span className={styles.icon}>
<Icon type="phone" />
</span>
<a href={`tel:${phoneE164}`} target="_blank">
{phoneFormatted}
</a>