<%= t("decidim.design.helpers.demo") %>

<%= t(".dialog_demo_description_html") %>

<%= decidim_modal id: "example" do %> I am a modal <% end %>

<%= t("decidim.design.helpers.usage") %>

<%= t(".usage_description") %>

<%= t(".usage_description_html") %>

<%= t(".usage_description_2_html") %>

<%= t("decidim.design.home.index.github_source") %>: <%= link_to("decidim-core/app/packs/src/decidim/a11y.js", "https://github.com/decidim/decidim/blob/develop/decidim-core/app/packs/src/decidim/a11y.js", target: "_blank", rel: "noopener noreferrer") %>


      <button data-dialog-open="example" class="button button__lg button__secondary">
  Show modal
</button>

<%= decidim_modal id: "example" do %>
  I am a modal
<% end %>

<%= t("decidim.design.helpers.html_tips") %>

<%= t(".tips_description") %>

<%= t(".tips_description_html") %>


      <%= decidim_modal id: "example" do %>
  <div data-dialog-container>
    <%= icon "icon_identifier" %> // ... pick a desired icon
    <h3 id="dialog-title-example" tabindex="-1" data-dialog-title>
      Modal title
    </h3>
    <div>
      <p id="dialog-desc-example">
         Modal description (optional)
      </p>

      // ... add more HTML
    </div>
  </div>
  <div data-dialog-actions>
    <button data-dialog-close="example">
       Close modal
    </button>
    // ... add more buttons
  </div>
<% end %>