Use table layout for Item Getting Guide's NP items section

As part of this, I added a new `search_icon` helper, and a new
`button_link_to` helper, which both styles the link as a button and
accepts an `icon` parameter to make it easier to pass in an icon!
This commit is contained in:
Emi Matchu 2024-05-21 18:03:00 -07:00
parent 18076badcd
commit 4a74e5e1a7
3 changed files with 34 additions and 2 deletions

View file

@ -100,6 +100,9 @@ a.button, input[type=submit], button
+awesome-button
&.loud
+loud-awesome-button
.icon
margin-right: .375em
vertical-align: middle
ul.buttons
margin-bottom: 1em

View file

@ -21,6 +21,14 @@ module ApplicationHelper
end
end
def button_link_to(content, url, icon: nil, **options)
klass = options.fetch(:class, "") + " button"
link_to url, class: klass, **options do
concat icon
concat content
end
end
def advertise_campaign_progress(campaign, &block)
if campaign && campaign.advertised?
campaign_progress(campaign, &block)
@ -77,7 +85,7 @@ module ApplicationHelper
EXTERNAL_LINK_SVG_SOURCE = '<g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><path d="M15 3h6v6"></path><path d="M10 14L21 3"></path></g>'.html_safe
def external_link_icon
content_tag :svg, EXTERNAL_LINK_SVG_SOURCE, alt: "(external link)",
viewBox: "0 0 24 24", style: "width: 1em; height: 1em"
class: "icon", viewBox: "0 0 24 24", style: "width: 1em; height: 1em"
end
def flashes
@ -183,6 +191,13 @@ module ApplicationHelper
stylesheet_link_tag src, options
end
# SVG icon source from Chakra UI!
SEARCH_SVG_SOURCE = '<path fill="currentColor" d="M23.384,21.619,16.855,15.09a9.284,9.284,0,1,0-1.768,1.768l6.529,6.529a1.266,1.266,0,0,0,1.768,0A1.251,1.251,0,0,0,23.384,21.619ZM2.75,9.5a6.75,6.75,0,1,1,6.75,6.75A6.758,6.758,0,0,1,2.75,9.5Z"></path>'.html_safe
def search_icon
content_tag :svg, SEARCH_SVG_SOURCE, alt: "Search", class: "icon",
viewBox: "0 0 24 24", style: "width: 1em; height: 1em"
end
def secondary_nav(&block)
content_for :before_flashes,
content_tag(:nav, :id => 'secondary-nav', &block)

View file

@ -41,7 +41,21 @@
[wiz]: https://www.neopets.com/shops/wizard.phtml
[tp]: https://www.neopets.com/island/tradingpost.phtml?type=browse
[ag]: https://www.neopets.com/genie.phtml
= render @np_items
%table.item-list
%thead
%td
%th{colspan: 2}
Total: #{pluralize @np_items.size, "item"}
%tbody
- @np_items.each do |item|
%tr
%td.thumbnail-cell= item_thumbnail_for(item)
%td= item.name
%td.actions-cell
= button_link_to "Shops", shop_wizard_url_for(item),
target: "_blank", icon: search_icon
= button_link_to "Trades", trading_post_url_for(item),
target: "_blank", icon: search_icon
- if @pb_items.present?
%h2 Paintbrush items