Page Kit
x
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
72
73
74
75
76
77
78
79
80
81
82
<div class="pk-c-team-slice">
  <div class="pk-c-team-slice__container">
    <div class="ui-subtitle">
      <div class="ui-subtitle__container">
        <h2 class="ui-subtitle__title">Our team</h2>
        <p class="ui-subtitle__text">At the core of our work is a team of passionate, value-led people collaborating across four countries: the UK, Ireland, the USA, and India.</p>
        <div class="ui-subtitle__links">
          <a class="rpf-button" href="https://www.raspberrypi.org/about/">Meet the team</a>
          <a class="rpf-button--secondary rpf-button" href="https://www.raspberrypi.org/careers/">Explore careers</a>
        </div>
      </div>
    </div>
    <div class="pk-c-team-slice__cards-container">
      <div class="pk-c-team-slice__cards">
        <div class="pk-c-image-text-card">
          <div class="pk-c-image-text-card__container">
            <div class="pk-c-image-text-card__image">
              <img alt="Alt Text" height="417" width="278" srcset="https://static.raspberrypi.org/wallpaper/sand.jpg 2x" src="https://static.raspberrypi.org/wallpaper/waterfall.jpg" />
            </div>
            <div class="pk-c-image-text-card__content">
              <div class="pk-c-image-text-card__copy">
                <div class="pk-c-image-text-card__titles">
                  <h3 class="pk-c-image-text-card__subtitle">
                    The subtitle
                  </h3>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="pk-c-image-text-card">
          <div class="pk-c-image-text-card__container">
            <div class="pk-c-image-text-card__image">
              <img alt="Alt Text" height="417" width="278" srcset="https://static.raspberrypi.org/wallpaper/fisherman.jpg 2x" src="https://static.raspberrypi.org/wallpaper/fisherman.jpg" />
            </div>
            <div class="pk-c-image-text-card__content">
              <div class="pk-c-image-text-card__copy">
                <div class="pk-c-image-text-card__titles">
                  <h3 class="pk-c-image-text-card__subtitle">
                    The subtitle
                  </h3>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="pk-c-image-text-card">
          <div class="pk-c-image-text-card__container">
            <div class="pk-c-image-text-card__image">
              <img alt="Alt Text" height="417" width="278" srcset="https://static.raspberrypi.org/wallpaper/road.jpg 2x" src="https://static.raspberrypi.org/wallpaper/clouds.jpg" />
            </div>
            <div class="pk-c-image-text-card__content">
              <div class="pk-c-image-text-card__copy">
                <div class="pk-c-image-text-card__titles">
                  <h3 class="pk-c-image-text-card__subtitle">
                    The subtitle
                  </h3>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="pk-c-image-text-card">
          <div class="pk-c-image-text-card__container">
            <div class="pk-c-image-text-card__image">
              <img alt="Alt Text" height="417" width="278" srcset="https://static.raspberrypi.org/wallpaper/bridge.jpg 2x" src="https://static.raspberrypi.org/wallpaper/lasers.jpg" />
            </div>
            <div class="pk-c-image-text-card__content">
              <div class="pk-c-image-text-card__copy">
                <div class="pk-c-image-text-card__titles">
                  <h3 class="pk-c-image-text-card__subtitle">
                    The subtitle
                  </h3>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
1
2
3
4
5
6
7
8
9
c(
  'site/team_slice',
  title:,
  text:,
  primary_link: { href: primary_href, label: primary_label },
  secondary_link: { href: secondary_href, label: secondary_label }
) do |component|
  4.times { component.with_team_card { component.render(team_card_preview) } }
end

No notes provided.

Param Description Input

The title to display in the hero

The copy to display in the hero

The URL for the primary CTA

The label for the primary CTA

The URL for the secondary CTA

The label for the secondary CTA