Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New icons for generic payment methods #927

Merged
merged 7 commits into from
Sep 19, 2023
Merged

Conversation

adeniyiao
Copy link
Contributor

Why are you adding this icons?

  • Update existing generic icons for cash, generic and gift card
  • Adding new generic payment method for wallet, online banking and store credit

Help us identify yourself

  • I'm working/collaborating with the brand directly and they have provided the icons.
  • I'm associated with the brand and I've read all the brand icon’s guidelines.
  • I'm an individual and I've read all the brand icon’s guidelines.

Link to the brand guidelines:

Checklist to add new icons

  • All icons have a corresponding entry in db/payment_icons.yml
  • I have followed the icon guidelines detailed in the CONTRIBUTING.md file
  • I have optimized the icon with SVGO
  • I am confident that all icons are clear and easy to read/understand
  • I have provided a link to the brand icon’s brand guidelines whenever possible.
  • I have attached a screenshot comparison with the example icon provided in guidelines
  • I recognize that if my icon is not approved by the Shopify Partners team it may not receive review nor merger.

If this pull request is not adding new icons, you can remove this checklist.

Attach a screenshot of the icon along side the example Visa icon

Tips how to create a screenshot

We have found free online SVG editor https://www.freecodeformat.com/svg-editor.php very useful to create one. Here is a sample code for you to verify that you icon appears properly along side the placeholder.

<!-- Change background color if needed to showcase your icon better -->
<style> body { background: black; } </style>

<!-- DO NOT DELETE EXAMPLE -->
<svg viewBox="0 0 38 24" xmlns="http://www.w3.org/2000/svg" role="img" width="38" height="24" aria-labelledby="pi-visa"><title id="pi-visa">Visa</title><path opacity=".07" d="M35 0H3C1.3 0 0 1.3 0 3v18c0 1.7 1.4 3 3 3h32c1.7 0 3-1.3 3-3V3c0-1.7-1.4-3-3-3z"/><path fill="#fff" d="M35 1c1.1 0 2 .9 2 2v18c0 1.1-.9 2-2 2H3c-1.1 0-2-.9-2-2V3c0-1.1.9-2 2-2h32"/><path d="M28.3 10.1H28c-.4 1-.7 1.5-1 3h1.9c-.3-1.5-.3-2.2-.6-3zm2.9 5.9h-1.7c-.1 0-.1 0-.2-.1l-.2-.9-.1-.2h-2.4c-.1 0-.2 0-.2.2l-.3.9c0 .1-.1.1-.1.1h-2.1l.2-.5L27 8.7c0-.5.3-.7.8-.7h1.5c.1 0 .2 0 .2.2l1.4 6.5c.1.4.2.7.2 1.1.1.1.1.1.1.2zm-13.4-.3l.4-1.8c.1 0 .2.1.2.1.7.3 1.4.5 2.1.4.2 0 .5-.1.7-.2.5-.2.5-.7.1-1.1-.2-.2-.5-.3-.8-.5-.4-.2-.8-.4-1.1-.7-1.2-1-.8-2.4-.1-3.1.6-.4.9-.8 1.7-.8 1.2 0 2.5 0 3.1.2h.1c-.1.6-.2 1.1-.4 1.7-.5-.2-1-.4-1.5-.4-.3 0-.6 0-.9.1-.2 0-.3.1-.4.2-.2.2-.2.5 0 .7l.5.4c.4.2.8.4 1.1.6.5.3 1 .8 1.1 1.4.2.9-.1 1.7-.9 2.3-.5.4-.7.6-1.4.6-1.4 0-2.5.1-3.4-.2-.1.2-.1.2-.2.1zm-3.5.3c.1-.7.1-.7.2-1 .5-2.2 1-4.5 1.4-6.7.1-.2.1-.3.3-.3H18c-.2 1.2-.4 2.1-.7 3.2-.3 1.5-.6 3-1 4.5 0 .2-.1.2-.3.2M5 8.2c0-.1.2-.2.3-.2h3.4c.5 0 .9.3 1 .8l.9 4.4c0 .1 0 .1.1.2 0-.1.1-.1.1-.1l2.1-5.1c-.1-.1 0-.2.1-.2h2.1c0 .1 0 .1-.1.2l-3.1 7.3c-.1.2-.1.3-.2.4-.1.1-.3 0-.5 0H9.7c-.1 0-.2 0-.2-.2L7.9 9.5c-.2-.2-.5-.5-.9-.6-.6-.3-1.7-.5-1.9-.5L5 8.2z" fill="#142688"/></svg>

<!-- TODO: insert your icon here -->
<YOUR SVG CODE>

<br>
<!-- TODO: insert your icon here -->
<YOUR SVG CODE>
</br

If the icons are intended for use by Shopify, please provide the following info:

Who are you working with at Shopify? (avoid adding personal details, provide github handle(preferred) or first name and last name)

What's the expected date of this change to deploy on Shopify?

app/assets/images/payment_icons/cash.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/cash.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/generic.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/generic.svg Outdated Show resolved Hide resolved
@adeniyiao
Copy link
Contributor Author

Thanks @jffortier for the review, I saw your comments late before making some edits. Could you please review again based on latest changes

@adeniyiao adeniyiao requested a review from jffortier September 13, 2023 14:46
@adeniyiao adeniyiao marked this pull request as ready for review September 13, 2023 16:16
app/assets/images/payment_icons/cash.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/generic.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/gift-card.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/onlinebanking.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/storecredit.svg Outdated Show resolved Hide resolved
app/assets/images/payment_icons/wallet.svg Outdated Show resolved Hide resolved
Co-authored-by: Jean-Frederic Fortier <[email protected]>
Copy link
Collaborator

@jffortier jffortier left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

:shipit:

Heads up that if we want to allow theming of these icons by the consumer, we may need to come back to these SVGs and implement some custom properties. All depends of the branding we'll want to do. cc @Jacquesattaque

@adeniyiao adeniyiao merged commit 413e13b into master Sep 19, 2023
@shopify-shipit-activemerchant shopify-shipit-activemerchant bot temporarily deployed to rubygems September 20, 2023 15:56 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants