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
<div class="c-grouped-content-stack">
  <h2>Sesame snaps dragée cotton tootsie roll.</h2>
  <div class="c-grouped-content-stack__description">
    <img width="150" srcset="https://static.raspberrypi.org/wallpaper/balloon.jpg 2x" attrs="alt Issue number 9" src="https://static.raspberrypi.org/wallpaper/balloon.jpg" />
    Sesame snaps dragée cotton candy tootsie roll. Pastry gingerbread jelly-o pastry topping cake toffee.
  </div>
  <div class="c-grouped-content-stack__blocks">
    <div class="c-copy-block">
      <div class="c-copy-block__container">
        <h3>Sesame snaps dragée cotton tootsie roll.</h3>
        Sesame snaps dragée cotton candy tootsie roll. Pastry gingerbread jelly-o pastry topping cake toffee.
      </div>
    </div>
    <div class="c-copy-block">
      <div class="c-copy-block__container">
        <h3>Sesame snaps dragée cotton tootsie roll.</h3>
        Sesame snaps dragée cotton candy tootsie roll. Pastry gingerbread jelly-o pastry topping cake toffee.
      </div>
    </div>
    <div class="c-copy-block">
      <div class="c-copy-block__container">
        <h3>Sesame snaps dragée cotton tootsie roll.</h3>
        Sesame snaps dragée cotton candy tootsie roll. Pastry gingerbread jelly-o pastry topping cake toffee.
      </div>
    </div>
  </div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
c(
  'site/grouped_content_stack',
  copy:,
  heading:,
  image: {
    width: 150,
    src: image,
    srcset: {
      "#{image}": '2x'
    },
    attrs: {
      alt: 'Issue number 9'
    }
  }
) do |component|
  3.times { component.with_copy_block { component.render(copy_block_preview(heading, copy)) } }
end

No notes provided.

Param Description Input

The title

The copy to display in the card

The URL to link to