Polaris ViewComponents

Previews

No matching results.

x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div style="--pc-horizontal-grid-grid-template-columns-xs: minmax(0, 1fr) minmax(0, 2fr)" class="Polaris-HorizontalGrid">
  <div style="background-color: var(--p-color-text-info);color: #fff;width: auto;height: 320px;display: flex;align-items: center;justify-content: center;border-inline-start: none">
    <div style="--pc-inline-align: center; --pc-inline-block-align: center; --pc-inline-wrap: wrap; --pc-inline-gap-xs: var(--p-space-4)" class="Polaris-Inline">
      <div style="color: #fff;">
        <h2 class="Polaris-Text--root Polaris-Text--bodyMd Polaris-Text--regular">
          oneThird
        </h2>
      </div>
    </div>
  </div>
  <div style="background-color: var(--p-color-text-info);color: #fff;width: auto;height: 320px;display: flex;align-items: center;justify-content: center;border-inline-start: 1px dashed var(--p-color-bg-success-subdued)">
    <div style="--pc-inline-align: center; --pc-inline-block-align: center; --pc-inline-wrap: wrap; --pc-inline-gap-xs: var(--p-space-4)" class="Polaris-Inline">
      <div style="color: #fff;">
        <h2 class="Polaris-Text--root Polaris-Text--bodyMd Polaris-Text--regular">
          twoThirds
        </h2>
      </div>
    </div>
  </div>
</div>
1
2
3
4
<%= polaris_horizontal_grid(columns: %i[oneThird twoThirds]) do %>
  <%= polaris_placeholder(height: "320px", label: "oneThird") %>
  <%= polaris_placeholder(height: "320px", label: "twoThirds", show_border: true) %>
<% end %>

No notes provided.

No params configured.