Sha256: 7d5f0a2d73044946f3de7c727ee9366d3f8940c85b4094eff3d1b74c01b1add0
Contents?: true
Size: 1.35 KB
Versions: 1180
Compression:
Stored size: 1.35 KB
Contents
<%= pb_rails("button", props: { variant: "secondary", id: 'list' }) do %>
<%= pb_rails("flex", props: {align: "center"}) do %>
Filter By
<%= pb_rails("flex/flex_item", props: {margin_left: "xxs"}) do %>
<div id="arrow-icon" style="display: flex"></div>
<% end %>
<% end %>
<% end %>
<%= pb_rails("popover", props: {trigger_element_id: "list", tooltip_id: "list-tooltip", position: 'bottom', padding: "none"}) do %>
<%= pb_rails("list", props: {ordered: false, dark: false, borderless: false, xpadding: true}) do %>
<%= pb_rails("list/item") do %><a>Popularity</a><% end %>
<%= pb_rails("list/item") do %><a>Title</a><% end %>
<%= pb_rails("list/item") do %><a>Duration</a><% end %>
<%= pb_rails("list/item") do %><a>Date Started</a><% end %>
<%= pb_rails("list/item") do %><a>Date Ended </a><% end %>
<% end %>
<% end %>
<script type="text/javascript">
const button = document.querySelector("#list")
let buttonClicked = false
const arrowDiv = document.querySelector("#arrow-icon")
arrowDiv.innerHTML = '<i class="far fa-angle-down"></i>'
button.onclick = () => {
buttonClicked = !buttonClicked
if (buttonClicked) {
arrowDiv.innerHTML = '<i class="far fa-angle-up"></i>'
} else {
arrowDiv.innerHTML = '<i class="far fa-angle-down"></i>'
}
}
</script>
Version data entries
1,180 entries across 1,180 versions & 2 rubygems