Ergo
Ergo copied to clipboard
Social media icons are not clickable
When users navigate through sites using this theme, both the eye is naturally drawn to the icons in the social media buttons and people may intuitively attempt to click the icon. However, the icon itself isn't clickable, only the text. A really tiny change which would go a long way in terms of usability would be to make the entire social media button (both the text and icon) clickable.
Wrapping the existing <i>
tag with the existing <a>
tag in the social_list
macro appears to do the trick in terms of getting the entire button to be clickable, but unfortunately, the light grey color of the icon gets replaced with the black color of the text and the padding between the button text and the icon is lost. Hopefully there exists a nicer way to do this.
this should work,
the culprit is in the CSS, probably starting here: https://github.com/insipx/Ergo/blob/f5e265da1ced040941100235b8a1090fa41e415d/sass/_macros.scss#L42
the > i
will not longer apply since the i would be nested under the <a>
I guess that this won't fix the padding error, but that could probably be fixed with a minor css change too
Hmm. Worked in my own testing, but since being merged and deployed to my personal site they're still not clickable...
Reopening to take another look at this.
Bah, my local pipeline was failing. Everything looks good including the demo site listed in the README.
Closing!