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
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<ul class="Polaris-ExceptionList">
  <li class="Polaris-ExceptionList__Item">
    <span class="Polaris-ExceptionList__Icon">
      <span class="Polaris-Icon">
        <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="M6.55 7.25a.7.7 0 0 1 .7-.7h5.5a.7.7 0 0 1 0 1.4h-5.5a.7.7 0 0 1-.7-.7Z"></path><path d="M7 9.05a.7.7 0 0 0 0 1.4h2.25a.7.7 0 1 0 0-1.4h-2.25Z"></path><path fill-rule="evenodd" d="M3.5 6.25a2.75 2.75 0 0 1 2.75-2.75h7.5a2.75 2.75 0 0 1 2.75 2.75v5.5a.75.75 0 0 1-.22.53l-4 4a.75.75 0 0 1-.53.22h-5.5a2.75 2.75 0 0 1-2.75-2.75v-7.5Zm2.75-1.25c-.69 0-1.25.56-1.25 1.25v7.5c0 .69.56 1.25 1.25 1.25h4.75v-2.25c0-.966.784-1.75 1.75-1.75h2.25v-4.75c0-.69-.56-1.25-1.25-1.25h-7.5Zm7.69 7.5h-1.19a.25.25 0 0 0-.25.25v1.19l1.44-1.44Z"></path></svg>
      </span>
    </span>
    <span class="Polaris-ExceptionList__Title">
      Note
    </span>
    <span class="Polaris-ExceptionList__Description">
      This customer is awesome. Make sure to treat them right!
    </span>
  </li>
  <li class="Polaris-ExceptionList__Item Polaris-ExceptionList--statusWarning">
    <span class="Polaris-ExceptionList__Icon">
      <span class="Polaris-Icon">
        <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="M10 6a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5a.75.75 0 0 1 .75-.75Z"></path><path d="M11 13a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path><path fill-rule="evenodd" d="M17 10a7 7 0 1 1-14 0 7 7 0 0 1 14 0Zm-1.5 0a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0Z"></path></svg>
      </span>
    </span>
    <span class="Polaris-ExceptionList__Title">
      Warning
    </span>
    <span class="Polaris-ExceptionList__Description">
      This customer is awesome. Make sure to treat them right!
    </span>
  </li>
  <li class="Polaris-ExceptionList__Item Polaris-ExceptionList--statusCritical">
    <span class="Polaris-ExceptionList__Icon">
      <span class="Polaris-Icon">
        <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="M10 6a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5a.75.75 0 0 1 .75-.75Z"></path><path d="M11 13a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path><path fill-rule="evenodd" d="M11.237 3.177a1.75 1.75 0 0 0-2.474 0l-5.586 5.585a1.75 1.75 0 0 0 0 2.475l5.586 5.586a1.75 1.75 0 0 0 2.474 0l5.586-5.586a1.75 1.75 0 0 0 0-2.475l-5.586-5.585Zm-1.414 1.06a.25.25 0 0 1 .354 0l5.586 5.586a.25.25 0 0 1 0 .354l-5.586 5.585a.25.25 0 0 1-.354 0l-5.586-5.585a.25.25 0 0 1 0-.354l5.586-5.586Z"></path></svg>
      </span>
    </span>
    <span class="Polaris-ExceptionList__Title">
      Critical
    </span>
    <span class="Polaris-ExceptionList__Description">
      This customer is awesome. Make sure to treat them right!
    </span>
  </li>
</ul>
1
2
3
4
5
6
7
8
9
10
11
12
13
<%= polaris_exception_list do |list| %>
  <% list.with_item(icon: "NoteIcon", title: "Note") do %>
    This customer is awesome. Make sure to treat them right!
  <% end %>
  <% list.with_item(icon: "AlertCircleIcon", title: "Warning", status: :warning) do %>
    This customer is awesome. Make sure to treat them right!
  <% end %>
  <% list.with_item(icon: "AlertDiamondIcon", title: "Critical", status: :critical) do %>
    This customer is awesome. Make sure to treat them right!
  <% end %>
<% end %>

No notes provided.

No params configured.