From 4a74e5e1a7f98e7b1b6e0cd598e5b3f3e4a0109e Mon Sep 17 00:00:00 2001 From: Emi Matchu Date: Tue, 21 May 2024 18:03:00 -0700 Subject: [PATCH] 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! --- app/assets/stylesheets/_layout.sass | 3 +++ app/helpers/application_helper.rb | 17 ++++++++++++++++- app/views/items/sources.html.haml | 16 +++++++++++++++- 3 files changed, 34 insertions(+), 2 deletions(-) diff --git a/app/assets/stylesheets/_layout.sass b/app/assets/stylesheets/_layout.sass index 982be028..173d1916 100644 --- a/app/assets/stylesheets/_layout.sass +++ b/app/assets/stylesheets/_layout.sass @@ -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 diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index 0db3a801..4fa2b261 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -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 = ''.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 = ''.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) diff --git a/app/views/items/sources.html.haml b/app/views/items/sources.html.haml index df15f62f..c82826b1 100644 --- a/app/views/items/sources.html.haml +++ b/app/views/items/sources.html.haml @@ -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