Last active
December 19, 2017 23:03
-
-
Save xfalcox/d38c242339a591575a048dd35f70b8da to your computer and use it in GitHub Desktop.
Rocket Chat Dark Theme
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// From https://github.com/0x0049/Rocket.Chat.Dark/blob/master/dist/dark.css | |
function css() {var css = ` | |
.primary-background-color { | |
background-color: transparent; | |
} | |
.side-nav .footer { | |
display: none; | |
} | |
.side-nav .rooms-list, | |
.account-box .options, | |
.flex-nav .content { | |
height: 100%; | |
} | |
.flex-nav .content { | |
top: 0; | |
padding-top: 70px; | |
padding-bottom: 10px; | |
} | |
.formatting-tips { | |
display: none !important; | |
} | |
.full-page .logo > img, | |
.login-terms { | |
display: none !important; | |
} | |
.role-tag[data-role="Admin"] { | |
display: none !important; | |
} | |
body { | |
color: #c2c3c5; | |
background-color: #36393e; | |
} | |
.color-primary-font-color { | |
color: #c2c3c5; | |
} | |
.secondary-font-color { | |
color: #fff; | |
} | |
.color-tertiary-font-color { | |
color: #c2c3c5; | |
} | |
#rocket-chat .main-content { | |
background-color: #36393e; | |
} | |
.burger i { | |
background-color: #c2c3c5; | |
opacity: 1 !important; | |
} | |
.button { | |
line-height: 100%; | |
font-weight: 700; | |
font-size: 12px; | |
} | |
.button, | |
.button.clean, | |
.side-nav .button, | |
.button.primary, | |
.sweet-alert button.confirm { | |
background-color: #7289da; | |
color: #e2e7f7; | |
} | |
.button[disabled], | |
.button.clean[disabled], | |
.side-nav .button[disabled], | |
.button.primary[disabled], | |
.sweet-alert button.confirm[disabled] { | |
background-color: #54618c; | |
color: #8c909a; | |
} | |
.button:hover, | |
.button.clean:hover, | |
.side-nav .button:hover, | |
.button.primary:hover, | |
.sweet-alert button.confirm:hover { | |
color: #e2e7f7; | |
background-color: #5873d3; | |
} | |
.sweet-alert button.confirm { | |
background-color: #7289da !important; | |
box-shadow: none !important; | |
} | |
.sweet-alert button.confirm:hover { | |
background-color: #5873d3 !important; | |
} | |
.button.cancel-direct-message, | |
.button.cancel-channel, | |
.button.delete, | |
.button.remove, | |
.button.red, | |
.button.danger, | |
.sweet-alert button.cancel { | |
background-color: #bc2031; | |
color: #f1d2d5; | |
} | |
.button.cancel-direct-message[disabled], | |
.button.cancel-channel[disabled], | |
.button.delete[disabled], | |
.button.remove[disabled], | |
.button.red[disabled], | |
.button.danger[disabled], | |
.sweet-alert button.cancel[disabled] { | |
background-color: #792c37; | |
color: #938589; | |
} | |
.button.cancel-direct-message:hover, | |
.button.cancel-channel:hover, | |
.button.delete:hover, | |
.button.remove:hover, | |
.button.red:hover, | |
.button.danger:hover, | |
.sweet-alert button.cancel:hover { | |
background-color: #a91d2c; | |
color: #e2e7f7; | |
} | |
.color-error-contrast { | |
color: #f1d2d5; | |
} | |
.button.lightblue { | |
background-color: #02acec; | |
} | |
.button.lightblue:hover { | |
background-color: #029bd4; | |
} | |
.button.secondary { | |
background-color: #eee; | |
color: #444; | |
} | |
.button.secondary:hover { | |
background-color: #d6d6d6; | |
} | |
.button.button-fullscreen { | |
background-color: transparent; | |
color: #888; | |
} | |
.button.button-fullscreen:hover { | |
background-color: transparent; | |
color: #e2e7f7; | |
} | |
.loading > div { | |
background-color: #888; | |
} | |
a { | |
color: #7289da; | |
} | |
a:hover { | |
color: #5873d3; | |
} | |
.avatar { | |
box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.5); | |
} | |
.avatar .avatar-image { | |
border-radius: 4px; | |
} | |
.side-nav .rooms-list, | |
.flex-tab-bar { | |
background-color: #2e3136; | |
} | |
.border-component-color { | |
border-color: transparent; | |
} | |
.account-box .options { | |
background-color: #292c31; | |
} | |
.account-box .options .status.online:after { | |
background-color: #3bb5e5; | |
border-color: #22abe2; | |
} | |
.account-box .options .status.away:after { | |
background-color: #fcb316; | |
border-color: #f3a703; | |
} | |
.account-box .options .status.busy:after { | |
background-color: #f04747; | |
border-color: #ee2a2a; | |
} | |
.account-box .options button, | |
.account-box .options a { | |
color: #aaa; | |
background-color: transparent; | |
} | |
.account-box .options button:hover, | |
.account-box .options a:hover { | |
background-color: #25272b; | |
color: #eee; | |
} | |
.account-box .info { | |
background-color: #282b30; | |
border-bottom: 1px solid #1c1e22; | |
} | |
.account-box .info h4 { | |
color: #eaeaea; | |
} | |
.account-box .info.status-online .thumb:after, | |
.popup-user-status-online { | |
background-color: #3bb5e5; | |
border-color: #22abe2; | |
} | |
.account-box .info.status-away .thumb:after, | |
.popup-user-status-away { | |
background-color: #fcb316; | |
border-color: #f3a703; | |
} | |
.account-box .info.status-busy .thumb:after, | |
.popup-user-status-busy { | |
background-color: #f04747; | |
border-color: #ee2a2a; | |
} | |
.status-offline, | |
.icon-at.status-offline { | |
color: #cccdce; | |
} | |
.status-online, | |
.icon-at.status-online { | |
color: #3bb5e5; | |
} | |
.user-image.status-online .avatar:after { | |
background-color: #3bb5e5; | |
border-color: #22abe2; | |
} | |
.user-image.status-away .avatar:after { | |
background-color: #fcb316; | |
border-color: #f3a703; | |
} | |
.user-image.status-busy .avatar:after { | |
background-color: #d30230; | |
border-color: #be022b; | |
} | |
.side-nav { | |
border-right: 1px solid #313338; | |
box-shadow: 1px 0 2px -1px rgba(0,0,0,0.5); | |
} | |
.side-nav a { | |
transition: none; | |
} | |
.side-nav:before { | |
display: none; | |
} | |
.side-nav .header { | |
background-color: #292c31; | |
} | |
.side-nav .header.hover .account-box .info h4, | |
.side-nav .header:hover .account-box .info h4 { | |
color: #fff; | |
} | |
.side-nav > .arrow:before, | |
.side-nav > .arrow:after { | |
background-color: #888; | |
} | |
.side-nav > .arrow:hover:before, | |
.side-nav > .arrow:hover:after, | |
.side-nav > .arrow.hover:before, | |
.side-nav > .arrow.hover:after { | |
background-color: #acacac; | |
} | |
.side-nav h3 { | |
font-weight: 700; | |
color: #abacae; | |
} | |
.side-nav ul a { | |
color: #a0a2a4; | |
} | |
.side-nav .status-offline { | |
color: #a0a2a4; | |
} | |
.side-nav .status-online { | |
color: #357996; | |
} | |
.side-nav .status-away { | |
color: #9f7824; | |
} | |
.side-nav .status-busy { | |
color: #983d3f; | |
} | |
.side-nav .more { | |
color: #6c6e72; | |
} | |
.side-nav h3.active { | |
color: #fff; | |
} | |
.side-nav ul a { | |
padding-left: 10px; | |
} | |
.side-nav ul a:hover { | |
background-color: #292c31; | |
} | |
.side-nav ul li.active { | |
background-color: transparent !important; | |
} | |
.side-nav ul li.active a { | |
background-color: #292c31; | |
color: #fff; | |
} | |
.side-nav ul li.active .status-offline { | |
color: #cacbcc; | |
} | |
.side-nav ul li.active .status-online { | |
color: #3bb5e5; | |
} | |
.side-nav ul li.active .status-away { | |
color: #fcb316; | |
} | |
.side-nav ul li.active .status-busy { | |
color: #f04747; | |
} | |
.side-nav ul li.has-alert .name, | |
.side-nav ul li.has-alert .icon-lock, | |
.side-nav ul li.has-alert .icon-hash { | |
color: #3bb5e5 !important; | |
} | |
.main-content .loading-animation > div { | |
background-color: #c2c3c5; | |
} | |
.main-content header { | |
border-bottom: 1px solid #313338; | |
background-color: #36393e; | |
} | |
.button.join { | |
margin-left: 10px; | |
} | |
.messages-container { | |
border: none; | |
} | |
.messages-container .footer { | |
background-color: #36393e; | |
padding-top: 12px; | |
} | |
.messages-container .message-form .stream-info { | |
color: #888; | |
height: 23px; | |
} | |
.messages-container .message-form textarea { | |
background-color: #424449; | |
color: #bbb; | |
border: 2px solid #4a4c51; | |
border-right: none; | |
} | |
.messages-container .message-form textarea.editing { | |
background-color: #1a5066; | |
} | |
.messages-container .message-form > .message-input { | |
border: none; | |
} | |
.messages-container .message-form > .message-input > .file, | |
.messages-container .message-form > .message-input > .share-items > .message-buttons, | |
.messages-container .message-form > .message-input > .message-buttons { | |
background-color: #2e3136; | |
border: 1px solid #292c31; | |
color: #888; | |
height: auto; | |
} | |
.messages-container .message-form > .message-input > .file:hover, | |
.messages-container .message-form > .message-input > .share-items > .message-buttons:hover, | |
.messages-container .message-form > .message-input > .message-buttons:hover { | |
background-color: #292c31; | |
color: #949494; | |
} | |
.messages-container .message-form .users-typing { | |
background-color: transparent; | |
} | |
.flex-nav .content { | |
background-color: #2e3136; | |
} | |
.flex-nav .content h4 { | |
font-weight: 700; | |
margin-bottom: 15px; | |
} | |
.flex-nav footer { | |
background-color: #292c31; | |
} | |
.flex-nav header { | |
background-color: #292c31; | |
} | |
.side-nav .footer { | |
background-color: #292c31; | |
} | |
textarea, | |
select, | |
input[type='text'], | |
input[type='number'], | |
input[type='email'], | |
input[type='url'], | |
input[type='password'], | |
.flex-nav .input-line input[type='text'], | |
.flex-nav .input-line input[type='password'], | |
.flex-nav .input-line select { | |
background-color: #424449; | |
color: #bbb; | |
border: 1px solid transparent; | |
} | |
textarea:focus, | |
select:focus, | |
input[type='text']:focus, | |
input[type='number']:focus, | |
input[type='email']:focus, | |
input[type='url']:focus, | |
input[type='password']:focus, | |
.flex-nav .input-line input[type='text']:focus, | |
.flex-nav .input-line input[type='password']:focus, | |
.flex-nav .input-line select:focus { | |
border-color: #1a5066; | |
} | |
input[type="button"] { | |
border: none; | |
} | |
#rocket-chat { | |
background-color: #36393e; | |
} | |
.user-view .info .role-tag { | |
background-color: #7289da; | |
} | |
.message { | |
border-top: 1px solid #3e4045; | |
padding-top: 20px; | |
margin-top: 16px; | |
} | |
.message a { | |
color: #7289da; | |
} | |
.message a:hover { | |
color: #5873d3; | |
} | |
.message .user { | |
color: #fafafa; | |
} | |
.message .user:hover { | |
color: #fff; | |
} | |
.message .body { | |
color: #c2c3c5; | |
} | |
.message .info .is-bot, | |
.message .info .role-tag { | |
background-color: #7289da; | |
color: #fff; | |
} | |
.message .info .role-tag { | |
margin-right: 6px; | |
} | |
.message.sequential { | |
border-top: none; | |
padding-top: 0; | |
margin-top: 0; | |
} | |
.message.editing .body { | |
background-color: #1a5066; | |
color: #bacad1; | |
} | |
.message.system .body { | |
color: #9a9c9f; | |
} | |
.message:hover { | |
background-color: transparent; | |
} | |
.message .message-dropdown { | |
background-color: #2e3136; | |
} | |
.message .message-dropdown ul li { | |
color: #999; | |
} | |
.message .message-dropdown ul li:first-child { | |
background-color: #2e3136; | |
border-right-color: #292c31; | |
} | |
.message .message-dropdown ul li:hover { | |
background-color: #292c31; | |
} | |
.messages-box { | |
border-bottom: 1px solid #303337; | |
box-shadow: 0 1px 2px -1px #424449; | |
} | |
.messages-box .start { | |
color: #888; | |
text-transform: uppercase; | |
font-weight: 700; | |
font-size: 12px; | |
margin: 12px 0 13px 0; | |
} | |
.message.new-day { | |
padding-top: 50px; | |
border-top: none; | |
margin-top: 0; | |
} | |
.message.new-day:before { | |
color: #54565a; | |
background-color: #36393e; | |
top: 13px; | |
z-index: 2; | |
} | |
.message.new-day:after { | |
border-color: #3e4045; | |
top: 23px; | |
} | |
select { | |
cursor: pointer; | |
} | |
.flex-tab-bar { | |
border-left: 1px solid #313338; | |
box-shadow: -1px 0 2px -1px rgba(0,0,0,0.5); | |
} | |
.flex-tab-bar .tab-button:hover, | |
.flex-tab-bar .tab-button.active { | |
background-color: #202226; | |
} | |
.flex-tab-container .flex-tab { | |
background-color: #292c31; | |
} | |
.flex-tab-container .flex-tab .close-flex-tab > span { | |
background-color: transparent; | |
} | |
.flex-tab-container .flex-tab .close-flex-tab > span > i { | |
border: none; | |
color: #c2c3c5; | |
font-size: 15px; | |
transition: color 100ms ease-in-out; | |
} | |
.flex-tab-container .flex-tab .close-flex-tab > span > i:hover { | |
color: #fff; | |
} | |
.flex-tab-container .flex-tab .content { | |
background-color: #292c31; | |
box-shadow: -1px 0 3px 0 rgba(0,0,0,0.2); | |
} | |
.flex-tab-container .flex-tab .content > div { | |
background-color: #292c31; | |
} | |
.flex-tab-container .flex-tab .control { | |
background-color: transparent; | |
} | |
.flex-tab-container .flex-tab .message.new-day:before { | |
background-color: #292c31; | |
} | |
.flex-tab-container .flex-tab .day-divider { | |
color: #777; | |
background-color: #292c31; | |
} | |
.flex-tab-container .flex-tab .day-divider:before { | |
border-bottom-color: rgba(255,255,255,0.06); | |
} | |
.flex-tab-container .flex-tab .day-divider span { | |
background-color: #292c31; | |
} | |
.message .day-divider { | |
height: 40px; | |
} | |
.message .day-divider:before { | |
top: 20px; | |
} | |
blockquote:before { | |
background-color: #26282b; | |
} | |
.attachment .attachment-block .attachment-block-border { | |
background-color: #26282b; | |
} | |
.attachment .attachment-title > a { | |
text-transform: uppercase; | |
font-weight: 700; | |
font-size: 12px; | |
} | |
.attachment .attachment-download-icon { | |
background-color: #2e3136; | |
color: #888; | |
border-color: #2c2f33; | |
} | |
.attachment .attachment-download-icon:hover { | |
background-color: #292c31; | |
color: #949494; | |
border-color: #292c31; | |
} | |
.message a[class^="icon-"] { | |
color: #888; | |
} | |
.message a[class^="icon-"]:hover { | |
color: #949494; | |
} | |
.emoji-picker { | |
background-color: #2e3136; | |
} | |
.emoji-picker .emojis .emoji-list li:hover { | |
background-color: #7a7a7a; | |
} | |
.emoji-picker .filter > ul > li { | |
border-bottom-color: #2e3136; | |
} | |
.emoji-picker .filter > ul > li .category-link i { | |
color: #888; | |
} | |
.emoji-picker .filter > ul > li:hover { | |
border-bottom-color: #888; | |
} | |
.emoji-picker .filter > ul > li.active { | |
border-bottom-color: #3bb5e5; | |
} | |
.emoji-picker .filter > ul > li.active .category-link i { | |
color: #eee; | |
} | |
.emoji-picker .filter > ul > li.change-tone { | |
padding-right: 4px; | |
border-bottom-color: transparent; | |
} | |
.emoji-picker .filter > ul > li.change-tone .current-tone, | |
.emoji-picker .filter > ul > li.change-tone .tone-selector span { | |
width: 15px; | |
height: 15px; | |
} | |
.emoji-picker .filter > ul > li.change-tone .tone-selector { | |
background-color: #272a2e; | |
} | |
.input-line.search .icon-search, | |
.input-line.search .icon-right-open-small, | |
.input-line.search .icon-sort-alt-up, | |
.input-line.search .icon-lock, | |
.input-line.search .icon-comment { | |
color: #888; | |
} | |
.emoji-picker-icon { | |
color: #666; | |
} | |
code, | |
.code-colors { | |
background-color: #2e3136; | |
border-color: #2c2f33; | |
border-radius: 2px; | |
color: #c2c3c5; | |
font-weight: 400; | |
} | |
code.inline { | |
padding: 0.15em 0.5em; | |
} | |
pre { | |
display: block; | |
} | |
.list-view >.title .see-all { | |
text-decoration: none; | |
color: #888; | |
} | |
.list-view >.title .see-all:hover { | |
color: #fff; | |
} | |
.list-view .list { | |
color: #eee; | |
} | |
.list-view .list.lines { | |
margin-left: 15px; | |
} | |
.control, | |
.list input[type="text"].editing { | |
margin-bottom: 15px; | |
} | |
.list-view.uploaded-files-list a.file-name { | |
color: #7289da; | |
border-bottom-color: #42454a; | |
} | |
.list-view.uploaded-files-list a.file-name:hover { | |
color: #5873d3; | |
text-decoration: none; | |
} | |
.list-view.uploaded-files-list i { | |
color: #888; | |
} | |
.list-view.uploaded-files-list i.file-download:hover { | |
color: #7289da; | |
} | |
.load-more-loading { | |
margin-left: 15px; | |
} | |
.list-view .list.lines .load-more-loading { | |
margin-left: 0; | |
} | |
.side-nav .unread { | |
background-color: #387791; | |
border: none; | |
color: #fff; | |
} | |
.first-unread .body::before { | |
height: 1px; | |
margin-left: -20px; | |
background-color: transparent; | |
z-index: 1; | |
top: -1px; | |
} | |
.first-unread .body::after { | |
left: initial; | |
top: -8px; | |
right: 10px; | |
color: transparent; | |
background-color: transparent; | |
z-index: 2; | |
} | |
.first-unread.first-unread-opaque .body::before { | |
background-color: #387791; | |
} | |
.first-unread.first-unread-opaque .body::after, | |
.first-unread.first-unread-opaque:before { | |
color: #387791; | |
background-color: #36393e; | |
} | |
.first-unread.sequential.message { | |
padding-top: 0; | |
} | |
.new-day.first-unread .body::before { | |
top: 23px; | |
} | |
.new-day.first-unread .body::after { | |
top: 16px; | |
} | |
.container-bars .unread-bar { | |
background-color: #1a5066; | |
} | |
.message-popup, | |
.message-popup.search-results-list { | |
background-color: #2e3136; | |
color: #888; | |
} | |
.message-popup-title { | |
background-color: #2c2f33; | |
border-color: #292c31; | |
color: #acacac; | |
font-weight: 700; | |
} | |
.popup-item.selected { | |
color: #fff; | |
background-color: #1a5066; | |
} | |
.message-popup.search-results-list { | |
height: 100vh; | |
} | |
.toolbar-search__input { | |
padding: 2px 15px !important; | |
} | |
.toolbar-search__buttons i { | |
color: #888; | |
} | |
.toolbar-search__buttons i:hover { | |
color: #acacac; | |
} | |
.input-line > span, | |
.input-line > label, | |
.flex-nav .input-line label { | |
display: block; | |
margin-bottom: 7px; | |
} | |
.input.checkbox.toggle label:before { | |
background-color: #bc2031; | |
} | |
.input.checkbox.toggle label:hover:before { | |
background-color: #a91d2c; | |
} | |
.input.checkbox.toggle input:checked + label:before, | |
.flex-nav .input.checkbox.toggle input:checked + label:before { | |
background-color: #43b581; | |
} | |
.background-component-color, | |
.upload-progress-progress { | |
background-color: #1a5066; | |
color: #d1dce0; | |
} | |
.background-component-color button, | |
.upload-progress-progress button { | |
color: #d1dce0; | |
} | |
.background-component-color button:hover, | |
.upload-progress-progress button:hover { | |
color: #fff; | |
} | |
.background-primary-action-color { | |
background-color: #1a5066; | |
color: #d1dce0; | |
} | |
.sweet-alert { | |
background-color: #2e3136; | |
} | |
.sweet-alert p { | |
color: #888; | |
} | |
.sweet-alert h2 { | |
color: #fff; | |
} | |
.sweet-alert input { | |
border-color: #3e4045; | |
color: #888; | |
} | |
.sweet-alert input:focus { | |
border-color: #1a5066; | |
box-shadow: none; | |
color: #eee; | |
} | |
.sweet-alert .sa-icon.sa-success::before, | |
.sweet-alert .sa-icon.sa-success::after { | |
background-color: #2e3136; | |
} | |
.sweet-alert .sa-icon.sa-success .sa-fix { | |
background-color: #2e3136; | |
} | |
.alert-warning { | |
background-color: #faa61a; | |
border: none; | |
color: #7d530d; | |
} | |
input[readonly], | |
input[disabled], | |
textarea[readonly], | |
textarea[disabled], | |
select[disabled] { | |
background-color: #303337 !important; | |
} | |
::-webkit-input-placeholder { | |
color: #888 !important; | |
} | |
:-moz-placeholder { | |
color: #888 !important; | |
} | |
::-moz-placeholder { | |
color: #888 !important; | |
} | |
:-ms-input-placeholder { | |
color: #888 !important; | |
} | |
.CodeMirror-scrollbar-filler, | |
.CodeMirror-gutter-filler { | |
background-color: rgba(0,0,0,0.05) !important; | |
} | |
::-webkit-scrollbar-thumb { | |
background-color: #2e3136; | |
} | |
.-autocomplete-container, | |
.flex-nav .-autocomplete-container { | |
background-color: #2e3136; | |
border-color: #292c31; | |
border-radius: 3px; | |
overflow: auto; | |
} | |
.-autocomplete-item, | |
.flex-nav .-autocomplete-item { | |
border-color: #292c31; | |
} | |
.-autocomplete-item.selected, | |
.flex-nav .-autocomplete-item.selected { | |
background-color: #1a5066; | |
} | |
.full-page { | |
background-color: #36393e; | |
background-image: none; | |
} | |
.login-terms { | |
color: #c2c3c5; | |
} | |
#login-card { | |
background-color: #2e3136; | |
color: #888; | |
} | |
#login-card .input-line label { | |
margin-left: 0; | |
} | |
#login-card .input-line input, | |
#login-card .input-line select { | |
border-color: #3e4146; | |
color: #888; | |
padding-left: 0; | |
padding-right: 0; | |
} | |
#login-card .input-line input.error, | |
#login-card .input-line select.error { | |
border-color: #bc2031; | |
} | |
#login-card .input-line .input-error { | |
color: #bc2031; | |
padding: 0; | |
margin-top: 7px; | |
} | |
#login-card .submit:hover, | |
#login-card .register:hover, | |
#login-card .forgot-password:hover, | |
#login-card .back-to-login:hover { | |
color: #eee; | |
} | |
.register-link-replacement { | |
margin-top: 15px; | |
} | |
.hljs-keyword, | |
.css .rule .hljs-keyword, | |
.hljs-winutils, | |
.javascript .hljs-title, | |
.nginx .hljs-title, | |
.hljs-subst, | |
.hljs-request, | |
.hljs-status { | |
color: #abb2bf; | |
} | |
.settings-description { | |
color: #c2c3c5; | |
} | |
.logoutOthers, | |
.select-service { | |
margin-top: 15px; | |
} | |
.avatar-suggestion-item, | |
.page-static .content .section .section-content, | |
.page-settings .content .section { | |
border-color: #2c2f33; | |
background-color: #2e3136; | |
color: #aaa; | |
} | |
.avatar-suggestion-item .avatar, | |
.page-static .content .section .section-content .avatar, | |
.page-settings .content .section .avatar { | |
background-color: #272a2e; | |
} | |
.permissions-manager .permission-grid tbody tr, | |
.statistics-table tr, | |
.page-list .list table tbody tr { | |
background-color: #373b41 !important; | |
} | |
.permissions-manager .permission-grid tbody tr th, | |
.statistics-table tr th, | |
.page-list .list table tbody tr th { | |
border: none; | |
background-color: transparent !important; | |
color: #c2c3c5; | |
font-weight: 400; | |
} | |
.permissions-manager .permission-grid tbody tr td, | |
.statistics-table tr td, | |
.page-list .list table tbody tr td { | |
border: none; | |
padding: 10px; | |
background-color: transparent !important; | |
color: #c2c3c5; | |
} | |
.permissions-manager .permission-grid tbody tr:nth-of-type(even), | |
.statistics-table tr:nth-of-type(even), | |
.page-list .list table tbody tr:nth-of-type(even) { | |
background-color: #2c2f33 !important; | |
} | |
.permissions-manager .permission-grid tbody tr:hover, | |
.statistics-table tr:hover, | |
.page-list .list table tbody tr:hover { | |
background-color: #1a5066 !important; | |
} | |
.permissions-manager .permission-grid, | |
.statistics-table, | |
.page-list .list table { | |
background-color: #292c31; | |
border: 1px solid #292c31; | |
} | |
.permissions-manager .permission-grid thead, | |
.statistics-table thead, | |
.page-list .list table thead { | |
font-weight: 700; | |
padding: 10px; | |
} | |
.permissions-manager .permission-grid thead .icon-edit, | |
.statistics-table thead .icon-edit, | |
.page-list .list table thead .icon-edit { | |
display: none; | |
} | |
.permissions-manager .permission-grid thead a, | |
.statistics-table thead a, | |
.page-list .list table thead a { | |
color: #c2c3c5; | |
} | |
.permissions-manager .permission-grid thead tr, | |
.statistics-table thead tr, | |
.page-list .list table thead tr { | |
background-color: #292c31; | |
} | |
.permissions-manager .permission-grid thead td, | |
.statistics-table thead td, | |
.page-list .list table thead td, | |
.permissions-manager .permission-grid thead th, | |
.statistics-table thead th, | |
.page-list .list table thead th { | |
border: none; | |
padding: 10px; | |
background-color: transparent; | |
} | |
.permissions-manager .form-role .form-buttons { | |
margin-top: 15px; | |
padding: 0; | |
} | |
.permissions-manager .form-role label { | |
width: 88px; | |
text-align: left; | |
} | |
.permissions-manager h2 { | |
border: none; | |
} | |
form.inline input[type='text'], | |
form.inline input[type='number'], | |
form.inline input[type='email'], | |
form.inline input[type='url'], | |
form.inline input[type='password'], | |
form.inline input[type='time'], | |
form.inline select { | |
margin-top: 10px; | |
width: 194px; | |
} | |
.page-list .results { | |
border: none; | |
color: #c2c3c5; | |
margin-bottom: 0; | |
padding: 20px 0; | |
} | |
.page-list .list .user-image { | |
background-color: transparent; | |
margin: 0; | |
margin-left: 15px; | |
} | |
.page-list .list .user-image .avatar:after { | |
left: -16px; | |
} | |
.page-settings a { | |
color: #7289da; | |
} | |
.page-settings a:hover { | |
color: #5873d3; | |
} | |
.page-settings .content .section h1 { | |
margin: 0; | |
padding: 0; | |
color: #eee; | |
} | |
.page-settings .start-import { | |
margin-top: 15px; | |
} | |
.page-settings .content { | |
background-color: #36393e; | |
} | |
.page-settings .settings-file-preview .preview.no-file { | |
background-color: #272a2e; | |
margin-right: 15px; | |
} | |
.page-settings .section { | |
margin-left: 0; | |
margin-right: 0; | |
margin-top: 0; | |
margin-bottom: 20px; | |
} | |
.page-settings .section .section-title .section-title-text { | |
color: #eee; | |
} | |
.page-settings .section .section-content { | |
background-color: transparent; | |
} | |
.page-settings .section .section-content .input-line { | |
border-color: #3e4045; | |
} | |
.page-settings .section .section-content .input-line input { | |
background-color: #424449; | |
color: #bbb; | |
border: none; | |
} | |
.page-settings .section .section-content .input-line > label { | |
color: #aaa; | |
} | |
.code-mirror-box .CodeMirror, | |
.code-mirror-box.code-mirror-box-fullscreen .title { | |
border-color: #292c31; | |
} | |
.code-mirror-box .buttons { | |
border-color: #292c31; | |
background-color: #292c31; | |
} | |
.minicolors-theme-rocketchat .minicolors-swatch { | |
background-color: #292c31; | |
top: 0; | |
left: 0; | |
height: 35px; | |
border: none; | |
} | |
.admin-integrations-new-panel .admin-integrations-new-item { | |
color: #c2c3c5; | |
border-color: #42454a; | |
} | |
.admin-integrations-new-panel .admin-integrations-new-item:hover { | |
background-color: #292c31; | |
} | |
.page-container { | |
background-color: transparent; | |
} | |
.page-container .content { | |
padding: 25px 25px; | |
} | |
.page-container h3 { | |
margin-bottom: 10px; | |
} | |
.pending-background { | |
background-color: #fbc05e; | |
border-color: #fbb747; | |
color: #7f5f2a; | |
} | |
.pending-background > .icon-attention { | |
color: #7f5f2a; | |
} | |
.range-slider-range { | |
background-color: #3a3d42; | |
border-color: #3a3d42; | |
} | |
.range-slider-range::-webkit-slider-thumb { | |
background-color: #1a5066; | |
} | |
.range-slider-range::-webkit-slider-thumb:hover, | |
.range-slider-range::-webkit-slider-thumb:active { | |
background-color: #17485c; | |
} | |
.range-slider-range::-moz-range-thumb { | |
background-color: #1a5066; | |
} | |
.range-slider-range::-moz-range-thumb:hover, | |
.range-slider-range::-moz-range-thumb:active { | |
background-color: #17485c; | |
} | |
.range-slider-value { | |
background-color: #1a5066; | |
} | |
.range-slider-value:after { | |
border-right-color: #1a5066; | |
} | |
.cm-s-default.CodeMirror { | |
background: #151515; | |
color: #e0e0e0; | |
} | |
.cm-s-default div.CodeMirror-selected { | |
background: #303030; | |
} | |
.cm-s-default .CodeMirror-line::-moz-selection, | |
.cm-s-default .CodeMirror-line > span::-moz-selection, | |
.cm-s-default .CodeMirror-line > span > span::-moz-selection { | |
background: rgba(48,48,48,0.99); | |
} | |
.cm-s-default .CodeMirror-line::selection, | |
.cm-s-default .CodeMirror-line > span::selection, | |
.cm-s-default .CodeMirror-line > span > span::selection { | |
background: rgba(48,48,48,0.99); | |
} | |
.cm-s-default .CodeMirror-line::-moz-selection, | |
.cm-s-default .CodeMirror-line > span::-moz-selection, | |
.cm-s-default .CodeMirror-line > span > span::-moz-selection { | |
background: rgba(48,48,48,0.99); | |
} | |
.cm-s-default .CodeMirror-gutters { | |
background: #151515; | |
border-right: 0px; | |
} | |
.cm-s-default .CodeMirror-guttermarker { | |
color: #ac4142; | |
} | |
.cm-s-default .CodeMirror-guttermarker-subtle { | |
color: #505050; | |
} | |
.cm-s-default .CodeMirror-linenumber { | |
color: #505050; | |
} | |
.cm-s-default .CodeMirror-cursor { | |
border-left: 1px solid #b0b0b0 !important; | |
} | |
.cm-s-default span.cm-comment { | |
color: #8f5536; | |
} | |
.cm-s-default span.cm-atom { | |
color: #aa759f; | |
} | |
.cm-s-default span.cm-number { | |
color: #aa759f; | |
} | |
.cm-s-default span.cm-property, | |
.cm-s-default span.cm-attribute { | |
color: #90a959; | |
} | |
.cm-s-default span.cm-keyword { | |
color: #ac4142; | |
} | |
.cm-s-default span.cm-string { | |
color: #f4bf75; | |
} | |
.cm-s-default span.cm-variable { | |
color: #90a959; | |
} | |
.cm-s-default span.cm-variable-2 { | |
color: #6a9fb5; | |
} | |
.cm-s-default span.cm-def { | |
color: #d28445; | |
} | |
.cm-s-default span.cm-bracket { | |
color: #e0e0e0; | |
} | |
.cm-s-default span.cm-tag { | |
color: #ac4142; | |
} | |
.cm-s-default span.cm-link { | |
color: #aa759f; | |
} | |
.cm-s-default span.cm-error { | |
background: #ac4142; | |
color: #b0b0b0; | |
} | |
.cm-s-default .CodeMirror-activeline-background { | |
background: #202020; | |
} | |
.cm-s-default .CodeMirror-matchingbracket { | |
text-decoration: underline; | |
color: #fff !important; | |
} | |
.cm-s-default span.cm-qualifier { | |
color: #d28445; | |
} | |
#code-mirror-textarea, | |
.cm-s-default.CodeMirror, | |
.cm-s-default .CodeMirror-gutters { | |
background: #25272b; | |
} | |
.hljs, | |
.code-colors.hljs { | |
display: block; | |
overflow-x: auto; | |
padding: 0.5em; | |
color: #abb2bf; | |
background: #282c34; | |
} | |
.hljs .hljs-comment, | |
.hljs .hljs-quote { | |
color: #5c6370; | |
font-style: italic; | |
} | |
.hljs .hljs-doctag, | |
.hljs .hljs-keyword, | |
.hljs .hljs-formula { | |
color: #c678dd; | |
} | |
.hljs .hljs-section, | |
.hljs .hljs-name, | |
.hljs .hljs-selector-tag, | |
.hljs .hljs-deletion, | |
.hljs .hljs-subst { | |
color: #e06c75; | |
} | |
.hljs .hljs-literal { | |
color: #56b6c2; | |
} | |
.hljs .hljs-string, | |
.hljs .hljs-regexp, | |
.hljs .hljs-addition, | |
.hljs .hljs-attribute, | |
.hljs .hljs-meta-string { | |
color: #98c379; | |
} | |
.hljs .hljs-built_in, | |
.hljs .hljs-class .hljs-title { | |
color: #e6c07b; | |
} | |
.hljs .hljs-attr, | |
.hljs .hljs-variable, | |
.hljs .hljs-template-variable, | |
.hljs .hljs-type, | |
.hljs .hljs-selector-class, | |
.hljs .hljs-selector-attr, | |
.hljs .hljs-selector-pseudo, | |
.hljs .hljs-number { | |
color: #d19a66; | |
} | |
.hljs .hljs-symbol, | |
.hljs .hljs-bullet, | |
.hljs .hljs-link, | |
.hljs .hljs-meta, | |
.hljs .hljs-selector-id, | |
.hljs .hljs-title { | |
color: #61aeee; | |
} | |
.hljs .hljs-emphasis { | |
font-style: italic; | |
} | |
.hljs .hljs-strong { | |
font-weight: bold; | |
} | |
.hljs .hljs-link { | |
text-decoration: underline; | |
} | |
@-moz-keyframes highlight { | |
0% { | |
background: #1a5066; | |
} | |
100% { | |
background: none; | |
} | |
} | |
@-webkit-keyframes highlight { | |
0% { | |
background: #1a5066; | |
} | |
100% { | |
background: none; | |
} | |
} | |
@-o-keyframes highlight { | |
0% { | |
background: #1a5066; | |
} | |
100% { | |
background: none; | |
} | |
} | |
@keyframes highlight { | |
0% { | |
background: #1a5066; | |
} | |
100% { | |
background: none; | |
} | |
} | |
li.message ul.reactions li.selected { | |
background: rgba(255,255,255,0.5); | |
border: 0; | |
} | |
.message .reactions>li .reaction-count { | |
color: #9c27b0; | |
} | |
div.rc-message-box__typing b { | |
color: #c2c3c5; | |
} | |
.body { | |
font-size: 16px; | |
} | |
label.rc-message-box__container { | |
background-color: hsla(218,5%,47%,.3); | |
border: 0; | |
border-radius: 5px; | |
} | |
.emojione { | |
image-rendering: auto !important; | |
} | |
` | |
; | |
if (typeof GM_addStyle != "undefined") { | |
GM_addStyle(css); | |
} else if (typeof PRO_addStyle != "undefined") { | |
PRO_addStyle(css); | |
} else if (typeof addStyle != "undefined") { | |
addStyle(css); | |
} else { | |
var node = document.createElement("style"); | |
node.type = "text/css"; | |
node.appendChild(document.createTextNode(css)); | |
var heads = document.getElementsByTagName("head"); | |
if (heads.length > 0) { | |
heads[0].appendChild(node); | |
} else { | |
// no head yet, stick it whereever | |
document.documentElement.appendChild(node); | |
} | |
} | |
}; | |
window.addEventListener('load', css()); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment