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
<div style="--pc-vertical-stack-align: ;--pc-vertical-stack-order: column" class="Polaris-VerticalStack">
  <div style="--pc-horizontal-stack-align: ;--pc-horizontal-stack-wrap: wrap" class="Polaris-HorizontalStack">
    <div style="background: #E0F8EE; width: 436px; height: 20px;">
      <div style="--pc-horizontal-stack-align: ;--pc-horizontal-stack-block-align: center;--pc-horizontal-stack-wrap: nowrap;--pc-horizontal-stack-gap-xs: var(--p-space-4)" class="Polaris-HorizontalStack">
        <div style="background-color: var(--p-color-text-info);color: #fff;width: 106px;height: 36px;display: flex;align-items: center;justify-content: center;border-inline-start: none"></div>
        <div style="background-color: var(--p-color-text-info);color: #fff;width: 106px;height: 20px;display: flex;align-items: center;justify-content: center;border-inline-start: none"></div>
        <div style="background-color: var(--p-color-text-info);color: #fff;width: 106px;height: 20px;display: flex;align-items: center;justify-content: center;border-inline-start: none"></div>
        <div style="background-color: var(--p-color-text-info);color: #fff;width: 106px;height: 20px;display: flex;align-items: center;justify-content: center;border-inline-start: none"></div>
      </div>
    </div>
  </div>
  <div style="background: #E0F8EE; width: 227.98px; height: 40px;">
    <div style="--pc-horizontal-stack-align: ;--pc-horizontal-stack-block-align: end;--pc-horizontal-stack-wrap: nowrap;--pc-horizontal-stack-gap-xs: var(--p-space-4)" class="Polaris-HorizontalStack">
      <div style="background-color: var(--p-color-text-info);color: #fff;width: 106px;height: 20px;display: flex;align-items: center;justify-content: center;border-inline-start: none"></div>
      <div style="background-color: var(--p-color-text-info);color: #fff;width: 106px;height: 20px;display: flex;align-items: center;justify-content: center;border-inline-start: none"></div>
    </div>
  </div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<%= polaris_vertical_stack do %>
  <%= polaris_horizontal_stack do %>
    <div style="background: #E0F8EE; width: 436px; height: 20px;">
      <%= polaris_horizontal_stack(gap: "4", wrap: false, block_align: :center) do %>
        <%= polaris_placeholder(width: "106px", height: "36px") %>
        <%= polaris_placeholder(width: "106px", height: "20px") %>
        <%= polaris_placeholder(width: "106px", height: "20px") %>
        <%= polaris_placeholder(width: "106px", height: "20px") %>
      <% end %>
    </div>
  <% end %>
  <div style="background: #E0F8EE; width: 227.98px; height: 40px;">
    <%= polaris_horizontal_stack(gap: "4", wrap: false, block_align: :end) do %>
      <%= polaris_placeholder(width: "106px", height: "20px") %>
      <%= polaris_placeholder(width: "106px", height: "20px") %>
    <% end %>
  </div>
<% end %>

No notes provided.

No params configured.