Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated the twitter follow button #188

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

nixi-awoo
Copy link
Contributor

I updated the twitter follow button as described in #180. I used the main blue colour of SteamLUG logo instead of default twitter bright neon colour.

Is <span id="l"> wraping the text inside of the button important in any way or can I remove it? There is no such id in the css files, but it might be used for some javascript magic.

Here is a preview:
preview1
preview2

I can't seem to be able to fix the icon. It is defined to be like this in steamlugfont.css
.fa-twitter:before { content: '🐦'; }
It might be caused by the fact that I can not test the page locally.

I suggest not to merge until everything is resolved.

@johndrinkwater
Copy link
Member

At the time we duplicated the HTML from the js embed output, to make toggling between the two not a worry. #180 was for updating branding to match Twitter’s new colour and appearance, with whatever fitted with our design. I can look at this PR later today.

@johndrinkwater
Copy link
Member

How about:

-.follow-label{text-shadow:0 1px 0 rgba(255,255,255,.5);color:#333;background-color:#eee;border-radius:3px;border:1px solid #ccc;height:18px;display:inline-block;vertical-align:top;font-size:11px;padding:0 3px 0 19px;font-weight:700}
-.follow a i{display:inline-block;position:relative;left:1em;color:#55acee;text-shadow:none}
+.follow i{margin-right:6px;font-size:1.2em}
+.follow a{background-color:#415c78;border-radius:3px;color:#fff;font-size:11px;padding:2px 6px;text-decoration:none;text-shadow:none}

as the patch here to bootstrap.steamlug.css and no changes to the HTML ?

@johndrinkwater
Copy link
Member

Feedback wanted: which is preferred here, Twitter colour #1b95e0 or ours #415c78?

@beansmyname
Copy link
Contributor

👍 for #415c78 (ours).

@nixi-awoo
Copy link
Contributor Author

I would go for #415c78 as well, since the default twitter colour is too flashy on a dark background. It has been made white light-themed sites in mind.

And regarding the HTML changes: <b></b> tag has been deprecated by the HTML5 standard. The other deleted tags and definitions were arbitrary and unused.

@johndrinkwater
Copy link
Member

Hey, so where was this PR stuck at? Using <b> is fine, it’s still in HTML5 so that is no worry.

@johndrinkwater
Copy link
Member

This has bitrot over time, since it missed the merge window mentioned above.

I still want to keep the HTML as is, so we can toggle easily between our output and the js embed (for a possible future when the API breaks and it is an easier instant fix)
From a tally of votes, we selected to use our site colour of #415c78 for the button.

If the Twitter font icon needs updating, make a new issue for that as soon I will be adding a Steam icon to it for usefulness.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants