Write more and better descriptions for Item Getting Guide

Not sure if these are final, but they certainly help communicate what
the heck we're doing here!

app/assets/stylesheets/auth_users/edit.sass

@@ -1,7 +1,6 @@
 @import "../partials/clean/constants"
 
-body.auth_users-edit, body.auth_users-update
+.settings-form
-	.settings-form
 	border: 1px solid $module-border-color
 	background: $module-bg-color
 	border-radius: 1em
@@ -49,8 +48,8 @@ body.auth_users-edit, body.auth_users-update
 		ul
 			padding-left: 2em
 
-	.neopass-info
+.neopass-info
 	margin-bottom: .5em
 
-	.neopass-explanation
+.neopass-explanation
 	font-size: .85em

app/assets/stylesheets/campaigns.css.scss

@@ -1,3 +0,0 @@
-// Place all the styles related to the campaigns controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/

app/assets/stylesheets/devise/sessions/new.sass

@@ -1,11 +1,10 @@
 @import "../../partials/clean/constants"
 
-body.devise-sessions, body.devise-sessions-new
+#title
-	#title
 	text-align: center
 	font-size: 2.5rem
 
-	.login-options
+.login-options
 	display: flex
 	margin-block: 3em
 
@@ -37,7 +36,7 @@ body.devise-sessions, body.devise-sessions-new
 				cursor: pointer
 				margin-bottom: 1em
 
-	.login-form
+.login-form
 	margin-bottom: 1em
 
 	.field
@@ -61,12 +60,12 @@ body.devise-sessions, body.devise-sessions-new
 				height: 1em
 				width: 1em
 
-	.login-links
+.login-links
 	font-size: 85%
 	display: flex
 	gap: .5em
 
