payment_icons
payment_icons copied to clipboard
Qliro - new Payment App icon
Why are you adding this icons?
We (Ghostar Agency) are Shopify Partner, and the Shopify Agency that is developing Qliro:s (qliro.com) new Payment App for Shopify. Qliro has been Approved as Shopify Payment Partner.
Help us identify yourself
- [x] 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: https://developers.qliro.com/docs/branding
Checklist to add new icons
- [x] All icons have a corresponding entry in
db/payment_icons.yml
- [x] I have followed the icon guidelines detailed in the CONTRIBUTING.md file
- [x] I have optimized the icon with SVGO
- [x] I am confident that all icons are clear and easy to read/understand
- [x] I have provided a link to the brand icon’s brand guidelines whenever possible.
- [x] I have attached a screenshot comparison with the example icon provided in guidelines
- [x] 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 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 -->
<svg xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 38 24" width="38" height="24" aria-labelledby="pi-qliro">
<title id="pi-qliro">Qliro</title>
<path d="M0 2C0 0.89543 0.895431 0 2 0H36C37.1046 0 38 0.895431 38 2V22C38 23.1046 37.1046 24 36 24H2C0.89543 24 0 23.1046 0 22V2Z" fill="black"/>
<path d="M10.5239 15.0428H10.4421L11.0804 16.4013H9.46008L8.82586 15.0428H8.43305C7.95841 15.0428 7.59015 14.916 7.33646 14.6623C7.08278 14.4086 6.95593 14.0444 6.95593 13.5657V9.43305C6.95593 8.95841 7.08278 8.59015 7.33646 8.33647C7.59015 8.08278 7.95432 7.95593 8.43305 7.95593H10.5239C10.9986 7.95593 11.3668 8.08278 11.6205 8.33647C11.8742 8.59015 12.001 8.95841 12.001 9.43305V13.5657C12.001 14.0404 11.8742 14.4086 11.6205 14.6623C11.3668 14.916 11.0027 15.0428 10.5239 15.0428ZM8.49443 9.52307V13.4757C8.49443 13.6435 8.57626 13.7253 8.74402 13.7253H10.213C10.3807 13.7253 10.4626 13.6435 10.4626 13.4757V9.52307C10.4626 9.35531 10.3807 9.27347 10.213 9.27347H8.74402C8.57626 9.27347 8.49443 9.35531 8.49443 9.52307Z" fill="#00FFC2"/>
<path d="M12.8767 15.0019V7.99685H14.4152V13.668H17.0912V15.0019H12.8767Z" fill="#00FFC2"/>
<path d="M17.7827 15.0019V7.99685H19.3212V15.0019H17.7827Z" fill="#00FFC2"/>
<path d="M23.593 15.0019L22.7992 12.3668H21.813V15.0019H20.2746V7.99685H23.7444C24.219 7.99685 24.5872 8.12369 24.8409 8.37738C25.0946 8.63107 25.2215 8.99933 25.2215 9.47397V10.8897C25.2215 11.6262 24.931 12.0927 24.3458 12.2891L25.2501 15.0019H23.593ZM23.4334 9.30212H21.813V11.0616H23.4334C23.6011 11.0616 23.683 10.9797 23.683 10.812V9.5558C23.683 9.38395 23.6011 9.30212 23.4334 9.30212Z" fill="#00FFC2"/>
<path d="M29.5669 15.0428H27.476C27.0014 15.0428 26.6331 14.916 26.3794 14.6623C26.1257 14.4086 25.9989 14.0444 25.9989 13.5657V9.43305C25.9989 8.95841 26.1257 8.59015 26.3794 8.33647C26.6331 8.08278 26.9973 7.95593 27.476 7.95593H29.5669C30.0415 7.95593 30.4098 8.08278 30.6635 8.33647C30.9172 8.59015 31.044 8.95841 31.044 9.43305V13.5657C31.044 14.0404 30.9172 14.4086 30.6635 14.6623C30.4057 14.916 30.0415 15.0428 29.5669 15.0428ZM27.5374 9.52307V13.4757C27.5374 13.6435 27.6192 13.7253 27.787 13.7253H29.2559C29.4237 13.7253 29.5055 13.6435 29.5055 13.4757V9.52307C29.5055 9.35531 29.4196 9.27347 29.2559 9.27347H27.787C27.6192 9.27347 27.5374 9.35531 27.5374 9.52307Z" fill="#00FFC2"/>
</svg>
#### 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?
Hi @svpa82—could you please add a visible border to the icon? See our contributing guidelines.
Hi @hellicarusprime I have now added a new icon with border. Is the icon ok?
Hey @svpa82, the border should be (hex color #000) with a 7% opacity (0.07). It also looks like you might need to adjust the border-radius as it doesn't look right when I make the change. See the attached screenshot for reference.
hi @hellicarusprime new Icon uploaded to the branch, with hopefully right border this time.
Hi @hellicarusprime and thanks for Approval. How long time do it normally take for the the new icon be be able to select as Payment Method for the App under Extentions in Shopify?
Also saw that some tests failed below, do I need to do anything more?
@hellicarusprime uploaded new Icon to the branch that I hope solve the Build error:
PaymentIconTest#test_Payment_icon_SVGs_are_a_single_line [test/unit/payment_icon_test.rb:127]: The 'qliro' SVG file should contain a single line of markup, optionally terminated by an empty line
Hi @hellicarusprime and thanks for Approval. How long time do it normally take for the the new icon be be able to select as Payment Method for the App under Extentions in Shopify?
Also saw that some tests failed below, do I need to do anything more?
@adeniyiao when is the next release?
Hi @adeniyiao do you know when next release will be? Need to plan for the go-live of the Payment App. Thanks.
Hi @svpa82 ,
The next release is scheduled for May 1
Hi @adeniyiao Is the release completed? Just tested, but I can't select the Qliro icon in Shopify under App Extentions > "Add Payment methodes"?
@hellicarusprime @Lovedanihonjin do you know why i can't select the new Qliro icon in Shopify under App Extentions > "Add Payment methodes"?
Hi @svpa82, the deployment was completed today, you should see it now.