[MM-23808] Fixed the experimental sidebar header to use the correct t…

…hemeing, also fixed the border. (#5260)
mattermost · Apr 2, 2020 · 95e4294 · 95e4294
1 parent 09014d4
commit 95e4294
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/sass/layout/_sidebar-left.scss b/sass/layout/_sidebar-left.scss
@@ -28,9 +28,9 @@
  flex-direction: column;
  position: fixed;
  left: 0;
- // TODO: Devin changed
  height: 100%;
  z-index: 12;
+ border-right: 1px solid var(--center-channel-color-20);
 
  body.announcement-bar--fixed & {
  height: calc(100% - #{$announcement-bar-height});
@@ -68,6 +68,18 @@
  .SidebarHeader {
  background-color: var(--sidebar-header-bg);
 
+ .header__info {
+ color: var(--sidebar-header-text-color);
+
+ .user__name {
+ color: var(--sidebar-header-text-color-80);
+ }
+
+ &:hover .user__name {
+ color: var(--sidebar-header-text-color);
+ }
+ }
+
  .status-wrapper {
  height: 36px;
  width: 36px;

diff --git a/utils/utils.jsx b/utils/utils.jsx
@@ -892,6 +892,7 @@ export function applyTheme(theme) {
  'sidebar-text-active-color': theme.sidebarTextActiveColor,
  'sidebar-header-bg': theme.sidebarHeaderBg,
  'sidebar-header-text-color': theme.sidebarHeaderTextColor,
+ 'sidebar-header-text-color-80': changeOpacity(theme.sidebarHeaderTextColor, 0.8),
  'online-indicator': theme.onlineIndicator,
  'away-indicator': theme.awayIndicator,
  'dnd-indicator': theme.dndIndicator,