css: Use variables for border colors in sidebars.

This is important step to fix a bug related to making sure css
for `.column-right` doesn't apply in navbar but only `.app-main`.
This commit is contained in:
Aman Agrawal 2024-03-13 13:10:07 +00:00 committed by Tim Abbott
parent 23dae53f1c
commit 341c25d087
3 changed files with 5 additions and 5 deletions

View File

@ -198,6 +198,7 @@
--color-background-popover: hsl(0deg 0% 100%); --color-background-popover: hsl(0deg 0% 100%);
--color-background-alert-word: hsl(18deg 100% 84%); --color-background-alert-word: hsl(18deg 100% 84%);
--color-buddy-list-highlighted-user: hsl(120deg 12.3% 71.4% / 38%); --color-buddy-list-highlighted-user: hsl(120deg 12.3% 71.4% / 38%);
--color-border-sidebar: hsl(0deg 0% 87%);
/* Compose box colors */ /* Compose box colors */
--color-compose-send-button-icon-color: hsl(0deg 0% 100%); --color-compose-send-button-icon-color: hsl(0deg 0% 100%);
@ -500,6 +501,7 @@
--color-background-tab-picker-tab-option-hover: hsl(0deg 0% 100% / 5%); --color-background-tab-picker-tab-option-hover: hsl(0deg 0% 100% / 5%);
--color-background-alert-word: hsl(22deg 70% 35%); --color-background-alert-word: hsl(22deg 70% 35%);
--color-buddy-list-highlighted-user: hsl(136deg 25% 73% / 20%); --color-buddy-list-highlighted-user: hsl(136deg 25% 73% / 20%);
--color-border-sidebar: hsl(0deg 0% 0% / 20%);
/* Compose box colors */ /* Compose box colors */
--color-compose-send-button-focus-shadow: hsl(0deg 0% 100% / 80%); --color-compose-send-button-focus-shadow: hsl(0deg 0% 100% / 80%);

View File

@ -354,10 +354,8 @@
); );
} }
.column-left .left-sidebar,
.stream_name_search_section, .stream_name_search_section,
.group_name_search_section, .group_name_search_section {
.column-right .right-sidebar {
border-color: hsl(0deg 0% 0% / 20%); border-color: hsl(0deg 0% 0% / 20%);
} }

View File

@ -2456,7 +2456,7 @@ select.invite-as {
.right-sidebar { .right-sidebar {
box-shadow: 0 -2px 3px 0 hsl(0deg 0% 0% / 10%); box-shadow: 0 -2px 3px 0 hsl(0deg 0% 0% / 10%);
border-left: 1px solid hsl(0deg 0% 87%); border-left: 1px solid var(--color-border-sidebar);
padding-right: 15px; padding-right: 15px;
padding-left: 15px; padding-left: 15px;
height: 100%; height: 100%;
@ -2499,7 +2499,7 @@ select.invite-as {
.left-sidebar { .left-sidebar {
background-color: var(--color-background); background-color: var(--color-background);
box-shadow: 0 2px 3px 0 hsl(0deg 0% 0% / 10%); box-shadow: 0 2px 3px 0 hsl(0deg 0% 0% / 10%);
border-right: 1px solid hsl(0deg 0% 87%); border-right: 1px solid var(--color-border-sidebar);
height: 100%; height: 100%;
padding-left: 10px; padding-left: 10px;
width: var(--left-sidebar-width); width: var(--left-sidebar-width);