zitadel

1
import React from 'react';
2

3
import styles from '../css/card.module.css';
4

5
export function Card({ link, githubLink, imageSource, title, description, label}) {
6
  if (githubLink) {
7
    return (
8
      <a className={styles.card} href={githubLink} target="_blank">
9
        <h3 className={styles.card.title}>{title}</h3>
10
        {description && <p className={styles.card.description}>{description}</p>}
11
        <span className={styles.fillspace}></span>
12
        <div className={styles.bottom}>
13
          <img className={styles.bottomicon} src="/docs/img/tech/github.svg" alt="github"/>
14
          <span className={styles.bottomspan}>{label}</span>
15
        </div>
16
      </a>
17
    )
18
  } else if (link){
19
    return (
20
      <a className={styles.card} href={link}>
21
        {imageSource && <img src={imageSource} className={styles.cardimg} alt={`image ${title}`}/>}
22
        <h3 className={styles.card.title}>{title}</h3>
23
        <p className={styles.card.description}>{description}</p>
24
      </a>
25
    )
26
  };
27
}
28

29
export function CardWrapper({children}) {
30
  return (
31
    <div className={styles.cardWrapper}>
32
      {children}
33
    </div>
34
  )
35
}