1039 lines
28 KiB
CSS
1039 lines
28 KiB
CSS
/* Modified by Orien Vandenbergh (https://github.com/nichus)
|
|
*
|
|
* Modifications carry the same license as the original work
|
|
*/
|
|
|
|
/*
|
|
Copyright 2017 Bryan Keller (https://github.com/widget-)
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
*/
|
|
|
|
:root {
|
|
/* Modify these to change your theme colors: */
|
|
--text: #c3c4c5;
|
|
--background: #23272a;
|
|
--background-elevated: #2c2f33;
|
|
--background-content: #36393e;
|
|
--attention: #d98719;
|
|
--primary: var(--attention);
|
|
|
|
/* These should be less important: */
|
|
--background-hover: rgba(255, 255, 255, 0.1);
|
|
--background-light: #AAA;
|
|
--background-bright: #FFF;
|
|
|
|
--border-dim: #666;
|
|
--border-bright: #aaa;
|
|
|
|
--text-bright: #FFF;
|
|
--text-special: #08C;
|
|
|
|
--scrollbar-background: #000;
|
|
--scrollbar-border: var(--primary);
|
|
}
|
|
|
|
h1, h2, h3, h4 {
|
|
color: var(--text);
|
|
}
|
|
|
|
.popover_mask {
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
/* Team Picker */
|
|
.TeamSidebar, .TeamSidebar .StoplightContainer, .TeamSidebar .TeamSidebar-addArea {
|
|
background-color: var(--background) !important;
|
|
box-shadow: var(--background) 1px 1px 25px;
|
|
color: var(--text);
|
|
z-index: 1;
|
|
}
|
|
|
|
|
|
/* Channel selector */
|
|
/*.TeamSidebar, .TeamSidebar .StoplightContainer, .TeamSidebar .TeamSidebar-addArea {*/
|
|
/*nav.p-channel_sidebar {*/
|
|
div.client_channels_list_container {
|
|
background-color: var(--background-elevated) !important;
|
|
box-shadow: var(--background-elevated) 1px 1px 25px;
|
|
color: var(--text);
|
|
z-index: 1;
|
|
}
|
|
|
|
nav.p-channel_sidebar {
|
|
background-color: var(--background-elevated);
|
|
color: var(--text);
|
|
}
|
|
|
|
#team_menu,
|
|
body:not(.loading) #team_menu:hover,
|
|
body:not(.loading) #team_menu:active {
|
|
background-color: var(--background-elevated) !important;
|
|
}
|
|
|
|
.p-channel_sidebar__channel,
|
|
.p-channel_sidebar__link,
|
|
.p-channel_sidebar__channel:link,
|
|
.p-channel_sidebar__link:link,
|
|
.p-channel_sidebar__channel:visited,
|
|
.p-channel_sidebar__link:visited,
|
|
.p-channel_sidebar__channel:hover,
|
|
.p-channel_sidebar__link:hover {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
/* Channel with unread messages */
|
|
.p-channel_sidebar__channel--unread:not(.p-channel_sidebar__channel--muted):not(.p-channel_sidebar__channel--selected) .p-channel_sidebar__name,
|
|
.p-channel_sidebar__link--unread:not(.p-channel_sidebar__link--selected) .p-channel_sidebar__name,
|
|
.p-channel_sidebar__link--invites:not(.p-channel_sidebar__link--dim) .p-channel_sidebar__name,
|
|
.p-channel_sidebar__section_heading_label--clickable:hover,
|
|
.p-channel_sidebar__quickswitcher:hover {
|
|
color: var(--text-bright) !important;
|
|
}
|
|
|
|
/*broken*/
|
|
__TODO-highlight-indicator {
|
|
background-color: var(--border-bright) !important;
|
|
opacity: 1;
|
|
}
|
|
|
|
#msgs_scroller_div::-webkit-scrollbar-track, .client_container,
|
|
#search_terms, #footer, .channel_header, ts-jumper ts-jumper-container,
|
|
ts-jumper input[type="text"],
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #col_channels:hover #channels_scroller::-webkit-scrollbar-track,
|
|
#channel_header_info, #channel_topic_text, #channel_topic_text code, #edit_topic_inner:before {
|
|
background: var(--background) !important;
|
|
}
|
|
|
|
ts-message, .client_container {
|
|
background: var(--background-content) !important;
|
|
}
|
|
|
|
.channel_header, #col_messages, #footer {
|
|
box-shadow: none;
|
|
}
|
|
|
|
/* channel list */
|
|
.p-channel_sidebar__channel,
|
|
.p-channel_sidebar__link {
|
|
/* border-radius: 0 15px 15px 0; orien */
|
|
height: 24px !important;
|
|
}
|
|
|
|
.p-channel_sidebar__channel a {
|
|
color: var(--text);
|
|
}
|
|
|
|
.p-channel_sidebar__static_list div {
|
|
margin-right: 2px;
|
|
height: 24px !important;
|
|
}
|
|
|
|
.p-channel_sidebar__channel--selected,
|
|
.p-channel_sidebar__link--selected,
|
|
.p-channel_sidebar__channel--selected:link,
|
|
.p-channel_sidebar__link--selected:link,
|
|
.p-channel_sidebar__channel--selected:visited,
|
|
.p-channel_sidebar__link--selected:visited,
|
|
.p-channel_sidebar__channel--selected:hover,
|
|
.p-channel_sidebar__link--selected:hover {
|
|
background-color: var(--background) !important;
|
|
border: solid var(--border-bright);
|
|
border-width: 1px 1px 1px 0;
|
|
font-weight: bold !important;
|
|
}
|
|
|
|
.p-channel_sidebar__channel:hover,
|
|
.p-channel_sidebar__link:hover{
|
|
background-color: var(--background-hover) !important;
|
|
border-color: transparent;
|
|
color: var(--text) !important;
|
|
height: 24px !important;
|
|
}
|
|
|
|
.p-channel_sidebar__close_container {
|
|
background: none !important;
|
|
}
|
|
|
|
.p-channel_sidebar__channel--selected:hover,
|
|
.p-channel_sidebar__link--selected:hover {
|
|
border: solid var(--border-dim);
|
|
border-width: 1px 1px 1px 0;
|
|
}
|
|
|
|
/*broken*/
|
|
li.active[class] span,
|
|
#channels_scroller.show_which_channel_is_active[class] ul li.active .primary_action .prefix,
|
|
#channels_scroller.show_which_channel_is_active[class] ul li.active .primary_action,
|
|
#channels_scroller.show_which_channel_is_active[class] ul li.active .primary_action.im_name > *:not(.unread_highlights) {
|
|
color: var(--text-special) !important;
|
|
background-color: transparent;
|
|
opacity: 1;
|
|
}
|
|
|
|
/*"more unreads" bottom*/
|
|
.p-channel_sidebar__banner--top {
|
|
background-color: var(--background);
|
|
border: 1px solid var(--border-bright);
|
|
border-top: none;
|
|
/* border-radius: 0 0 15px 15px; orien */
|
|
}
|
|
|
|
/*"more unreads" bottom */
|
|
.p-channel_sidebar__banner--bottom {
|
|
background-color: var(--background);
|
|
border: 1px solid var(--border-bright);
|
|
border-bottom: none;
|
|
/* border-radius: 15px 15px 0 0; orien */
|
|
}
|
|
|
|
/*"unread mentions"*/
|
|
.p-channel_sidebar__badge,
|
|
.p-channel_sidebar__banner--mentions {
|
|
/*inverted because important*/
|
|
background-color: var(--border-bright) !important;
|
|
border-color: var(--text-bright);
|
|
color: var(--text-bright);
|
|
}
|
|
|
|
/*also add border to unread count for individual channels*/
|
|
.p-channel_sidebar__badge {
|
|
border: 1px solid;
|
|
}
|
|
|
|
/* new scrollbar */
|
|
.p-channel_sidebar div.c-custom_scrollbar__thumb_vertical, .p-channel_sidebar div.c-scrollbar__bar {
|
|
background: var(--background-elevated);
|
|
border: 1px solid var(--scrollbar-border);
|
|
}
|
|
|
|
#channels_scroller.show_which_channel_is_active[class] li.active .presence.active i.presence_icon,
|
|
#channels_scroller.show_which_channel_is_active[class] li.active .slackbot_icon,
|
|
#channels_scroller.show_which_channel_is_active[class] li.active .presence.away i.presence_icon {
|
|
color: inherit !important;
|
|
}
|
|
|
|
#client_body::before, #client_body:not(.onboarding):before {
|
|
border-bottom: 1px solid var(--border-dim) !important;
|
|
background: var(--background-content);
|
|
box-shadow: none;
|
|
}
|
|
|
|
#client_body, #messages_container.has_top_messages_banner:before {
|
|
background: var(--background-content) !important;
|
|
font-family: Whitney, "Helvetica Neue", "Trebuchet MS", Helvetica, Arial, sans-serif;
|
|
font-weight: medium !important;
|
|
}
|
|
|
|
ts-message, .channel_title .channel_name, ts-jumper input[type="text"],
|
|
ts-jumper ol li .member_real_name, ts-jumper ol li .view_name, ts-jumper ol li .channel_name {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
.light_theme ts-message .message_content a.message_sender, #msg_input::-webkit-input-placeholder,
|
|
ts-jumper input[type="text"]::-webkit-input-placeholder {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
#msg_input, #primary_file_button {
|
|
background: transparent !important;
|
|
color: var(--text) !important;
|
|
border-color: var(--border-dim) !important;
|
|
}
|
|
|
|
.day_divider .day_divider_label,
|
|
#convo_container .convo_flexpane_divider .reply_count {
|
|
color: var(--text) !important;
|
|
background-color: var(--background-content) !important;
|
|
border: 1px solid var(--border-bright) !important;
|
|
border-radius: 1rem;
|
|
}
|
|
|
|
.mention_day_container_div .day_divider .day_divider_label {
|
|
border: 1px solid var(--border-dim) !important;
|
|
}
|
|
|
|
#convo_container .convo_flexpane_divider .reply_count {
|
|
border-radius: 10px;
|
|
padding: 0px 10px;
|
|
}
|
|
|
|
.mention_day_container_div .day_divider:before {
|
|
background-color: transparent !important;
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
.day_container .day_msgs {
|
|
border-top: 1px solid var(--border-bright) !important;
|
|
padding-right: 10px;
|
|
padding-left: 2px;
|
|
}
|
|
|
|
textarea, input[type="text"], #file_comment_textarea {
|
|
background-color: var(--background-content) !important;
|
|
border-color: var(--border-dim) !important;
|
|
color: var(--text) !important;
|
|
}
|
|
textarea:focus, input[type="text"]:focus, #file_comment_textarea {
|
|
border-color: var(--border-bright) !important;
|
|
color: var(--text-bright) !important;
|
|
}
|
|
|
|
/* orien */
|
|
ts-message {
|
|
border-radius: 5px;
|
|
margin: 1px 5px !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.msg_inline_attachment_column.column_border {
|
|
background-color: var(--border-dim);
|
|
}
|
|
|
|
ts-message:hover {
|
|
background: var(--background-hover) !important;
|
|
}
|
|
|
|
#messages_container::after {
|
|
background: none !important;
|
|
}
|
|
|
|
.bot_label {
|
|
padding: 0 4px !important;
|
|
border-radius: 3px !important;
|
|
background: var(--background-content) !important;
|
|
border: 1px solid var(--border-bright);
|
|
}
|
|
|
|
|
|
.file_container:after{
|
|
background-image: -webkit-linear-gradient(top,rgba(255,255,255,0) 0,#333 100%) !important;
|
|
}
|
|
|
|
.rxn,
|
|
#col_channels,
|
|
#col_channels_footer,
|
|
ts-message .action_hover_container .btn_msg_action,
|
|
.file_container,
|
|
.file_container .CodeMirror .CodeMirror-code>div:before, .file_container .CodeMirror .sssh-line:before, .file_container .sssh-code .CodeMirror-code>div:before, .file_container .sssh-code .sssh-line:before,
|
|
#col_flex,
|
|
.search_message_result,
|
|
.search_result_with_extract,
|
|
#search_filters a,
|
|
.menu,
|
|
.menu #menu_items_scroller,
|
|
.btn, .btn_outline {
|
|
background: var(--background-content) !important;
|
|
}
|
|
|
|
/* orien attachment */
|
|
.attachment_group .media_caret {
|
|
color: var(--border-dim);
|
|
}
|
|
|
|
#flex_contents .heading,
|
|
#flex_contents .heading a,
|
|
#flex_contents .heading_text,
|
|
#flex_contents .subheading {
|
|
background: var(--background-content) !important;
|
|
color: var(--text) !important;
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
pre,
|
|
ts-message .action_hover_container .btn_msg_action,
|
|
.file_container .CodeMirror .CodeMirror-code>div pre, .file_container .CodeMirror .CodeMirror-code>div, .file_container .CodeMirror .sssh-line pre, .file_container .sssh-code .CodeMirror-code>div pre, .file_container .sssh-code .CodeMirror-code>div, .file_container .sssh-code .sssh-line pre,
|
|
.search_message_result .search_message_result_meta a,
|
|
.search_message_result .search_message_result_meta .date_links a,
|
|
.flexpane_redesign #flex_contents .heading_text,
|
|
#flex_contents .subheading,
|
|
#search_filters.files #filter_files, #search_filters.messages #filter_messages,
|
|
.menu ul li a,
|
|
.btn, .btn_outline, .menu {
|
|
color: var(--text) !important;
|
|
border-color: var(--border-dim) !important;
|
|
background-color: var(--background);
|
|
}
|
|
|
|
.btn:hover:after {
|
|
border-color: var(--border-bright);
|
|
}
|
|
|
|
.action_hover_container {
|
|
border: 1px solid var(--border-dim) !important;
|
|
}
|
|
.ts_tip_float.btn_msg_action:not(:last-child) {
|
|
border-right: 1px solid var(--border-dim) !important;
|
|
}
|
|
.ts_tip_float.btn_msg_action:hover {
|
|
background-color: var(--background-content) !important;
|
|
}
|
|
|
|
#quick_switcher_btn{
|
|
/*border-top-color: #333 !important;*/
|
|
background-color: transparent;
|
|
|
|
}
|
|
|
|
.rxn,
|
|
.search_result_with_extract,
|
|
.flexbox_client.flexpane_redesign.flex_pane_showing #col_flex,
|
|
.flexpane_redesign #flex_contents .heading,
|
|
#flex_contents .subheading,
|
|
.search_segmented_control,
|
|
.menu{
|
|
border-color: var(--border-dim) !important;
|
|
}
|
|
|
|
.search_result_with_extract {
|
|
box-shadow: 0 1px 10px var(--background-elevated) !important;
|
|
}
|
|
|
|
.ql-placeholder {
|
|
color: var(--text);
|
|
}
|
|
|
|
.ql-container.texty_single_line_input {
|
|
background-color: var(--background-elevated);
|
|
color: var(--text);
|
|
}
|
|
|
|
.ql-container .ql-editor p {
|
|
color: var(--text);
|
|
}
|
|
|
|
#quick_switcher_btn:active, #quick_switcher_btn:focus, #quick_switcher_btn:hover {
|
|
background-color: var(--background-elevated);
|
|
border-color: var(--background-elevated);
|
|
}
|
|
|
|
.feature_name_tagging_client ts-message .mention, ts-message .mention,
|
|
span.match {
|
|
border: 1px solid var(--attention) !important;
|
|
background-color: var(--background-elevated) !important;
|
|
font-weight: bold;
|
|
/*
|
|
padding: 2px 4px;
|
|
margin: 2px;
|
|
border-radius: 10px;
|
|
orien
|
|
*/
|
|
}
|
|
|
|
.mention > .mention {
|
|
/* I'm assuming this is a Slack bug */
|
|
border: none;
|
|
}
|
|
|
|
.mention_rxn {
|
|
border-radius: 5px;
|
|
margin: 1px 5px;
|
|
}
|
|
|
|
.mention_rxn .mention_rxn_summary .app_preview_link,
|
|
.mention_rxn .mention_rxn_summary .member_preview_link,
|
|
.mention_rxn .mention_rxn_summary .mention_rxn_summary_members {
|
|
color: var(--text);
|
|
}
|
|
|
|
#member_mentions h3 a {
|
|
color: var(--text-special);
|
|
}
|
|
|
|
pre.special_formatting{
|
|
background: var(--background-elevated) !important;
|
|
}
|
|
|
|
code {
|
|
color: var(--text-special) !important;
|
|
background-color: var(--background-elevated) !important;
|
|
border-color: var(--border-dim) !important;
|
|
}
|
|
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #archive_msgs_scroller_div::-webkit-scrollbar-thumb,
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #msgs_scroller_div::-webkit-scrollbar-thumb,
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #col_channels:hover #channels_scroller::-webkit-scrollbar-thumb {
|
|
/* scrollbar draggy bit */
|
|
color: transparent !important;
|
|
border: 1px solid var(--scrollbar-border) !important;
|
|
background-color: transparent !important;
|
|
}
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #archive_msgs_scroller_div::-webkit-scrollbar-track,
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #msgs_scroller_div::-webkit-scrollbar-track,
|
|
.supports_custom_scrollbar:not(.slim_scrollbar) #col_channels:hover #channels_scroller::-webkit-scrollbar-track {
|
|
/* scrollbar endcaps */
|
|
color: transparent !important;
|
|
border: 1px solid var(--border-dim) !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
a, a:link, a:visited{
|
|
color: var(--text-special);
|
|
}
|
|
ts-message a .mention{
|
|
color: var(--text-special) !important;
|
|
}
|
|
a:hover{
|
|
color: var(--text-special) !important;
|
|
}
|
|
|
|
#msgs_scroller_div #end_display_div p {
|
|
color: var(--text);
|
|
}
|
|
|
|
.channels_list_holder ul li a.channel_name,
|
|
.channels_list_holder ul li:not(.unread) .group_name,
|
|
.channels_list_holder ul li .im_name,
|
|
.channels_list_holder ul li .mpim_name,
|
|
.channels_list_holder ul li>a:link,
|
|
ts-message a.timestamp{
|
|
color: #aaa !important;
|
|
}
|
|
#channels_scroller.show_which_channel_is_active ul li.active .im_name{
|
|
color: #fff !important;
|
|
}
|
|
|
|
/* orien divider */
|
|
#msgs_div .unread_divider hr {
|
|
border-color: var(--attention); /* default is #f26130 */
|
|
}
|
|
#msgs_div .unread_divider .divider_label
|
|
{
|
|
background: var(--background);
|
|
padding: 4px 4px;
|
|
border-radius: 0px;
|
|
border: 1px solid var(--attention);
|
|
margin: -1px 11px -13px 0px;
|
|
}
|
|
|
|
#msgs_div .unread_divider.no_unreads .divider_label
|
|
{
|
|
background: var(--background-elevated);
|
|
color: #aaa !important;
|
|
border: none;
|
|
margin-top: 0px;
|
|
}
|
|
|
|
#msgs_div .unread_divider.no_unreads hr{
|
|
border-top-color: #888 !important;
|
|
}
|
|
|
|
.flexpane_redesign #member_mentions {
|
|
background-color: var(--background-content);
|
|
}
|
|
|
|
#details_tab .channel_page_section {
|
|
background-color: var(--background-elevated);
|
|
}
|
|
|
|
#details_tab .channel_page_section .section_title {
|
|
color: var(--text);
|
|
}
|
|
|
|
.greigh {
|
|
/* greigh = label?? */
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
.pinned_item .pin_member_name a, .pinned_item {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
.pinned_item .pinned_message_text .pin_truncate_fade {
|
|
background: -webkit-gradient(linear,left bottom,left top,color-stop(0,var(--background-elevated)),color-stop(1,rgba(255,255,255,0)));
|
|
}
|
|
|
|
.tab_container .file_list_item .contents .member, .tab_container .file_list_item .contents .service_link, .tab_container .file_list_item .contents .share_info, .tab_container .file_list_item .contents .time {
|
|
color: var(--text-special);
|
|
}
|
|
|
|
.tab_container .file_list_item:focus, .tab_container .file_list_item:hover {
|
|
background-color: var(--background-hover);
|
|
}
|
|
|
|
/* files */
|
|
.file_container.generic_container .file_header_meta .meta_hover {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
.file_preview_action.btn.ts_tip, .file_preview_link.btn.file_comment_link {
|
|
border: 1px solid var(--border-bright) !important;
|
|
background-color: var(--background-hover) !important;
|
|
color: var(--text) !important;
|
|
}
|
|
.file_preview_action.btn.ts_tip:hover, .file_preview_link.btn.file_comment_link:hover {
|
|
background-color: var(--background-content) !important;
|
|
}
|
|
|
|
/* user profile popup */
|
|
#member_preview_scroller, #member_preview_web_container,
|
|
.menu_member_header, .menu_member_footer {
|
|
background-color: var(--background-elevated);
|
|
border-color: var(--border-dim);
|
|
color: var(--text);
|
|
}
|
|
|
|
/* user mentions for other people */
|
|
.app_preview_link_slug.ts_tip,
|
|
.internal_member_link.ts_tip,
|
|
.internal_user_group_link.ts_tip,
|
|
ts-mention.ts_tip
|
|
{
|
|
color: var(--text-bright);
|
|
background: var(--background-elevated);
|
|
border: 1px solid var(--border-dim);
|
|
padding: 2px 4px;
|
|
margin: 2px;
|
|
/* border-radius: 10px; orien */
|
|
}
|
|
.app_preview_link_slug.ts_tip:hover,
|
|
.internal_member_link.ts_tip:hover,
|
|
.internal_user_group_link.ts_tip:hover,
|
|
ts-mention.ts_tip:hover
|
|
{
|
|
color: var(--text-bright) !important;
|
|
border: 1px solid var(--border-bright);
|
|
}
|
|
|
|
/* emojis */
|
|
.rxn[data-emoji] {
|
|
/*background-color: var(--background-light) !important;
|
|
transition: background-color 200ms ease-in;*/
|
|
height: 28px;
|
|
}
|
|
|
|
.rxn[data-emoji]:hover {
|
|
/*background-color: var(--background-bright) !important;*/
|
|
}
|
|
|
|
.rxn[data-emoji] .emoji_rxn_count {
|
|
font-size: 0.9rem;
|
|
/*color: black !important;*/
|
|
}
|
|
|
|
.rxn .emoji-sizer {
|
|
background-color: transparent !important;
|
|
/* border-radius: 7px; orien */
|
|
width: 24px;
|
|
height: 24px;
|
|
margin: 0 0 0 -2px !important;
|
|
border: 1px solid transparent; /* looks silly but it makes the outline work */
|
|
}
|
|
|
|
.emoji-sizer {
|
|
/* outline for black-on-transparent emojis */
|
|
-webkit-filter: drop-shadow( 1px 0 0 var(--background-bright))
|
|
drop-shadow(-1px 0 0 var(--background-bright))
|
|
drop-shadow(-0 1px 0 var(--background-bright))
|
|
drop-shadow( 0 -1px 0 var(--background-bright));
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.ts_icon.ts_icon_smile_o {
|
|
color: var(--text);
|
|
}
|
|
|
|
.emoji_menu_ng #emoji_input_container,
|
|
#emoji_menu #emoji_menu_items_scroller,
|
|
#emoji_menu #emoji_menu_footer,
|
|
#emoji_menu #emoji_input_container {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.menu .p-emoji_picker__input_container,
|
|
.menu .p-emoji_picker__list_container,
|
|
.menu .p-emoji_picker__heading,
|
|
.menu .p-emoji_picker__footer {
|
|
background: transparent;
|
|
color: var(--text);
|
|
}
|
|
|
|
.p-emoji_picker__group_tab {
|
|
border: 1px solid transparent;
|
|
border-bottom-width: 2px;
|
|
}
|
|
|
|
.menu .p-emoji_picker__group_tab--active {
|
|
background-color: var(--background-content);
|
|
color: var(--text-special);
|
|
border-color: var(--border-bright);
|
|
border-width: 1px 1px 2px 1px;
|
|
border-style: solid;
|
|
}
|
|
.p-emoji_picker__group_tab:hover {
|
|
background-color: var(--background-elevated);
|
|
border-color: var(--border-dim);
|
|
}
|
|
.p-emoji_picker__group_tab .emoji-sizer {
|
|
filter: none;
|
|
-webkit-filter: none;
|
|
}
|
|
.p-emoji_picker__group_tab:hover .emoji-sizer {
|
|
color: var(--text);
|
|
}
|
|
.p-emoji_picker__preview_text {
|
|
background-color: var(--bacground-elevated);
|
|
color: var(--text);
|
|
}
|
|
|
|
#emoji_menu h3, #emoji_menu #emoji_preview_text {
|
|
background-color: var(--background-elevated);
|
|
color: var(--text);
|
|
}
|
|
|
|
#emoji_menu a.emoji_grouping_tab .emoji-sizer {
|
|
-webkit-filter: none;
|
|
}
|
|
|
|
.emoji_menu_ng #emoji_menu_header .emoji_grouping_tab.active {
|
|
background-color: transparent;
|
|
border-color: var(--border-bright);
|
|
border-width: 1px 1px 3px 1px;
|
|
border-style: solid;
|
|
}
|
|
|
|
.light_theme .emoji-only {
|
|
line-height: 3rem;
|
|
font-size: 3rem;
|
|
margin-top: 3px !important;
|
|
}
|
|
|
|
/* menus */
|
|
.menu ul li a, .menu ul li:not(.disabled) a {
|
|
border: 1px solid var(--background-elevated) !important;
|
|
}
|
|
|
|
.menu ul li.highlighted a, .menu ul li:hover:not(.disabled) a {
|
|
background: var(--background-elevated) !important;
|
|
border-color: var(--border-bright) !important;
|
|
}
|
|
|
|
.menu .section_header .header_label {
|
|
color: var(--text) !important;
|
|
background-color: var(--background-elevated) !important;
|
|
}
|
|
|
|
.menu .section_header hr {
|
|
border-color: transparent;
|
|
}
|
|
|
|
/* threads */
|
|
ts-message .reply_bar:hover {
|
|
background: var(--background-content) !important;
|
|
border: 1px solid var(--border-dim) !important;
|
|
}
|
|
/* editor in thread reply */
|
|
#convo_tab .message_input, #convo_tab textarea#msg_text {
|
|
color: var(--text) !important;
|
|
}
|
|
.inline_message_input_container .ql-container.focus,
|
|
.inline_message_input_container .ql-container:active {
|
|
border-color: var(--border-dim) !important;
|
|
}
|
|
#file_reply_container .reply_container_info .reply_broadcast_buttons_container .reply_broadcast_label_container,
|
|
#reply_container .reply_container_info .reply_broadcast_buttons_container .reply_broadcast_label_container,
|
|
.reply_input_container .reply_container_info .reply_broadcast_buttons_container .reply_broadcast_label_container,
|
|
#convo_tab #convo_tab_header {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
/* other */
|
|
.special_formatting_quote .quote_bar {
|
|
background: var(--border-bright) !important;
|
|
}
|
|
|
|
#details_toggle.active:hover, #recent_mentions_toggle.active:hover,
|
|
#stars_toggle.active:hover {
|
|
background-color: var(--background-hover);
|
|
color: var(--text);
|
|
}
|
|
|
|
#details_toggle.active, #recent_mentions_toggle.active,
|
|
#sli_recap_toggle.active, #stars_toggle.active {
|
|
background-color: var(--background-elevated);
|
|
border: 1px solid var(--border-bright);
|
|
color: var(--border-bright);
|
|
}
|
|
|
|
.star_item,
|
|
.current_status_input_for_team_menu .current_status_presets {
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
/* orien : HERE */
|
|
#messages_unread_status {
|
|
border: 1px solid var(--attention);
|
|
background-color: var(--background);
|
|
border-radius: 0px;
|
|
height: 25px;
|
|
}
|
|
#messages_unread_status:hover, #messages_unread_status:hover .clear_unread_messages {
|
|
background-color: var(--background-elevated);
|
|
}
|
|
#messages_unread_status .clear_unread_messages {
|
|
border-left: none;
|
|
}
|
|
|
|
#archives_return, .messages_banner {
|
|
color: var(--text);
|
|
background-color: var(--background-elevated);
|
|
border: 1px solid var(--border-bright);
|
|
border-bottom: 0px;
|
|
border-radius: 10px 10px 0 0;
|
|
}
|
|
|
|
#threads_msgs_scroller_div, ts-thread {
|
|
background-color: var(--background-content);
|
|
}
|
|
|
|
ts-thread .thread_header .thread_channel_name a {
|
|
color: var(--text-special);
|
|
}
|
|
|
|
#convo_tab .thread_participants, ts-thread .thread_participants {
|
|
color: var(--text);
|
|
}
|
|
|
|
ts-thread .thread_messages,
|
|
.reply_input_container .ql-container {
|
|
background-color: var(--background-content);
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
#threads_msgs_scroller_div ts-thread ts-message {
|
|
margin: 0 !important;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
ts-thread .collapse_inline_thread_container:hover,
|
|
ts-thread .view_all_replies_container:hover {
|
|
background-color: var(--background-elevated);
|
|
}
|
|
|
|
|
|
/* preferences page */
|
|
#fs_modal, .modal, .modal-header, .modal-footer {
|
|
background-color: var(--background-elevated);
|
|
}
|
|
|
|
#fs_modal, #fs_modal h1, #fs_modal h2,
|
|
#fs_modal h3, #fs_modal h4, #fs_modal h5,
|
|
.modal, .modal h1, .modal h2, .modal h3,
|
|
.modal h4, .modal h5 {
|
|
color: var(--text);
|
|
}
|
|
|
|
#fs_modal .fs_modal_file_viewer_header {
|
|
background: transparent;
|
|
}
|
|
#fs_modal .fs_modal_file_viewer_content .viewer {
|
|
background: var(--background-content);
|
|
}
|
|
.fs_modal_file_viewer_header .control_btn {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
.section_rollup:hover:not(.is_active) {
|
|
background: var(--background-hover);
|
|
color: inherit;
|
|
}
|
|
|
|
#fs_modal #fs_modal_sidebar a {
|
|
padding: 10px;
|
|
background: transparent;
|
|
border: 1px solid rgba(0, 0, 0, 0.01);
|
|
border-radius: 10px;
|
|
}
|
|
|
|
#fs_modal #fs_modal_sidebar a:hover {
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
#fs_modal #fs_modal_sidebar a.is_active {
|
|
border-color: var(--border-bright);
|
|
}
|
|
|
|
|
|
#threads_msgs_scroller_div .threads_caught_up_divider .divider_line,
|
|
#threads_msgs_scroller_div .threads_caught_up_divider .divider_label {
|
|
background-color: var(--background-elevated);
|
|
border: 1px solid var(--border-dim);
|
|
color: var(--text);
|
|
}
|
|
|
|
/* unreads */
|
|
.unread_empty_state {
|
|
color: var(--text);
|
|
}
|
|
|
|
.unread_group_header,
|
|
.sli_briefing, .sli_briefing__header, .sli_briefing__title,
|
|
.sli_briefing_view__footer_title, .bottom_mark_all_read {
|
|
background-color: var(--background-content);
|
|
color: var(--text);
|
|
border-color: var(--border-dim);
|
|
}
|
|
.unread_group_header button {
|
|
color: var(--text-special);
|
|
},
|
|
|
|
|
|
/* scroller for threads & unreads */
|
|
#threads_msgs_scroller_div:not(.loading):before {
|
|
background: var(--background-content);
|
|
}
|
|
|
|
/* putting this on so many elements might cause performance issues but #yolo */
|
|
div::-webkit-scrollbar-track {
|
|
display: none !important;
|
|
}
|
|
div::-webkit-scrollbar-thumb {
|
|
color: transparent !important;
|
|
border: 1px solid var(--scrollbar-border) !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
#threads_msgs_scroller_div:not(.loading):before {
|
|
background: none;
|
|
}
|
|
|
|
/* thread side panel */
|
|
|
|
#mentions_scroller {
|
|
background: var(--background-content) !important;
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
|
|
/* global (left sidebar) */
|
|
|
|
#channel_scroll_down, #channel_scroll_up {
|
|
background-color: var(--background) !important;
|
|
border: 0 1px 1px 1px solid var(--border-bright) !important;
|
|
}
|
|
|
|
#team_menu, #quick_switcher_btn, #team_menu_overlay, #col_channels_overlay {
|
|
border-color: transparent !important;
|
|
}
|
|
|
|
/* CodeMirror syntax highlighting */
|
|
.cm-s-default .cm-header {color: #66f}
|
|
.cm-s-default .cm-quote {color: #0f0}
|
|
.cm-negative {color: #f44}
|
|
.cm-positive {color: #2f2}
|
|
.cm-s-default .cm-keyword {color: #f0a}
|
|
.cm-s-default .cm-atom {color: #7ff}
|
|
.cm-s-default .cm-number {color: #5fa}
|
|
.cm-s-default .cm-def {color: #37f}
|
|
.cm-s-default .cm-variable-2 {color: #09f}
|
|
.cm-s-default .cm-variable-3 {color: #0fa}
|
|
.cm-s-default .cm-comment {color: #f80}
|
|
.cm-s-default .cm-string {color: #f33}
|
|
.cm-s-default .cm-string-2 {color: #f50}
|
|
.cm-s-default .cm-meta,.cm-s-default .cm-qualifier {color: #aaa}
|
|
.cm-s-default .cm-builtin {color: #96f}
|
|
.cm-s-default .cm-bracket {color: #ffa}
|
|
.cm-s-default .cm-tag {color: #5f0}
|
|
.cm-s-default .cm-attribute {color: #33f}
|
|
.cm-s-default .cm-hr {color: #ccc}
|
|
.cm-s-default .cm-link {color: #33f}
|
|
|
|
/* Snippets */
|
|
select {
|
|
background-color: var(--background-content);
|
|
color: var(--text);
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
.CodeMirror, .CodeMirror .CodeMirror-gutters, .CodeMirror-gutter {
|
|
background-color: var(--background-content) !important;;
|
|
border-color: var(--border-bright);
|
|
color: var(--text);
|
|
}
|
|
|
|
.CodeMirror .CodeMirror-line {
|
|
background-color: var(--background-content);
|
|
}
|
|
|
|
.CodeMirror-cursor {
|
|
border-left-color: var(--text);
|
|
}
|
|
|
|
.CodeMirror-selected {
|
|
background-color: rgba(255, 255, 255, 0.2) !important;
|
|
}
|
|
|
|
.modal div, .modal span, .modal label {
|
|
color: var(--text);
|
|
}
|
|
|
|
.lazy_filter_select .lfs_list_container,
|
|
.lazy_filter_select .lfs_list .lfs_item.active {
|
|
background-color: var(--background-elevated);
|
|
}
|
|
|
|
.lfs_list::-webkit-scrollbar-track {
|
|
display: none;
|
|
}
|
|
|
|
.lfs_list::-webkit-scrollbar-thumb {
|
|
color: transparent !important;
|
|
border: 1px solid var(--scrollbar-border) !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
/* profile */
|
|
#fs_modal #fs_modal_footer {
|
|
background-color:var(--background-elevated)
|
|
}
|
|
|
|
#contents_container::-webkit-scrollbar-track {
|
|
display: none;
|
|
}
|
|
|
|
#contents_container::-webkit-scrollbar-thumb {
|
|
color: transparent !important;
|
|
border: 1px solid var(--scrollbar-border) !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
/* scroll border fix */
|
|
.client_channels_list_container {
|
|
border-right: none;
|
|
}
|
|
|
|
.flex_pane_showing #col_flex {
|
|
border-color: var(--border-dim);
|
|
}
|
|
|
|
/* setting menu fix */
|
|
#fs_modal.prefs_modal .global_notification_block {
|
|
background: transparent;
|
|
border: none;
|
|
}
|
|
#fs_modal.prefs_modal .global_notification_block.selected {
|
|
background: transparent;
|
|
border: 1px solid var(border-bright);
|
|
}
|
|
.notification_example.mac {
|
|
color: #555459; /* default color - leave unthemed */
|
|
}
|
|
|
|
/* global jumper */
|
|
ts-jumper, ts-jumper.active {
|
|
background-color: rgba(32,32,32,0.6);
|
|
}
|
|
ts-jumper ts-jumper-container {
|
|
box-shadow: 0 5px 20px rgba(0,0,0,1);
|
|
}
|