Make social buttons extendable

[choldgraf]

Right now we are hard-coding our social buttons here:

https://github.com/pandas-dev/pydata-sphinx-theme/blob/cc2551f97db509102c99421e758bffd2c527b305/pydata_sphinx_theme/docs-navbar.html#L38

It means that we need to manually add support for a new kind of button each time somebody wants one. We could instead make this a configurable list like so:

pydata_social_buttons = [
    {"classes": "fab fa-github", "url": "https://github.com/pandas-dev/pydata-sphinx-theme"},
    {"classes": "fab fa-twitter-square", "url": "https://twitter.com/pandas-dev"},
]

and so on.

Then the template code for adding the buttons would be:

{% if social_buttons %}
<ul class="navbar-nav">
  {% for button in social_buttons %}
    <li class="nav-item">
       <a class="nav-link" href="{{ button['url'] }}" target="_blank" rel="noopener">
         <span><i class="button['classes']"></i></span>
       </a>
    </li>
  {% endfor %}
</ul>
{% endif %}

and this could live in _tempalates/social-buttons.html. In the future we could then insert it into the sidebar/navbar/etc as users wish via other configuration values

[jorisvandenbossche]

That sounds good to me!
There might be value in keeping the current github/twitter short-cut (eg if social_buttons are not defined, but github_url is defined, automatically add a github entry to the social_buttons), that is easier for this use case (don't need to know the fab classes).

Should we give it a more generic name (eg "icon links" or so)? It's not necessarily only "social" links

[choldgraf]

yeah that makes sense 👍

[bollwyvl]

If this gets overhauled: it's likely worth adding some human-readable content to render in a tooltip/screen-reader discoverable way:

pydata_social_buttons = {
    {"title": "GitHub", "classes": "fab fa-github", "url": "https://github.com/pandas-dev/pydata-sphinx-theme"},
    {"title": "Twitter", "classes": "fab fa-twitter-square", "url": "https://twitter.com/pandas-dev"},
}

{% if social_buttons %}
<ul class="navbar-nav">
  {% for button in social_buttons %}
    <li class="nav-item">
       <a class="nav-link" href="{{ button['url'] }}" target="_blank" rel="noopener" title="{{ button['title'] }}">
         <span><i class="button['classes']"></i></span>
        <span>{{ button['title'] }}</span>
       </a>
    </li>
  {% endfor %}
</ul>
{% endif %}

[bollwyvl]

#270 is doing what it says on the tin, but in thinking about deprecation cycles and testing: could we combine external_links and the proposed icon links? It would keep the same data model (e.g. name instead of label or title), but have some flag (maybe just the presence of icon) that would push it to the "short links" toolbar.

    "external_links": [
        {
            "url": "https://pandas.pydata.org/pandas-docs/stable/", 
            "name": "Pandas Docs"
        },
        {
            "url": "https://pypi.org/project/pydata-sphinx-theme",
            "name": "PyPI",
            "icon": "fab fa-python",
        }
    ],