-
Notifications
You must be signed in to change notification settings - Fork 473
Icons and Modernizer Adjustments #85
Changes from 7 commits
2050f60
f3d0d20
c0a1bb0
cd40525
5a514c9
f92a11a
eebe65a
f22ea2c
dc698bf
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -25,15 +25,22 @@ | |
Loop through the persistent theme settings and list out each social network link. | ||
{% endcomment %} | ||
<ul class="inline-list social-icons"> | ||
{% if settings.twitter_link != blank %}<li class="twitter"><a href="{{ settings.twitter_link }}" title="{{ shop.name }} on Twitter">T</a></li>{% endif %} | ||
{% if settings.facebook_link != blank %}<li class="facebook"><a href="{{ settings.facebook_link }}" title="{{ shop.name }} on Facebook">f</a></li>{% endif %} | ||
{% if settings.pinterest_link != blank %}<li class="pinterest"><a href="{{ settings.pinterest_link }}" title="{{ shop.name }} on Pinterest">p</a></li>{% endif %} | ||
{% if settings.google_plus_link != blank %}<li class="google-plus"><a href="{{ settings.google_plus_link }}" title="{{ shop.name }} on Google+">g</a></li>{% endif %} | ||
{% if settings.instagram_link != blank %}<li class="instagram"><a href="{{ settings.instagram_link }}" title="{{ shop.name }} on Instagram">i</a></li>{% endif %} | ||
{% if settings.tumblr_link != blank %}<li class="tumblr"><a href="{{ settings.tumblr_link }}" title="{{ shop.name }} on Tumblr">t</a></li>{% endif %} | ||
{% if settings.youtube_link != blank %}<li class="youtube"><a href="{{ settings.youtube_link }}" title="{{ shop.name }} on YouTube">y</a></li>{% endif %} | ||
{% if settings.vimeo_link != blank %}<li class="vimeo"><a href="{{ settings.vimeo_link }}" title="{{ shop.name }} on Vimeo">v</a></li>{% endif %} | ||
{% if settings.fancy_link != blank %}<li class="fancy"><a href="{{ settings.fancy_link }}" title="{{ shop.name }} on Fancy">F</a></li>{% endif %} | ||
{% if settings.twitter_link != blank %} | ||
<li> | ||
<a class="icon-fallback-text" href="{{ settings.twitter_link }}" title="{{ shop.name }} on Twitter"> | ||
<span class="icon icon-twitter" aria-hidden="true"></span> | ||
<span class="fallback-text">Twitter</span> | ||
</a> | ||
</li> | ||
{% endif %} | ||
{% if settings.facebook_link != blank %} | ||
<li> | ||
<a class="icon-fallback-text" href="{{ settings.facebook_link }}" title="{{ shop.name }} on Facebook"> | ||
<span class="icon icon-facebook" aria-hidden="true"></span> | ||
<span class="fallback-text">Facebook</span> | ||
</a> | ||
</li> | ||
{% endif %} | ||
</ul> | ||
</div> | ||
{% endif %} | ||
|
@@ -55,20 +62,12 @@ | |
<h4 class="text-center">Accepted Payments</h4> | ||
<ul class="inline-list payment-icons text-center"> | ||
{% for type in shop.enabled_payment_types %} | ||
{% if type == "diners_club" %}<li>c</li>{% endif %} | ||
{% if type == "maestro" %}<li>m</li>{% endif %} | ||
{% if type == "interac" %}<li>I</li>{% endif %} | ||
{% if type == "visa" %}<li>V</li>{% endif %} | ||
{% if type == "master" %}<li>M</li>{% endif %} | ||
{% if type == "discover" %}<li>D</li>{% endif %} | ||
{% if type == "dk" %}<li>d</li>{% endif %} | ||
{% if type == "american_express" %}<li>A</li>{% endif %} | ||
{% if type == "google" %}<li>G</li>{% endif %} | ||
{% if type == "paypal" %}<li>P</li>{% endif %} | ||
{% if type == "jcb" %}<li>J</li>{% endif %} | ||
{% if type == "cirrus" %}<li>C</li>{% endif %} | ||
{% if type == "stripe" %}<li>S</li>{% endif %} | ||
{% if type == "bitcoin" %}<li>B</li>{% endif %} | ||
<li> | ||
<span class="icon-fallback-text"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @tobi @mpiotrowicz Moved to a much simpler icon approach with text fallback when font-face isn't supported. |
||
<span class="icon icon-{{type}}" aria-hidden="true"></span> | ||
<span class="fallback-text">{{type | replace: '_',' '}}</span> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. we should just make type.name work instead of relying on magical replace. @markdunkley know someone who could do that? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @gauravmc thoughts? {{ type | name }} There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. @tobi making {{ type.name }} work will mean making some drop instead of simple It'll be simple enough to add a filter as @markdunkley's suggesting. We can add a There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I wouldn't say common, though I'm also not very familiar with similar languages. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I like humanize as a filter. -- Tobi (mobile)
|
||
</span> | ||
</li> | ||
{% endfor %} | ||
</ul> | ||
{% endunless %} | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Equivalent to:
{% if settings.facebook_link %}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@tobi I was under the impression that wouldn't work. We've always been using:
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@graygilmore Agreed, just tested all three ways and only
!= blank
andsize > 0
methods work. Do we use one more often than the other in other themes?There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We exclusively use
size > 0
, probably picked it up from @carolineschnapp.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@graygilmore I prefer
!= blank
.An empty string will be truthy @tobi.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ah yea right :-(
CEO Shopify
On Tue, Jun 3, 2014 at 5:48 PM, Caroline notifications@github.com wrote: