Linking to Zulip on the Discourse bottom banner

Mason · September 23, 2020, 6:56pm

Hello, I recently noticed that we now have a bottom banner on Discourse with some links to the Julia twitter, youtube, github, stack overflow and Slack pages.

I was hoping to start a conversation about having the Julia Zulip community included in that list.

The Julia Zulip community is a chat platform that averages a bit over 100 active users per day and is used both as an open source Slack alternative, but also as a home for several Julia sub communities who depend on it’s support for inline LaTeX math and persistent message history. It’s mentioned on Community, so it’d be nice if could be included on the Discourse banner too.

There are dozens of us!

waldyrious · September 23, 2020, 10:25pm

In case a negative, simplified version of the Zulip icon is needed, I just uploaded one to Wikimedia Commons

Mason · September 23, 2020, 10:27pm

They’ve actually updated their logo away from that design:

waldyrious · September 23, 2020, 10:28pm

Oh well… good thing I enjoy playing with SVG anyway

logankilpatrick · September 24, 2020, 5:27am

@mbauman

mbauman · September 24, 2020, 1:33pm

I actually looked into this when I threw that footer together — the only reason I didn’t add Zulip was because the theme component we’re using here (easy-footer) uses font-awesome 5 brand icons… and Zulip isn’t there. I don’t know how to use arbitrary SVGs… if someone can figure it out I’d be happy to add it.

Mason · September 24, 2020, 7:20pm

Hm, I see, that’s. Perhaps one hacky option would be to (ab)use unicode? e.g. maybe there’s a unicode Z in an appropriate font that’s close enough. Any ideas @cormullion?

mbauman · September 24, 2020, 9:27pm

I think we can easily add custom CSS to each theme… which could allow us to define a custom zulip class for its SVG definition… I think. The FontAwesome names just end up as the link.className here:

github.com

discourse/Discourse-easy-footer/blob/b70f0edc3961afa9179658a4e8aab3f838fd5cb0/javascripts/discourse/connectors/below-footer/custom-footer.hbs#L40


      
                  </div>
                </div>
                <div class="third-box">
                  <div class="footer-links">
                    {{#each smallLinks as |link|}}
                      <a class="small-link {{link.className}}" title="{{link.title}}" target="{{link.target}}" href="{{link.href}}">{{link.text}}</a>
                    {{/each}}
                  </div>
                  <div class="social">
                    {{#each socialLinks as |link|}}
                      <a class="social-link {{link.className}}" title="{{link.title}}" target="{{link.target}}" href="{{link.href}}">{{d-icon link.icon}}</a>
                    {{/each}}
                  </div>
                </div>
              </div>
            </div>
          {{/if}}

So we just need a custom CSS class defined, right?

juliohm · September 24, 2020, 10:07pm

On a related note, you can upvote the Zulip icon on Font Awesome: https://github.com/FortAwesome/Font-Awesome/issues/16999

cormullion · September 24, 2020, 10:22pm

https://github.com/discourse/Discourse-easy-footer/blob/b70f0edc3961afa9179658a4e8aab3f838fd5cb0/settings.yml#L34 maybe

dilumaluthge · October 4, 2020, 1:09am

Bump. It would be great to get this added to the footer.

@mbauman @cormullion Looks like you might be close to figuring it out?

mbauman · October 5, 2020, 2:02pm

Not really, no. Looking back at my post above, the important thing isn’t the link.classname — it’s the link.icon. And I think that {{d-icon link.icon}} is an expander function expands it out to a hardcoded link into FontAwesome.

dilumaluthge · October 5, 2020, 2:19pm

Hmm. If it’s hardcoded to be a FontAwesome icon, maybe we just pick a generic “chat” icon for now? E.g. comments | Font Awesome

And then once https://github.com/FortAwesome/Font-Awesome/issues/16999 has been implemented, we can switch to the correct icon.

mbauman · October 8, 2020, 4:59pm

Good idea. Done.