website/src/con/components/2022/Partners/index.tsx at 00d2bc71b1d376f919355ddb72b4e545190cf539 · api-platform/website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
import React, { useContext } from 'react';
import { Grid, GridItem } from '@components/common/Grid';
import Section from '@con/components/common/Section';
import { Partner } from 'src/con/types';
import SectionTitle from '@con/components/common/SectionTitle';
import { ConfContext } from '@con/components/layout';

interface PartnersProps {
  data: Partner[];
}

const Partners: React.ComponentType<PartnersProps> = ({ data }) => {
  const { edition } = useContext(ConfContext);
  const sponsors = data.filter((s) => 6 > s.rank);
  const partners = data.filter((s) => 6 <= s.rank);
  return (
    <Section className="conf__partners" section="partners">
      <div className="container">
        <SectionTitle>
          Our <strong>partners</strong>
        </SectionTitle>
        <div className="partners__section partners__bronze">
          <Grid>
            {sponsors.map(({ name, logo, link }) => (
              <GridItem key={name} autosize padding={20} className="partners__item">
                <a href={link} title={`${name}`} key={name} target="_blank" rel="nofollow noreferrer noopener">
                  <img
                    width="200"
                    height="200"
                    loading="lazy"
                    src={`/con/${edition}/partners/${logo}.png`}
                    alt={name}
                  />
                </a>
              </GridItem>
            ))}
          </Grid>
        </div>
        <div className="partners__section partners__partners">
          <Grid>
            {partners.map(({ name, logo, link }) => (
              <GridItem key={name} autosize padding={20} className="partners__item">
                <a href={link} title={`${name}`} key={name} target="_blank" rel="nofollow noreferrer noopener">
                  <img
                    width="200"
                    height="200"
                    loading="lazy"
                    src={`/con/${edition}/partners/${logo}.png`}
                    alt={name}
                  />
                </a>
              </GridItem>
            ))}
          </Grid>
        </div>
        <div className="partners__section">
          <a
            className="conf__button square empty"
            href="mailto:events@les-tilleuls.coop"
            target="_blank"
            rel="noopener noreferrer"
          >
            Become sponsor
          </a>
        </div>
      </div>
    </Section>
  );
};

export default Partners;