feat(shop): add 'Made by a teen' banner to shop items

[sreyasaju]

• added teen_creator_url to ShopItems via migration
• updated ShopItemCardComponent to render the new banner and also handle overlap when mutliple ribbons exist
• added styling and positioning for the --teen-creator ribbon,
• updated _item_card.html.erb and _recently_added.html.erb to pass the teen_creator_url attribute.

Closes #692

what's this do?

This PR adds a "Made by a teen!" ribbon to shop items that have a teen_creator_url defined, to help spotlight items created by hackclubbers directly on the card.

show it works

BEFORE

AFTER along with other ribbons

AFTER

testing

HCA was not used, testing was done locally by creating a test user and applying a teen_creator_url to a ShopItem.

Initializing a test user

user = User.find_or_initialize_by(email: "xxx@xxxx.com")
user.update!(
  first_name: "Sreya",
  last_name: "Saju",
  display_name: "SreyaSaju",
  approx_balance: 500,
  verification_status: "needs_submission"
)

and applying a testing url and banner to existing shop item card (which was the Outpost ticket)

docker compose exec web bin/rails runner 'item = ShopItem.find(4); item.update_columns(teen_creator_url: "https://github.com/hackclub/stardance");'

ai?

Copilot assisted with the local testing process and formatting the data setup commands!

[vandorena]

@transcental

[transcental]

Not a massive fan of this - the item cards are already somewhat cluttered, I don't think we should be adding more to them without adjusting how they currently are

Maybe we could have a little hack clubber icon to represent this?