Make social icons more generic and add accessibility (#130)
* Made social icons more configurable and add accessibility * Paths weren't correct for landing.md * Support for empty values in social media configuration
This commit is contained in:
parent
8960c1023d
commit
dab6f58e34
24
_config.yml
24
_config.yml
|
@ -17,17 +17,19 @@ phone: (716) 555-5555
|
||||||
tiles-source: pages # accepts "posts" or "pages"
|
tiles-source: pages # accepts "posts" or "pages"
|
||||||
tiles-count: 6
|
tiles-count: 6
|
||||||
|
|
||||||
# social settings
|
# social settings (key must match name of font awesome icon)
|
||||||
500px_url:
|
# see https://fontawesome.com/icons?d=gallery&p=2&s=brands
|
||||||
facebook_url:
|
# Icons are not shown if value is empty
|
||||||
github_url:
|
# You need to restart jekyll for changes to have an effect
|
||||||
gitlab_url: https://gitlab.com/andrewbanchich
|
socials:
|
||||||
googleplus_url: https://plus.google.com/u/0/+AndrewBanchich
|
GitHub: https://github.com/andrewbanchich
|
||||||
instagram_url: https://instagram.com
|
GitLab:
|
||||||
linkedin_url: https://www.linkedin.com/in/andrew-banchich-a4ba1195
|
Google-Plus: https://plus.google.com/u/0/+AndrewBanchich
|
||||||
pinterest_url:
|
Instagram:
|
||||||
slack_url:
|
LinkedIn: https://www.linkedin.com/in/andrew-banchich-a4ba1195
|
||||||
twitter_url: https://twitter.com/andrewbanchich
|
Twitter: https://twitter.com/andrewbanchich
|
||||||
|
Facebook:
|
||||||
|
Slack:
|
||||||
|
|
||||||
# build settings
|
# build settings
|
||||||
markdown: kramdown
|
markdown: kramdown
|
||||||
|
|
|
@ -67,36 +67,15 @@
|
||||||
<footer id="footer">
|
<footer id="footer">
|
||||||
<div class="inner">
|
<div class="inner">
|
||||||
<ul class="icons">
|
<ul class="icons">
|
||||||
{% if site.twitter_url %}
|
{% for key_value in site.socials %}
|
||||||
<li><a href="{{ site.twitter_url }}" class="icon alt fa-twitter" target="_blank"><span class="label">Twitter</span></a></li>
|
{% if key_value[1] %}
|
||||||
{% endif %}
|
<li>
|
||||||
{% if site.googleplus_url %}
|
<a href="{{ key_value[1] }}" class="icon alt fa-{{ key_value[0] | downcase }}" target="_blank" rel="noopener noreferrer" aria-label="{{ key_value[0] }}">
|
||||||
<li><a href="{{ site.googleplus_url }}" class="icon alt fa-google-plus" target="_blank"><span class="label">Google+</span></a></li>
|
<span class="label">{{ key_value[0] }}</span>
|
||||||
{% endif %}
|
</a>
|
||||||
{% if site.facebook_url %}
|
</li>
|
||||||
<li><a href="{{ site.facebook_url }}" class="icon alt fa-facebook" target="_blank"><span class="label">Facebook</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.instagram_url %}
|
|
||||||
<li><a href="{{ site.instagram_url }}" class="icon alt fa-instagram" target="_blank"><span class="label">Instagram</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.pinterest_url %}
|
|
||||||
<li><a href="{{ site.pinterest_url }}" class="icon alt fa-pinterest" target="_blank"><span class="label">Pinterest</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.500px_url %}
|
|
||||||
<li><a href="{{ site.500px_url }}" class="icon alt fa-500px" target="_blank"><span class="label">500px</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.gitlab_url %}
|
|
||||||
<li><a href="{{ site.gitlab_url }}" class="icon alt fa-gitlab" target="_blank"><span class="label">GitLab</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.github_url %}
|
|
||||||
<li><a href="{{ site.github_url }}" class="icon alt fa-github" target="_blank"><span class="label">GitHub</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.slack_url %}
|
|
||||||
<li><a href="{{ site.slack_url }}" class="icon alt fa-slack" target="_blank"><span class="label">Slack</span></a></li>
|
|
||||||
{% endif %}
|
|
||||||
{% if site.linkedin_url %}
|
|
||||||
<li><a href="{{ site.linkedin_url }}" class="icon alt fa-linkedin" target="_blank"><span class="label">LinkedIn</span></a></li>
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
</ul>
|
</ul>
|
||||||
<ul class="copyright">
|
<ul class="copyright">
|
||||||
<li>© {{ site.title }} {{ site.subtitle }}</li>
|
<li>© {{ site.title }} {{ site.subtitle }}</li>
|
||||||
|
|
Loading…
Reference in New Issue