[Gift card] Follow up tasks

[ludoboludo]

Follow ups opportunities

Higher priorities

• Update translations to include a link to the help docs - Gift cards/add recipient #2412 (comment)
• Mention the fact that on the gift card page, dynamic checkout buttons will be disabled - Gift cards/add recipient #2412 (comment)
• A11y announcement of the for being shown/hidden - Gift cards/add recipient #2412 (comment) - Use live region to announce recipient form #2672
• Translation labels - Gift cards/add recipient #2412 (comment)
• Add the checkbox/feature to the featured product section - Enable gift card recipient form by default on featured product section #2666
• Use pointer cursor for the checkbox
• Translate the attributes used that are displayed in the cart (screenshot). This might be a tricky one to tackle.

Lower priority

• Font size usage on product info column - Gift cards/add recipient #2412 (comment)
• Have a better naming/grouping of styles that apply to the customer templates and this form. - Gift cards/add recipient #2412 (comment)
• Alignement of properties on the account page - Gift cards/add recipient #2412 (comment)
• Issue with the original checkbox not being hidden properly (screenshot)

Version information (Dawn, browsers and operating systems)

• Dawn Version: 8.0.0
• Chrome Version 108.0.5359.124
• macOS Version 13.1

[antiBaconMachine]

#2458 First crack at A11y improvements for collapsible recipient form

[kmeleta]

Also noticed we're not using pointer cursor for the checkbox and we probably should be (our other custom checkboxes do)

[mzarud]

@ludoboludo Can you remind us what this point was referring to?

Add the checkbox/feature to the featured product section

[ludoboludo]

@ludoboludo Can you remind us what this point was referring to?

Add the checkbox/feature to the featured product section

Wondering if we were wanting to support that checkbox/workflow to send a gift card to someone for the featured product section.
Looks like Fred created a PR for it 👍

[ludoboludo]

@mzarud I've added another point that we weren't tracking in the issue:

• Translate the attributes used that are displayed in the cart (screenshot). This might be a tricky one to tackle.

Just FYI

[shawnr42]

Since we know the property names in English and that they are static, I used a Case/When to handle the translations on the cart page.

It's not pretty, but it's effective.

{% case property.first %}
{% when "Recipient email" %}
  {% assign property_label = 'recipient.form.email_label' | t %}
{% when "Recipient name" %}
  {% assign property_label = 'recipient.form.name_label' | t %}
{% when "Message" %}
   {% assign property_label = 'recipient.form.message_label' | t %}
{% when "Send on" %}
  {% assign property_label = 'recipient.form.send_on_label' | t %}
{% else %}
  {% assign property_label = property.first %}
{% endcase %}

<div class="product-option">
  <dt>{{ property_label }}:</dt>
...

[poblolo]

The issue with this approach is that the properties will only be translated in the cart and not at checkout see screenshot. It may still be okay as a workaround.