Remove some usage of changeCss and some unused CSS (#25049)

* Inline .more-modal__gm-icon background

* Remove superceded .user-popover__role background

* Inline .svg-text-color fill

* Inline .multi-select__note background

* Remove superceded .status--group background rule

* Split rules

* Remove unused .modal-tabs rule and CSS

* Inline .system-notice border-color rule

* Inline .image-loaded border-color

* Remove superceded .dropdown-menu button border-color

* Removed unused .member-list__popover rules and CSS

* Inline .alert-transparent border-color

* Inline .access-history-modal .table border-color

* Inline .post-list__arrows fill

* Inline .card-icon__container color

* Inline .post-image__download svg border-color and stroke

* Split rules

* Remove unused .channel-header__links rules and CSS

* Remove unused .usage__icon rule and CSS

* Remove unused .more-modal__header rule

* Remove unused .icon--body rule

* Inline .post-menu border-color

* Remove unused .post-waiting rule and CSS

* Inline .post__body color

* Split rules

* Inline .nav-tab color

* Inline .input-group-addon color

* Inline .app_content color rule

* Remove unused .post-create-body rule and CSS

* Inline .msg-typing color

* Inline .dropdown-menu color

* Inline .popover color

* Remove superceded .suggestion-list__main color

* Remove .tip-overlay rule and unused _tutorial.scss

* Inline .form-control disabled and readonly color

* Inline fieldset[disabled] color

* Inline .post__link color

* Remove unused #archive-link-home rule and CSS

* Remove unused .video-thumbnail__error rule and CSS

* Inline #post-create color

* Remove unused .mentions--top rules

* Inline .system-notice box-shadow and remove unneeded .shadow--2 rules

* Split rules

* Inline .shortcut-key background rule

* Remove superceded .post__body hr background rule

* Inline .loading__content .round background-color

* Inline .tutorial__circles .circle background-color

* Inline .channel-header .heading color

* Update missed snapshots

---------

Co-authored-by: Mattermost Build <build@mattermost.com>

webapp/channels/src/components/access_history_modal/__snapshots__/access_history_modal.test.tsx.snap

@@ -8,7 +8,7 @@ exports[`components/AccessHistoryModal should match snapshot when audits exist 1
   backdrop={true}
   bsClass="modal"
   bsSize="large"
-  dialogClassName="a11y__modal modal--scroll"
+  dialogClassName="a11y__modal modal--scroll access-history-modal"
   dialogComponentClass={[Function]}
   enforceFocus={true}
   keyboard={true}
@@ -89,7 +89,7 @@ exports[`components/AccessHistoryModal should match snapshot when no audits exis
   backdrop={true}
   bsClass="modal"
   bsSize="large"
-  dialogClassName="a11y__modal modal--scroll"
+  dialogClassName="a11y__modal modal--scroll access-history-modal"
   dialogComponentClass={[Function]}
   enforceFocus={true}
   keyboard={true}

webapp/channels/src/components/access_history_modal/access_history_modal.scss

@@ -0,0 +1,8 @@
+.access-history-modal {
+    .table {
+        thead > tr > th,
+        tbody > tr > td {
+            border-color: rgba(var(--center-channel-color-rgb), 0.12);
+        }
+    }
+}

webapp/channels/src/components/access_history_modal/access_history_modal.tsx

@@ -10,6 +10,8 @@ import type {Audit} from '@mattermost/types/audits';
 import AuditTable from 'components/audit_table';
 import LoadingScreen from 'components/loading_screen';
 
+import './access_history_modal.scss';
+
 type Props = {
     onHide: () => void;
     actions: {
@@ -52,7 +54,7 @@ const AccessHistoryModal = ({
 
     return (
         <Modal
-            dialogClassName='a11y__modal modal--scroll'
+            dialogClassName='a11y__modal modal--scroll access-history-modal'
             show={show}
             onHide={onCloseClick}
             onExited={onHide}

webapp/channels/src/components/more_direct_channels/list_item/list_item.tsx

@@ -92,7 +92,7 @@ function GMDetails(props: {option: GroupChannel}) {
 
     return (
         <>
-            <div className='more-modal__gm-icon bg-text-200'>
+            <div className='more-modal__gm-icon'>
                 {option.profiles.length}
             </div>
             <div className='more-modal__details'>

webapp/channels/src/components/product_notices_modal/product_notices_modal.scss

@@ -50,6 +50,7 @@
         width: 6px;
         height: 6px;
         margin: 0 3px;
+        background-color: var(--center-channel-color);
         vertical-align: middle;
     }
 

webapp/channels/src/components/shortcut_key/shortcut_key.scss

@@ -2,6 +2,7 @@
     .shortcut-key {
         display: inline-block;
         padding: 10px 9px 8px 8px;
+        background: var(--center-channel-color);
         border-radius: 4px;
         color: var(--center-channel-bg);
         font-size: 14px;

webapp/channels/src/components/system_notice/__snapshots__/system_notice.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`components/SystemNotice should match snapshot for admin, admin notice 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"
@@ -65,7 +65,7 @@ exports[`components/SystemNotice should match snapshot for admin, admin notice 1
 
 exports[`components/SystemNotice should match snapshot for admin, regular notice 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"
@@ -111,7 +111,7 @@ exports[`components/SystemNotice should match snapshot for admin, regular notice
 
 exports[`components/SystemNotice should match snapshot for regular user, admin and regular notice 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"
@@ -165,7 +165,7 @@ exports[`components/SystemNotice should match snapshot for regular user, no noti
 
 exports[`components/SystemNotice should match snapshot for regular user, regular notice 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"
@@ -213,7 +213,7 @@ exports[`components/SystemNotice should match snapshot for show function returni
 
 exports[`components/SystemNotice should match snapshot for show function returning true 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"
@@ -259,7 +259,7 @@ exports[`components/SystemNotice should match snapshot for show function returni
 
 exports[`components/SystemNotice should match snapshot for with allowForget equal false 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"
@@ -295,7 +295,7 @@ exports[`components/SystemNotice should match snapshot for with allowForget equa
 
 exports[`components/SystemNotice should match snapshot when a custom icon is passed 1`] = `
 <div
-  className="system-notice bg--white shadow--2"
+  className="system-notice bg--white"
 >
   <div
     className="system-notice__logo"

webapp/channels/src/components/system_notice/system_notice.tsx

@@ -130,7 +130,7 @@ export default class SystemNotice extends React.PureComponent<Props> {
 
         return (
             <div
-                className='system-notice bg--white shadow--2'
+                className='system-notice bg--white'
             >
                 <div className='system-notice__logo'>
                     {icon}

webapp/channels/src/components/widgets/icons/info_small_icon.tsx

@@ -9,7 +9,6 @@ export default function InfoSmallIcon(props: React.HTMLAttributes<HTMLSpanElemen
     return (
         <span {...props}>
             <svg
-                className='svg-text-color'
                 aria-label={formatMessage({id: 'generic_icons.info', defaultMessage: 'Info Icon'})}
                 width='24px'
                 height='24px'

webapp/channels/src/sass/components/_alerts.scss

@@ -5,6 +5,7 @@
     border-radius: $border-rad;
 
     .alert-transparent {
+        border-color: rgba(var(--center-channel-color-rgb), 0.12);
         background: var(--center-channel-bg);
     }
 }

webapp/channels/src/sass/components/_dropdown.scss

@@ -3,6 +3,7 @@
 .dropdown-menu {
     background: var(--center-channel-bg);
     border-radius: 4px;
+    color: var(--center-channel-color);
 
     &.colorpicker {
         z-index: 2500;

webapp/channels/src/sass/components/_files.scss

@@ -208,6 +208,7 @@
             max-width: 100%;
             min-height: 40px;
             max-height: $max-image-height;
+            border-color: rgba(var(--center-channel-color), 0.12);
             border-radius: 4px;
             transition: all 0.1s linear;
 
@@ -634,8 +635,10 @@
             width: 30px;
             height: 30px;
             border: 1px solid;
+            border-color: rgba(var(--center-channel-color-rgb), 0.35);
             border-radius: 50%;
             opacity: 0.7;
+            stroke: rgba(var(--center-channel-color-rgb), 0.4);
             transition: all 0.1s linear;
 
             &:hover {

webapp/channels/src/sass/components/_forms.scss

@@ -169,6 +169,11 @@
             border-color: rgba(var(--center-channel-color-rgb), 0.4);
         }
 
+        &[disabled],
+        &[readonly] {
+            color: var(--center-channel-color);
+        }
+
         &.inline {
             display: inline-block;
             width: auto;

webapp/channels/src/sass/components/_inputs.scss

@@ -66,6 +66,12 @@ fieldset {
     }
 }
 
+.app__body {
+    fieldset[disabled] {
+        color: var(--center-channel-color);
+    }
+}
+
 .admin-textarea {
     resize: none;
 }
@@ -101,3 +107,7 @@ input::-webkit-file-upload-button {
     color: inherit;
     opacity: 0.5;
 }
+
+.input-group-addon {
+    color: var(--center-channel-color);
+}

webapp/channels/src/sass/components/_modal.scss

@@ -669,6 +669,7 @@
         flex: 32px 0 0;
         align-items: center;
         justify-content: center;
+        background: rgba(var(--center-channel-color), 0.2);
         border-radius: 50%;
     }
 
@@ -724,67 +725,6 @@
     }
 }
 
-.modal-tabs {
-    display: flex;
-    width: 100%;
-    flex-direction: column;
-
-    .tab-content {
-        display: flex;
-        height: auto;
-        flex: 1 1 auto;
-        flex-direction: column;
-    }
-
-    .tab-pane {
-        display: none;
-        height: auto;
-        flex: 1 1 auto;
-
-        &.active {
-            display: flex;
-        }
-    }
-
-    .nav-tabs {
-        margin: 0 0 16px;
-
-        >li {
-            width: 50%;
-            border: none;
-            border-bottom: 2px $light-gray solid;
-            margin-right: 0;
-            text-align: center;
-
-            &.active {
-                border-bottom: 2px $primary-color solid;
-
-                a {
-                    opacity: 1;
-                }
-            }
-
-            >a {
-                display: flex;
-                height: 40px;
-                align-items: center;
-                justify-content: center;
-                padding-bottom: 12px;
-                border: none;
-                background: var(--center-channel-bg);
-                color: inherit;
-                font-weight: 900;
-                opacity: 0.5;
-                outline: none;
-
-                &:active {
-                    opacity: 1;
-                }
-            }
-        }
-    }
-}
-
 .more-modal__button {
     .btn {
         width: 100%;

webapp/channels/src/sass/components/_module.scss

@@ -32,7 +32,6 @@
 @import 'status-icon';
 @import 'suggestion-list';
 @import 'tooltip';
-@import 'tutorial';
 @import 'videos';
 @import 'color-input';
 @import 'system-notice';

webapp/channels/src/sass/components/_multi-select.scss

@@ -42,6 +42,7 @@
     display: table;
     width: 100%;
     padding: 8px 13px;
+    background: rgba(var(--center-channel-color-rgb), 0.12);
     border-radius: 3px;
 
     > div {

webapp/channels/src/sass/components/_popover.scss

@@ -17,7 +17,7 @@
     background: var(--center-channel-bg);
     border-radius: $border-rad * 2;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
-    color: lighten($black, 25%);
+    color: var(--center-channel-color);
     font-family: inherit;
 
     .app__body & {
@@ -447,205 +447,6 @@
     }
 }
 
-.member-list__popover {
-    max-width: initial;
-    margin-left: 110px;
-
-    &.popover.bottom {
-        margin-top: 2px;
-    }
-
-    .more-modal__body {
-        position: relative;
-        overflow: auto;
-        max-height: 275px;
-        border-top: 1px solid transparent;
-        border-bottom: 1px solid transparent;
-    }
-
-    .more-modal__header {
-        display: flex;
-        padding: 14px 20px;
-
-        .icon {
-            position: relative;
-            margin: 0 38px 0 24px;
-            opacity: 0.8;
-        }
-
-        span {
-            align-self: center;
-            font-weight: 600;
-        }
-
-        button {
-            width: fit-content;
-            margin-left: auto;
-
-            i {
-                margin: 0 5px !important;
-            }
-        }
-
-        .subhead {
-            font-size: 12px;
-            opacity: 0.6;
-
-            span {
-                font-weight: normal;
-            }
-        }
-    }
-
-    .more-modal__button {
-        display: flex;
-
-        .btn {
-            width: 100%;
-            height: 42px;
-            padding: 0;
-            margin: 0 auto;
-        }
-    }
-
-    .more-modal__list {
-        .more-modal__row {
-            overflow: hidden;
-            height: 50px;
-            padding: 0 12px 0 20px;
-            border: none;
-            margin: 1px 0;
-            cursor: pointer;
-
-            .more-modal__actions {
-                padding: 0;
-                margin-left: 12px;
-                opacity: 1;
-
-                button {
-                    width: 2em;
-                    height: 2em;
-                    border-radius: 4px;
-                    line-height: 0;
-                    opacity: 0;
-
-                    &:hover {
-                        background-color: rgba(var(--button-bg-rgb), 0.24);
-                    }
-
-                    &:active {
-                        background-color: rgba(var(--button-bg-rgb), 0.32);
-                    }
-
-                    &.a11y--focused {
-                        opacity: 1;
-                    }
-                }
-            }
-
-            &:hover {
-                padding-left: 17px;
-                border-left: 3px solid transparent;
-
-                .more-modal__actions {
-                    button {
-                        opacity: 1;
-                    }
-                }
-
-                .more-modal__name {
-                    font-weight: 600;
-                }
-            }
-
-            &.more-modal__row--button {
-                position: relative;
-                height: 40px;
-                border-left: none;
-
-                button {
-                    position: absolute;
-                    top: 0;
-                    left: 0;
-                    width: 100%;
-                    height: 100%;
-                    font-weight: 500;
-                }
-            }
-
-            .shared-user-icon {
-                margin-top: 5px;
-                color: rgba(61, 60, 64, 0.56);
-                font-size: 16px;
-            }
-        }
-
-        .more-modal__name {
-            display: block;
-            font-size: 13.5px;
-            font-weight: normal;
-        }
-
-        .more-modal__image {
-            position: relative;
-            top: -1px;
-            margin: 0;
-        }
-
-        .more-modal__details {
-            padding-left: 16px;
-            line-height: 39px;
-
-            .shared-user-icon {
-                width: 16px;
-                height: 16px;
-                margin-top: 16px;
-                margin-left: 8px;
-                color: rgba(61, 60, 64, 0.72);
-                font-size: 16px;
-                line-height: 16px;
-
-                &::before {
-                    margin: 0;
-                }
-            }
-        }
-
-        .more-modal__actions {
-            margin: 0;
-            line-height: 42px;
-            opacity: 0;
-
-            .icon {
-                position: relative;
-                top: 2px;
-            }
-        }
-    }
-
-    .popover-content {
-        position: relative;
-        width: 260px;
-        max-height: 380px;
-        padding: 0;
-
-        .text-nowrap {
-            overflow: hidden;
-            width: 100%;
-            padding: 6px 10px;
-            font-size: 13px;
-            line-height: 26px;
-        }
-
-        .more__name {
-            overflow: hidden;
-            max-width: 140px;
-            margin-left: 6px;
-            text-overflow: ellipsis;
-        }
-    }
-}
-
 .channel_search {
     display: flex;
 

webapp/channels/src/sass/components/_post-menu.scss

@@ -79,7 +79,7 @@
         &.post--hovered,
         &.a11y--active {
             .post-menu {
-                border-color: rgba(v(center-channel-color-rgb), 0.08);
+                border-color: rgba(var(--center-channel-color-rgb), 0.2);
                 background-color: v(center-channel-bg);
                 box-shadow: $elevation-1;
             }

webapp/channels/src/sass/components/_post.scss

@@ -326,7 +326,7 @@
     width: 40px;
     height: 40px;
     background-repeat: no-repeat;
-    fill: #444;
+    fill: rgba(var(--center-channel-color-rgb), 0.3);
     opacity: 0;
     text-align: center;
     transition: all 0.6s;
@@ -351,6 +351,7 @@
     width: 100%;
     flex: 0 0 auto;
     background: var(--center-channel-bg);
+    color: var(--center-channel-color);
 
     label {
         font-weight: normal;
@@ -399,62 +400,12 @@
         }
     }
 
-    .post-create-body {
-        position: relative;
-        padding: 0 0 2px;
-
-        .post-body__cell {
-            position: relative;
-            vertical-align: top;
-        }
-
-        .send-button {
-            display: none;
-            width: 45px;
-            height: 100%;
-            padding-right: 4px;
-            border-left: 1px solid transparent;
-            cursor: pointer;
-            font-size: 17px;
-            line-height: 49px;
-            text-align: center;
-            transition: all 0.15s;
-            vertical-align: bottom;
-
-            &:active {
-                opacity: 0.75;
-            }
-
-            &.disabled {
-                i {
-                    color: inherit;
-                }
-            }
-
-            .android &,
-            .ios & {
-                display: block;
-            }
-        }
-
-        .icon--emoji-picker {
-            cursor: pointer;
-            opacity: 0.5;
-            transition: all 0.15s;
-
-            &:hover,
-            &:active {
-                box-shadow: none;
-                opacity: 0.9;
-            }
-        }
-    }
-
     .msg-typing {
         display: block;
         overflow: hidden;
         height: 20px;
         margin: 2px 0;
+        color: var(--center-channel-color);
         font-size: 11px;
         line-height: 16px;
         opacity: 0.7;
@@ -714,6 +665,10 @@
                 min-width: 0;
             }
         }
+
+        .post__body {
+            color: rbga(var(--center-channel-color-rgb), 0.6);
+        }
     }
 
     &:hover,
@@ -1588,6 +1543,7 @@
     .post__link {
         overflow: hidden;
         margin: 2px 0 5px;
+        color: rgba(var(--center-channel-color), 0.65);
         font-size: 13px;
         text-overflow: ellipsis;
         -webkit-user-select: none; /* Chrome all / Safari all */
@@ -1776,22 +1732,6 @@
         color: #d58a8a;
     }
 
-    .post-waiting {
-        position: relative;
-        color: #999;
-
-        .spinner {
-            position: absolute;
-            top: 4px;
-            right: 8px;
-            width: 20px;
-        }
-
-        .post-message {
-            padding-right: 24px;
-        }
-    }
-
     .permalink-icon {
         display: inline-block;
         color: $primary-color;
@@ -1872,6 +1812,7 @@
         z-index: 1;
         top: 2px;
         margin: 0 6px 0 4px;
+        color: rgba(var(--center-channel-color-rgb), 0.3);
         opacity: 0.24;
         vertical-align: top;
 
@@ -1886,6 +1827,7 @@
         svg {
             width: 14px;
             height: 14px;
+            fill: var(--center-channel-color);
         }
     }
 
@@ -2375,7 +2317,7 @@
 
 .post.current--user {
     &.other--root,
-    &.post--root, {
+    &.post--root {
         .post__header-set-custom-status {
             display: revert;
             padding: 0 6px;

webapp/channels/src/sass/components/_search.scss

@@ -6,12 +6,6 @@
 }
 
 .search-bar__container {
-    .channel-header__links {
-        .sidebar--right & {
-            line-height: 25px;
-        }
-    }
-
     padding: 0 4px 0 8px;
 }
 

webapp/channels/src/sass/components/_system-notice.scss

@@ -8,10 +8,10 @@
     display: flex;
     width: 386px;
     padding: 18px 20px 0;
-    border: 1px solid alpha-color($black, 0.15);
+    border: 1px solid rgba(var(--center-channel-color-rgb, 0.12));
     background-color: var(--center-channel-bg);
     border-radius: 4px;
-    box-shadow: 0 20px 30px alpha-color($black, 0.07), 0 14px 20px alpha-color($black, 0.07);
+    box-shadow: rgba(var(--center-channel-color-rgb), 0.1) 0 20px 30px 0, rgba(var(--center-channel-color-rgb), 0.1) 0 14px 20px 0;
 }
 
 .system-notice__logo {

webapp/channels/src/sass/components/_tutorial.scss

@@ -1,584 +0,0 @@
-@charset "UTF-8";
-
-@import "sass/utils/variables";
-@import "sass/utils/functions";
-
-$backdrop-index: 999;
-$tip-index: 1000;
-
-.tutorial-tip {
-    &__header {
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-
-        &__title {
-            flex: auto;
-            order: 0;
-            margin: 0;
-            font-family: inherit;
-            font-size: 1.4rem;
-            font-style: normal;
-            font-weight: 600;
-            line-height: 2rem;
-        }
-
-        &__close {
-            display: flex;
-            overflow: hidden;
-            width: 3.2rem;
-            height: 3.2rem;
-            flex-shrink: 0;
-            align-items: center;
-            justify-content: center;
-            border: unset;
-            margin-left: 1.2rem;
-            background: transparent;
-            border-radius: 4px;
-            color: rgba(var(--center-channel-color-rgb), 0.56);
-            font-weight: 600;
-
-            &:hover {
-                background: rgba(var(--center-channel-color-rgb), 0.08);
-            }
-
-            &.active {
-                background: rgba(var(--center-channel-color-rgb), 0.08);
-            }
-
-            i {
-                font-size: 1.8rem;
-                line-height: 1.8rem;
-
-                ::before {
-                    margin-right: 0;
-                }
-            }
-        }
-    }
-
-    &__body {
-        display: flex;
-        flex-direction: column;
-        margin-top: 0.6rem;
-
-        p {
-            margin: 0 0 0.8rem;
-            font-size: 1.4rem;
-            line-height: 2rem;
-
-            &:last-of-type {
-                margin-bottom: 0;
-            }
-        }
-    }
-
-    &__btn-ctr {
-        display: flex;
-        flex-grow: 1;
-        justify-content: flex-end;
-    }
-
-    &__btn {
-        display: inline-flex;
-        height: 3.2rem;
-        align-items: center;
-        padding: 10px 16px;
-        border: none;
-        border-radius: 4px;
-        font-size: 12px;
-        font-weight: 600;
-        line-height: 12px;
-    }
-
-    &__confirm-btn {
-        background: var(--button-bg);
-        color: var(--button-color);
-
-        &:hover:not(.disabled) {
-            background:
-                linear-gradient(
-                    0deg,
-                    rgba(var(--center-channel-color-rgb), 0.16),
-                    rgba(var(--center-channel-color-rgb), 0.16)
-                ),
-                var(--button-bg);
-        }
-
-        &:active {
-            background:
-                linear-gradient(
-                    0deg,
-                    rgba(var(--center-channel-color-rgb), 0.32),
-                    rgba(var(--center-channel-color-rgb), 0.32)
-                ),
-                var(--button-bg);
-        }
-
-        &:focus {
-            box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);
-        }
-
-        .icon-chevron-right::before {
-            margin-right: -7px;
-        }
-    }
-
-    &__cancel-btn {
-        display: inline-flex;
-        align-items: center;
-        margin-right: 4px;
-        background: rgba(var(--button-bg-rgb), 0.08);
-        border-radius: 4px;
-        color: var(--button-bg);
-        text-decoration: none;
-
-        &:hover {
-            background: rgba(var(--button-bg-rgb), 0.04);
-        }
-
-        &:active {
-            background: rgba(var(--button-bg-rgb), 0.08);
-        }
-
-        &:focus {
-            box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);
-        }
-
-        .icon-chevron-left::before {
-            margin-left: -7px;
-        }
-    }
-
-    &__circles-ctr {
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-    }
-
-    &__circular-ring {
-        position: relative;
-        display: flex;
-        width: 12px;
-        height: 12px;
-        align-items: center;
-        justify-content: center;
-        margin-right: 4px;
-        background: transparent;
-        border-radius: 50%;
-
-        &:last-child {
-            margin-right: 0;
-        }
-    }
-
-    &__circular-ring-active {
-        background: rgba(var(--button-bg-rgb), 0.16);
-    }
-
-    &__circle {
-        position: absolute;
-        top: 3px;
-        left: 3px;
-        width: 6px;
-        height: 6px;
-        background: rgba(var(--button-bg-rgb), 0.32);
-        border-radius: 6px;
-
-        &.active {
-            background: rgba(var(--button-bg-rgb), 1);
-        }
-    }
-
-    &__footer {
-        display: flex;
-        flex-direction: column;
-        margin-top: 2.4rem;
-
-        &-buttons {
-            display: flex;
-            align-items: center;
-            justify-content: start;
-        }
-    }
-
-    &__opt {
-        align-self: flex-end;
-        margin-top: 1.2rem;
-        font-size: 12px;
-
-        span {
-            opacity: 0.9;
-        }
-    }
-}
-
-.tip-backdrop {
-    position: absolute;
-    z-index: $backdrop-index;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: alpha-color($black, 0.5);
-}
-
-.tip-overlay {
-    position: absolute;
-    z-index: $tip-index;
-    width: 32rem;
-    padding: 1.8rem 2.4rem 2.4rem;
-    border: 1px solid rgba(var(--center-channel-color-rgb), 0.16);
-    background: var(--center-channel-bg);
-    border-radius: 4px;
-    filter: drop-shadow(0 12px 32px rgba($black, 0.12));
-
-    .arrow {
-        position: absolute;
-        left: 24px;
-        display: block;
-        width: 1.7rem;
-        height: 1.7rem;
-        border-width: 1px 0 0 1px;
-        border-style: solid;
-        border-color: rgba(var(--center-channel-color-rgb), 0.16);
-        background: var(--center-channel-bg);
-        transform: rotate(-45deg);
-    }
-
-    .svg-wrapper {
-        display: flex;
-
-        svg {
-            margin: 0 auto;
-        }
-    }
-
-    .handSvg.svg-wrapper {
-        margin: 20px 0 30px 0;
-    }
-
-    &.tip-overlay--sidebar {
-        margin: 154px 0 0 6px;
-
-        .tutorial__footer {
-            position: absolute;
-            bottom: 20px;
-            left: 0;
-            width: 100%;
-            padding: 0 20px;
-        }
-
-        .arrow {
-            top: 32px;
-            left: -9px;
-            margin-top: -10px;
-        }
-
-        &.first-channel {
-            margin-top: 131px;
-        }
-    }
-
-    &.tip-overlay--header--left {
-        margin: 10px 0 0 7px;
-
-        .arrow {
-            top: 34px;
-            left: -9px;
-        }
-
-        &.tip-overlay--header--heading {
-            .arrow {
-                top: 40px;
-            }
-        }
-    }
-
-    &.tip-overlay--header--bottom {
-        margin-top: -10px;
-
-        .arrow {
-            top: -9px;
-            left: 50%;
-            margin-left: -10px;
-        }
-    }
-
-    &.tip-overlay--start-trial {
-        margin-top: 100px;
-        margin-left: 5px;
-        box-shadow: var(--elevation-2);
-
-        .arrow {
-            top: 25px;
-            left: -10px;
-            border-right-color: var(--center-channel-bg);
-            border-left-width: 0;
-        }
-    }
-
-    &.tip-overlay--chat {
-        width: 40.8rem;
-        margin-top: -7px;
-        box-shadow: var(--elevation-2);
-
-        .arrow {
-            bottom: -10px;
-            left: calc(50% - 7px);
-            transform: rotate(-135deg);
-        }
-    }
-
-    &.tip-overlay--add-channels {
-        margin-left: 6px;
-
-        .arrow {
-            top: 81px;
-            left: -9px;
-        }
-
-        &.tip-overlay--top-row-placement {
-            .arrow {
-                top: 41px;
-            }
-        }
-    }
-
-    &.tip-overlay--threads-welcome {
-        margin: 85px 0 0 6px;
-
-        .arrow {
-            top: 24px;
-            left: -9px;
-        }
-    }
-
-    &.tip-overlay--threads-list {
-        margin: 99px 0 0 6px;
-
-        .arrow {
-            top: 24px;
-            left: -9px;
-        }
-    }
-
-    &.tip-overlay--threads-unread {
-        margin: 6px 0 0 126px;
-
-        .arrow {
-            top: -9px;
-            left: 24px;
-            transform: rotate(45deg);
-        }
-    }
-
-    &.tip-overlay--threads-pane {
-        margin: 37px 0 0 -6px;
-
-        .arrow {
-            top: 24px;
-            right: -9px;
-            left: unset;
-            transform: rotate(135deg);
-        }
-    }
-
-    &.tip-overlay--product-switcher {
-        margin-top: 6px;
-        margin-left: 4px;
-
-        .arrow {
-            top: -9px;
-            left: 24px;
-            transform: rotate(45deg);
-        }
-    }
-
-    &.tip-overlay--settings {
-        margin: 7px 0 0 -20px;
-
-        .arrow {
-            top: -9px;
-            right: 24px;
-            left: unset;
-            transform: rotate(45deg);
-        }
-    }
-}
-
-.tip-button {
-    position: relative;
-    z-index: 998;
-    top: -10px;
-    right: -10px;
-    cursor: pointer;
-}
-
-.tip-div {
-    position: absolute;
-    top: 0;
-    right: 0;
-
-    &.tip-overlay--chat {
-        right: unset;
-        left: 0;
-    }
-
-    &.tip-overlay--start-trial {
-        top: 15px;
-        right: -15px;
-        left: unset;
-    }
-
-    &.tip-overlay--header {
-        top: 21px;
-        right: 2px;
-
-        .tip-button {
-            opacity: 0.8;
-        }
-    }
-
-    &.tip-overlay--header--left {
-        // needs to be over the top of the dropdown trigger
-        z-index: 1;
-        top: 8px;
-        right: 14px;
-        padding: 0 0 12px 12px;
-
-        &.tip-overlay--header--heading {
-            top: 0;
-            right: -6px;
-            padding: 0 0 12px 12px;
-        }
-    }
-
-    &.tip-overlay--actions {
-        margin-top: -7px;
-        margin-right: 8px;
-    }
-
-    &.tip-overlay--sidebar {
-        top: 10px;
-        right: 10px;
-    }
-
-    &.tip-overlay--add-channels {
-        top: -6px;
-        right: -13px;
-        padding: 0 8px 24px 24px;
-        cursor: pointer;
-    }
-
-    &.tip-overlay--threads-welcome {
-        top: 10px;
-        right: 5px;
-        padding: 0 8px 24px 24px;
-        cursor: pointer;
-    }
-
-    &.tip-overlay--threads-list {
-        top: 58px;
-        right: -2px;
-        padding: 0 8px 24px 24px;
-        cursor: pointer;
-    }
-
-    &.tip-overlay--threads-unread {
-        top: 35px;
-        right: 24px;
-        padding: 0 8px 24px 24px;
-        cursor: pointer;
-    }
-
-    &.tip-overlay--threads-pane {
-        top: 25px;
-        right: unset;
-        left: 4px;
-        cursor: pointer;
-    }
-
-    &.tip-overlay--product-switcher {
-        z-index: $backdrop-index + 1;
-        right: unset;
-        padding: 16px 0 0 20px;
-        margin: 0;
-        cursor: pointer;
-
-        .arrow {
-            top: -13px;
-            right: 44px;
-        }
-    }
-
-    &.tip-overlay--settings {
-        // needs to be over:
-        // the highest .channel-header setting
-        // the tip backdrop because it spills over the highlighted punchout
-        // needs to be underneath the tip.
-        z-index: $backdrop-index + 1;
-        top: 23px;
-        right: 38px;
-        padding: 10px;
-        margin: 0;
-    }
-}
-
-body.announcement-bar--fixed {
-    .tip-overlay {
-        &.tip-overlay--add-channels {
-            margin-top: $announcement-bar-height;
-        }
-
-        &.tip-overlay--header--left {
-            margin-top: 10px + $announcement-bar-height;
-        }
-    }
-}
-
-// Mobile view
-@media screen and (max-width: 768px) {
-    .tip-div {
-        &.tip-overlay--chat {
-            left: calc(50% - 4px);
-        }
-
-        &.tip-overlay--sidebar,
-        &.tip-overlay--threads-welcome {
-            top: 17px;
-        }
-
-        &.tip-overlay--threads-list {
-            top: unset;
-            right: unset;
-            bottom: -16px;
-            left: calc(50% - 16px);
-        }
-    }
-
-    .tip-overlay {
-        top: unset !important;
-        bottom: 0 !important;
-        left: calc(50% - 16rem) !important;
-        margin: 0 0 20px 0 !important;
-
-        .arrow {
-            display: none;
-        }
-
-        &.tip-overlay--chat {
-            left: calc(50% - 204px) !important;
-            margin-left: unset;
-        }
-    }
-}
-
-@media screen and (max-width: 425px) {
-    .tip-overlay {
-        &.tip-overlay--chat {
-            left: calc(50% - 16rem) !important;
-            width: 32rem;
-        }
-    }
-}

webapp/channels/src/sass/components/_videos.scss

@@ -21,22 +21,6 @@
             cursor: pointer;
         }
 
-        .video-thumbnail__error {
-            width: 100%;
-            height: 100%;
-            padding: 110px 0;
-            line-height: 2;
-            text-align: center;
-
-            .fa {
-                opacity: 0.5;
-            }
-
-            div {
-                font-size: 1.2em;
-            }
-        }
-
         .block {
             position: absolute;
             top: 50%;

webapp/channels/src/sass/layout/_content.scss

@@ -54,30 +54,13 @@
     flex-direction: column;
     padding-top: 50px;
     background: var(--center-channel-bg);
+    color: var(--center-channel-text);
 
     .channel__wrap & {
         padding-top: 0;
     }
 }
 
-#archive-link-home {
-    flex: 0 0 auto;
-    cursor: pointer;
-    font-size: 13px;
-
-    .fa {
-        font-size: 11px;
-        opacity: 0.7;
-    }
-
-    a {
-        display: block;
-        width: 100%;
-        padding: 10px 20px;
-        color: inherit;
-    }
-}
-
 .delete-message-text {
     margin-top: 10px;
 }

webapp/channels/src/sass/layout/_headers.scss

@@ -217,6 +217,7 @@
     .heading {
         overflow: hidden;
         margin: 0 0 0 2px;
+        color: var(--center-channel-color);
         font-family: Metropolis, sans-serif;
         font-size: 16px;
         font-weight: 600;
@@ -819,59 +820,9 @@
     }
 }
 
-.app__body {
-    .channel-header__links {
-        display: inline-block;
-        width: 30px;
-        height: 30px;
-        margin-right: 1px;
-        font-family: "Open Sans", sans-serif;
-        font-size: 22px;
-        line-height: 26px;
-        text-align: center;
-
-        th {
-            &:last-child {
-                div {
-                    margin-right: 10px;
-                }
-            }
-        }
-
-        .channel__wrap.move--left & {
-            position: absolute;
-            top: 14px;
-            right: -400px;
-        }
-
-        > a {
-            color: inherit;
-            opacity: 0.6;
-            text-decoration: none;
-            transition: all 0.1s ease-in;
-
-            &:hover {
-                opacity: 0.7;
-            }
-
-            &:focus {
-                color: inherit;
-            }
-
-            &.active {
-                color: $primary-color;
-                opacity: 1;
-
-                .icon {
-                    fill: $primary-color;
-                }
-            }
-        }
-    }
-}
-
 .channel-header-archived-icon {
     position: relative;
     top: 2px;
     margin-right: 5px;
+    fill: var(--center-channel-color);
 }

webapp/channels/src/sass/layout/_navigation.scss

@@ -8,6 +8,7 @@
 .nav-tabs {
     margin-bottom: 10px;
     background: var(--center-channel-bg);
+    color: var(--center-channel-color);
 
     > li {
         margin-right: 5px;
@@ -15,6 +16,7 @@
         &.active {
             > a {
                 background: var(--center-channel-bg);
+                color: var(--center-channel-color);
             }
         }
 

webapp/channels/src/sass/layout/_sidebar-menu.scss

@@ -111,11 +111,3 @@
         }
     }
 }
-
-.app__body {
-    .modal-tabs {
-        .nav-tabs > li {
-            background-color: var(--center-channel-bg);
-        }
-    }
-}

webapp/channels/src/sass/layout/_sidebar-right.scss

@@ -281,13 +281,6 @@
             font-size: 0.95em;
         }
 
-        .usage__icon {
-            position: relative;
-            top: 3px;
-            margin: 0 3px;
-            opacity: 0.9;
-        }
-
         &.sidebar-expanded {
             width: 52%;
         }

webapp/channels/src/sass/responsive/_mobile.scss

@@ -747,27 +747,6 @@
             padding: 0;
         }
 
-        .post-create-body {
-            padding: 0;
-
-            .send-button {
-                display: block;
-            }
-
-            textarea {
-                .app-content & {
-                    border-right: none;
-                    border-left: none;
-                }
-            }
-
-            .post-body__actions {
-                .Menu.dropdown-menu {
-                    max-height: 80vh;
-                }
-            }
-        }
-
         .msg-typing {
             display: none;
         }
@@ -1420,10 +1399,6 @@
                 border-radius: 3px;
             }
         }
-
-        .channel-header__links {
-            display: none;
-        }
     }
 
     .sidebar--menu {

webapp/channels/src/sass/responsive/_tablet.scss

@@ -59,17 +59,6 @@
         display: none;
     }
 
-    .post-right__scroll {
-        .post-create__container {
-            .post-create-body {
-                .icon__emoji_picker {
-                    top: -7px;
-                    display: none;
-                }
-            }
-        }
-    }
-
     .signup-team__container {
         &.branded {
             display: block;
@@ -507,12 +496,6 @@
                     width: 100% !important;
                 }
             }
-
-            .channel-header__links {
-                position: relative;
-                top: auto;
-                right: auto;
-            }
         }
 
         &.move--left,

webapp/channels/src/sass/routes/_loading.scss

@@ -42,7 +42,7 @@
             height: 4px;
             margin: 0 2px;
             animation: move 0.75s infinite linear;
-            background-color: #444;
+            background-color: var(--center-channel-color);
             border-radius: 10px;
             opacity: 0.1;
         }

webapp/channels/src/sass/routes/_print.scss

@@ -62,7 +62,6 @@
     .post__body .img-div,
     .post-image__thumbnail,
     .post.post--system,
-    #archive-link-home,
     .channel-intro {
         display: none;
     }

webapp/channels/src/utils/utils.tsx

@@ -321,33 +321,8 @@ export function toRgbValues(hexStr: string): string {
 
 export function applyTheme(theme: Theme) {
     if (theme.centerChannelColor) {
-        changeCss('.app__body .bg-text-200', 'background:' + changeOpacity(theme.centerChannelColor, 0.2));
-        changeCss('.app__body .user-popover__role', 'background:' + changeOpacity(theme.centerChannelColor, 0.3));
-        changeCss('.app__body .svg-text-color', 'fill:' + theme.centerChannelColor);
-        changeCss('.app__body .suggestion-list__icon .status.status--group, .app__body .multi-select__note', 'background:' + changeOpacity(theme.centerChannelColor, 0.12));
-        changeCss('.app__body .modal-tabs .nav-tabs > li, .app__body .system-notice, .app__body .file-view--single .file__image .image-loaded, .app__body .post .MenuWrapper .dropdown-menu button, .app__body .member-list__popover .more-modal__body, .app__body .alert.alert-transparent, .app__body .table > thead > tr > th, .app__body .table > tbody > tr > td', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.12));
-        changeCss('.app__body .post-list__arrows', 'fill:' + changeOpacity(theme.centerChannelColor, 0.3));
-        changeCss('.app__body .post .card-icon__container', 'color:' + changeOpacity(theme.centerChannelColor, 0.3));
-        changeCss('.app__body .post-image__details .post-image__download svg', 'stroke:' + changeOpacity(theme.centerChannelColor, 0.4));
-        changeCss('.app__body .post-image__details .post-image__download svg', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.35));
-        changeCss('.app__body .channel-header__links .icon, .app__body .sidebar--right .sidebar--right__subheader .usage__icon, .app__body .more-modal__header svg, .app__body .icon--body', 'fill:' + theme.centerChannelColor);
-        changeCss('@media(min-width: 768px){.app__body .post:hover .post__header .post-menu, .app__body .post.post--hovered .post__header .post-menu, .app__body .post.a11y--active .post__header .post-menu', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
-        changeCss('.app__body .help-text, .app__body .post .post-waiting, .app__body .post.post--system .post__body', 'color:' + changeOpacity(theme.centerChannelColor, 0.6));
-        changeCss('.app__body .nav-tabs, .app__body .nav-tabs > li.active > a, pp__body .input-group-addon, .app__body .app__content, .app__body .post-create__container .post-create-body .btn-file, .app__body .post-create__container .post-create-footer .msg-typing, .app__body .dropdown-menu, .app__body .popover, .app__body .suggestion-list__item .suggestion-list__ellipsis .suggestion-list__main, .app__body .tip-overlay, .app__body .form-control[disabled], .app__body .form-control[readonly], .app__body fieldset[disabled] .form-control', 'color:' + theme.centerChannelColor);
-        changeCss('.app__body .post .post__link', 'color:' + changeOpacity(theme.centerChannelColor, 0.65));
-        changeCss('.app__body #archive-link-home, .video-div .video-thumbnail__error', 'background:' + changeOpacity(theme.centerChannelColor, 0.15));
-        changeCss('.app__body #post-create', 'color:' + theme.centerChannelColor);
-        changeCss('.app__body .mentions--top', 'box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px');
-        changeCss('.app__body .mentions--top', '-webkit-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px');
-        changeCss('.app__body .mentions--top', '-moz-box-shadow:' + changeOpacity(theme.centerChannelColor, 0.2) + ' 1px -3px 12px');
-        changeCss('.app__body .shadow--2', 'box-shadow: 0 20px 30px 0' + changeOpacity(theme.centerChannelColor, 0.1) + ', 0 14px 20px 0 ' + changeOpacity(theme.centerChannelColor, 0.1));
-        changeCss('.app__body .shadow--2', '-moz-box-shadow: 0  20px 30px 0 ' + changeOpacity(theme.centerChannelColor, 0.1) + ', 0 14px 20px 0 ' + changeOpacity(theme.centerChannelColor, 0.1));
-        changeCss('.app__body .shadow--2', '-webkit-box-shadow: 0  20px 30px 0 ' + changeOpacity(theme.centerChannelColor, 0.1) + ', 0 14px 20px 0 ' + changeOpacity(theme.centerChannelColor, 0.1));
-        changeCss('.app__body .shortcut-key, .app__body .post__body hr, .app__body .loading-screen .loading__content .round, .app__body .tutorial__circles .circle', 'background:' + theme.centerChannelColor);
-        changeCss('.app__body .channel-header .heading', 'color:' + theme.centerChannelColor);
         changeCss('.app__body .markdown__table tbody tr:nth-child(2n)', 'background:' + changeOpacity(theme.centerChannelColor, 0.07));
         changeCss('.app__body .channel-header__info .header-dropdown__icon', 'color:' + changeOpacity(theme.centerChannelColor, 0.8));
-        changeCss('.app__body .post-create__container .post-create-body .send-button.disabled i', 'color:' + changeOpacity(theme.centerChannelColor, 0.4));
         changeCss('.app__body .channel-header .pinned-posts-button svg', 'fill:' + changeOpacity(theme.centerChannelColor, 0.6));
         changeCss('.app__body .channel-header .channel-header_plugin-dropdown svg', 'fill:' + changeOpacity(theme.centerChannelColor, 0.6));
         changeCss('.app__body .file-preview, .app__body .post-image__details, .app__body .markdown__table th, .app__body .markdown__table td, .app__body .webhooks__container, .app__body .dropdown-menu', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
@@ -387,7 +362,7 @@ export function applyTheme(theme: Theme) {
         changeCss('.app__body .sidebar--right', 'color:' + theme.centerChannelColor);
         changeCss('.app__body .modal .settings-modal .settings-table .settings-content .appearance-section .theme-elements__body', 'background:' + changeOpacity(theme.centerChannelColor, 0.05));
         changeCss('body', 'scrollbar-arrow-color:' + theme.centerChannelColor);
-        changeCss('.app__body .post-create__container .post-create-body .btn-file svg, .app__body .post.post--compact .post-image__column .post-image__details svg, .app__body .modal .about-modal .about-modal__logo svg, .app__body .status svg, .app__body .edit-post__actions .icon svg', 'fill:' + theme.centerChannelColor);
+        changeCss('.app__body .post.post--compact .post-image__column .post-image__details svg, .app__body .modal .about-modal .about-modal__logo svg, .app__body .status svg, .app__body .edit-post__actions .icon svg', 'fill:' + theme.centerChannelColor);
         changeCss('.app__body .post-list__new-messages-below', 'background:' + changeColor(theme.centerChannelColor, 0.5));
         changeCss('@media(min-width: 768px){.app__body .post.post--compact.same--root.post--comment .post__content', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
         changeCss('.app__body .post.post--comment.current--user .post__body', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
@@ -409,16 +384,15 @@ export function applyTheme(theme: Theme) {
     }
 
     if (theme.linkColor) {
-        changeCss('.app__body .more-modal__list .a11y--focused, .app__body .post.a11y--focused, .app__body .channel-header.a11y--focused, .app__body .post-create.a11y--focused, .app__body .user-popover.a11y--focused, .app__body .post-message__text.a11y--focused, #archive-link-home>a.a11y--focused', 'box-shadow: inset 0 0 1px 3px ' + changeOpacity(theme.linkColor, 0.5) + ', inset 0 0 0 1px ' + theme.linkColor);
+        changeCss('.app__body .more-modal__list .a11y--focused, .app__body .post.a11y--focused, .app__body .channel-header.a11y--focused, .app__body .post-create.a11y--focused, .app__body .user-popover.a11y--focused, .app__body .post-message__text.a11y--focused', 'box-shadow: inset 0 0 1px 3px ' + changeOpacity(theme.linkColor, 0.5) + ', inset 0 0 0 1px ' + theme.linkColor);
         changeCss('.app__body .a11y--focused', 'box-shadow: 0 0 1px 3px ' + changeOpacity(theme.linkColor, 0.5) + ', 0 0 0 1px ' + theme.linkColor);
-        changeCss('.app__body .channel-header .channel-header__favorites.inactive:hover, .app__body .channel-header__links > a.active, .app__body a, .app__body a:focus, .app__body a:hover, .app__body .channel-header__links > .color--link.active, .app__body .color--link, .app__body a:focus, .app__body .color--link:hover', 'color:' + theme.linkColor);
+        changeCss('.app__body .channel-header .channel-header__favorites.inactive:hover, .app__body a, .app__body a:focus, .app__body a:hover, .app__body .color--link, .app__body a:focus, .app__body .color--link:hover', 'color:' + theme.linkColor);
         changeCss('.app__body .attachment .attachment__container', 'border-left-color:' + changeOpacity(theme.linkColor, 0.5));
-        changeCss('.app__body .channel-header .channel-header_plugin-dropdown a:hover, .app__body .member-list__popover .more-modal__list .more-modal__row:hover', 'background:' + changeOpacity(theme.linkColor, 0.08));
-        changeCss('.app__body .channel-header__links .icon:hover, .app__body .channel-header__links > a.active .icon, .app__body .post .post__reply', 'fill:' + theme.linkColor);
-        changeCss('.app__body .channel-header__links .icon:hover, .app__body .post .card-icon__container.active svg, .app__body .post .post__reply', 'fill:' + theme.linkColor);
+        changeCss('.app__body .channel-header .channel-header_plugin-dropdown a:hover', 'background:' + changeOpacity(theme.linkColor, 0.08));
+        changeCss('.app__body .post .post__reply', 'fill:' + theme.linkColor);
+        changeCss('.app__body .post .card-icon__container.active svg, .app__body .post .post__reply', 'fill:' + theme.linkColor);
         changeCss('.app__body .channel-header .pinned-posts-button:hover svg', 'fill:' + changeOpacity(theme.linkColor, 0.6));
-        changeCss('.app__body .member-list__popover .more-modal__actions svg', 'fill:' + theme.linkColor);
-        changeCss('.app__body .modal-tabs .nav-tabs > li.active, .app__body .channel-header .channel-header_plugin-dropdown a:hover, .app__body .member-list__popover .more-modal__list .more-modal__row:hover', 'border-color:' + theme.linkColor);
+        changeCss('.app__body .channel-header .channel-header_plugin-dropdown a:hover', 'border-color:' + theme.linkColor);
         changeCss('.app__body .channel-header .channel-header_plugin-dropdown a:hover svg', 'fill:' + theme.linkColor);
         changeCss('.app__body .channel-header .dropdown-toggle:hover .heading, .app__body .channel-header .dropdown-toggle:hover .header-dropdown__icon, .app__body .channel-header__title .open .heading, .app__body .channel-header__info .channel-header__title .open .header-dropdown__icon, .app__body .channel-header__title .open .heading, .app__body .channel-header__info .channel-header__title .open .heading', 'color:' + theme.linkColor);
         changeCss('.emoji-picker__container .icon--emoji.active svg', 'fill:' + theme.linkColor);