mirror of https://github.com/zulip/zulip.git
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:
parent
23dae53f1c
commit
341c25d087
|
@ -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%);
|
||||||
|
|
|
@ -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%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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);
|
||||||
|
|
Loading…
Reference in New Issue