-	.log-in-with-neopass-button
+.log-in-with-neopass-button
 	background: linear-gradient(#ebb233, #f6e250, #ebb233)
 	color: #111
 	font-size: 1rem

app/assets/stylesheets/fundraising/campaigns/show.css.sass

@@ -9,28 +9,28 @@ $outfit-banner-h-padding: 4px
 $outfit-banner-v-padding: 2px
 $outfit-banner-inner-width: $outfit-inner-width - (2 * $outfit-banner-h-padding)
 
-body.fundraising-campaigns
+body
   +campaign-progress
   color: $campaign-text-color
 
-  a
+a
   color: $campaign-text-color + #222 !important
 
-  #home-link:hover
+#home-link:hover
   background-color: $campaign-background-color
 
-  #userbar, #footer
+#userbar, #footer
   color: $text-color
   a
     color: $link-color
 
-  #home-link
+#home-link
   color: $link-color
 
-  #title
+#title
   display: none
 
-  #donation-form
+#donation-form
   +module
   background: $campaign-background-color
   border-color: $campaign-border-color
@@ -149,13 +149,13 @@ body.fundraising-campaigns
       +awesome-button-color(#004)
       font-size: 120%
 
-  #campaign-text[data-campaign-complete]
+#campaign-text[data-campaign-complete]
   #description
     display: none
     &[data-show]
       display: block
 
-  #success-thanks
+#success-thanks
   border: 1px dashed $module-border-color
   margin-bottom: 1em
   padding: 1em
@@ -164,13 +164,13 @@ body.fundraising-campaigns
   p:last-child
     margin-bottom: 0
 
-  #success-thanks-toggle-description
+#success-thanks-toggle-description
   position: absolute
   bottom: 1em
   font-style: italic
   right: 1em
 
-  #outfits
+#outfits
   +outfits-list
   text-align: center
 
@@ -208,20 +208,20 @@ body.fundraising-campaigns
         line-height: 1.5
         vertical-align: middle
 
-  #last-years-donors
+#last-years-donors
   font-weight: bold
   margin-top: 1em
   text-align: center
 
-  #outfits-header > *
+#outfits-header > *
   display: inline-block
 
-  #all-campaigns-list
+#all-campaigns-list
   li
     display: inline-block
     list-style: none
     margin-left: 1em
 
-  #fine-print
+#fine-print
   font-size: 85%
   margin-top: 2em

app/assets/stylesheets/items/sources.sass

@@ -0,0 +1,14 @@
+.nc-mall-items
+	list-style: none
+	display: flex
+	flex-wrap: wrap
+	gap: 1em
+
+	li
+		display: flex
+		flex-direction: column
+		align-items: center
+		width: auto
+
+	.add-to-cart
+		font-size: 85%

app/helpers/application_helper.rb

@@ -175,6 +175,14 @@ module ApplicationHelper
     end
   end
 
+  # Includes a stylesheet designed for this specific page of the app, which
+  # should be removed when navigating to another page. We use Turbo's
+  # `data-turbo-track="dynamic"` option to do this.
+  def page_stylesheet_link_tag(src, options={})
+    options = {data: {"turbo-track": "dynamic"}}.deep_merge(options)
+    stylesheet_link_tag src, options
+  end
+
   def secondary_nav(&block)
     content_for :before_flashes,
       content_tag(:nav, :id => 'secondary-nav', &block)

app/models/item.rb

@@ -175,6 +175,10 @@ class Item < ApplicationRecord
     @wanted || false
   end
 
+  def current_nc_price
+    nc_mall_record.current_price
+  end
+
   def restricted_zones(options={})
     options[:scope] ||= Zone.all
     options[:scope].find(restricted_zone_ids)

app/models/nc_mall_record.rb

@@ -1,3 +1,7 @@
 class NCMallRecord < ApplicationRecord
   belongs_to :item
+
+  def current_price
+    discount_price || price
+  end
 end

app/views/auth_users/edit.html.erb

@@ -126,5 +126,5 @@
 <% end %>
 
 <% content_for :stylesheets do %>
-  <%= stylesheet_link_tag "auth_users/edit" %>
+  <%= page_stylesheet_link_tag "auth_users/edit" %>
 <% end %>

app/views/devise/sessions/new.html.erb

@@ -66,5 +66,5 @@
 </div>
 
 <% content_for :stylesheets do %>
-  <%= stylesheet_link_tag "devise/sessions/new" %>
+  <%= page_stylesheet_link_tag "devise/sessions/new" %>
 <% end %>

app/views/fundraising/campaigns/show.html.haml

@@ -124,4 +124,4 @@
     Thank you!!
 
 - content_for :stylesheets do
-  = stylesheet_link_tag 'fundraising/campaigns/show'
+  = page_stylesheet_link_tag 'fundraising/campaigns/show'

app/views/fundraising/donations/show.html.haml

@@ -48,4 +48,4 @@
   = javascript_include_tag 'fundraising/donations/show', defer: true
 
 - content_for :stylesheets do
-  = stylesheet_link_tag 'fundraising/donations/show'
+  = page_stylesheet_link_tag 'fundraising/donations/show'

app/views/items/sources.html.haml

@@ -3,16 +3,53 @@
 
 - if @nc_mall_items.present?
 	%h2 NC Mall items
-	= render @nc_mall_items
+	:markdown
+		These items are available in the NC Mall right now! You can buy them
+		with Neocash, a special currency you can [purchase directly][nc]
+		from Neopets or redeem via [gift cards][gc].
+
+		[nc]: https://secure.nc.neopets.com/get-neocash
+		[gc]: https://secure.nc.neopets.com/nickcash-cards
+	%ul.nc-mall-items
+		- @nc_mall_items.each do |item|
+			%li
+				= render item
+				%button.add-to-cart{onclick: "alert('Todo!')"}
+					Buy (#{item.current_nc_price} NC)
 
 - if @np_items.present?
 	%h2 Neopoint items
+	:markdown
+		These items can be purchased with Neopoints. For less-expensive items,
+		check the [Shop Wizard][wiz] first. Otherwise, try the
+		[Trading Post][tp] or [Auction Genie][ag]. Dress to Impress doesn't
+		track Neopoint item prices, but other fansites do!
+
+		[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
 
 - if @pb_items.present?
 	%h2 Paintbrush items
+	:markdown
+		These items are part of a paintbrush set. Once you paint your pet,
+		these items will be semi-permanently added to your Closet, even if your
+		pet changes color again! You can use this to mix-and-match styles for
+		"cross-paint" outfits.
 	= render @pb_items
 
 - if @other_nc_items.present?
-	%h2 Other NC items
+	%h2 Neocash items (Capsules, Dyeworks, events, retired, etc.)
+	:markdown
+		These items are part of the Neocash economy and can't be purchased with
+		Neopoints. We don't track all the details of how to get these items
+		right now! Sometimes they're available via packs or capsules or events
+		in the [NC Mall][mall]. Sometimes they're retired and can't be
+		purchased at all anymore, and can only be obtained via gifts or trades.
+
+		[mall]: https://ncmall.neopets.com/
 	= render @other_nc_items
+
+- content_for :stylesheets do
+	= page_stylesheet_link_tag "items/sources"