Make team buttons smaller and hide when a single team is configured

[ringvold]

Not sure if this is something you want or if its done the prefered way, but here it is.

The team buttons seemed unnecessarily large. It becomes more obvious when using it at about a quarter of fullscreen size. At least with my setup.

I tried to make it about the same size as Slack has in its app. I have attached some screenshot to show the difference.

Also hides team buttons sidebar when only one team is configured.

[lloeki]

I've been hacking something like this myself for an internal build, so definitely interested by a proper implementation.

[lloeki]

This would fix #74

[LongLiveCHIEF]

I also love how you created tests for the team-buttons spec!

[LongLiveCHIEF]

It looks ok at the moment, and I do like the smaller size now that I've compared. My only concern is what things will look like with both of the different types of mention badges. When the morning rolls around, there will be plenty of activity on my mattermost server, and if they look good with this change, then I'll give it the :thumbs_up:

Future Todo

One thing to note however, is that we're currently working on code to add a "add team" symbol to this sidebar. This means we'll need to have a show/hide feature for the sidebar, instead of just a value based show/hide.

Great contribution @haraldringvold thanks!

[ringvold]

I did not think about the badges. I'll try create some and see how it looks. Let me know how it look for you as well.

I liked how simple the test setup was so I had no problems creating the tests. :+1:

[ringvold]

With after a quick check I think it looks fairly good:

What do you think?

[LongLiveCHIEF]

Looks good. Will merge when I get to my desk. On Jan 6, 2016 7:07 AM, "Harald Ringvold" notifications@github.com wrote:

With after a quick check I think it looks fairly good: [image: matterfont-smaller_teambuttons_with_badges] https://cloud.githubusercontent.com/assets/185551/12143066/79d46092-b47d-11e5-845b-07b46afb3ff2.png [image: matterfont-smaller_teambuttons_with_badges-two_teams] https://cloud.githubusercontent.com/assets/185551/12143171/bda2c6b4-b47e-11e5-9a95-d13c70f87439.png

What do you think?

— Reply to this email directly or view it on GitHub https://github.com/lloeki/matterfront/pull/77#issuecomment-169319525.

[geekytime]

Ha ha. These were probably a little big because I work on a 4k monitor. Sorry if they seemed huge to others. For some reason I didn't try a bunch of different sizes like I would for a true web app. I'll have to get into that habit. :stuck_out_tongue_winking_eye:

In the long run we probably need these to size dynamically at a CSS break point or two, and @H3Chief is right about the "add team" button, but if this is better for most people right now, let's merge it.

:+1:

[lloeki]

Those badges look fine to me. Thanks for implementing this!

[ninja-]

@haraldringvold the style looks great but I don't like idea of two separate counters. Look, there's an idea to don't bother people with number of unread messages that came from slack(50000 unread messages etc.) . Instead you show just a sign that there are some unread messages and seperately a single counter with mentions :smiley:

Altough I can see how this design could be opt-in configurable, some people might want to evaluate how much of discussion they are missing out without actually going in. (and then with a limit like above the limit displayed is 99+ or 999+ etc.)

(slack has a lot of configuration options for desktop apps and there's never too much of them to fit every team!)

[LongLiveCHIEF]

@haraldringvold the style looks great but I don't like idea of two separate counters.

He didn't do that, @geekytime and I did. It was part of #67.