Jump to content
exec

Gitter design "mod"

Recommended Posts

The following CSS code "fixes" the colorful sidebar in Gitter, turning the background dark-gray-blue, similar to Discord.

.panel-footer__item--all {
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, #36393E 90%);
}

.room-menu__panel:before {
    background: #36393E;
}

To use this you need an extension for your browser to apply custom CSS code to websites. On Chrome I'm using Stylebot, but there should be several extensions for all major browsers to allow something like this.

comparision.png

  • Like 1

Share this post


Link to post
Share on other sites

Updated for the new style currently available through Gitter Next:

ss+(2016-11-01+at+09.18.jpg

.chat-header,
.header-brand-container, .org-page__header,
.room-menu-options__item--header-spacer {
    background: #36393E;
}

.header-brand-container:after,
.room-menu-options__item--header-spacer:after {
    background: #555;
    width: 1px;
}

.chat-header__group-avatar-upload-label,
.org-page__header-logo {
    padding: 0;
}

If you also want to get rid of the "NEXT" sign at the top, add this:

.staging-indicator {
    display: none;
}

 

Share this post


Link to post
Share on other sites
5 minutes ago, Cryptic said:

Still way too white :<

I thought so too at first, but it's kinda growing on me^^ I was too lazy to change the sidebar.

  • Like 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×