sidebars: Refactor to remove .default-sidebar-behaviour.

Despite the comment in `ui_init.js`, this class is never in fact
removed, and appears only to add unnecessary complexity to certain
selectors, which are here cleaned up.
This commit is contained in:
Karl Stolley
2025-02-20 11:33:30 -06:00
committed by Tim Abbott
parent c9109ef736
commit 0ce20fb515
2 changed files with 69 additions and 74 deletions

View File

@@ -298,13 +298,6 @@ export function initialize_kitchen_sink_stuff() {
$("body").addClass("more-dense-mode");
}
// To keep the specificity same for the CSS related to hiding the
// sidebars, we add the class to the body which is then later replaced
// by the class to hide right / left sidebar. We can take our time to do
// this since we are still showing the loading indicator screen and
// the rendered sidebars hasn't been displayed to the user yet.
$("body").addClass("default-sidebar-behaviour");
$(window).on("blur", () => {
$(document.body).addClass("window_blurred");
});

View File

@@ -1482,8 +1482,7 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
}
@media (width < $xl_min) or (height < $short_navbar_cutoff_height) {
.default-sidebar-behaviour {
&.spectator-view.default-sidebar-behaviour {
.spectator-view {
#navbar-middle {
/* = (width of button, square with header) * 3 (number of buttons) + 10px extra margin. */
margin-right: calc(var(--header-height) * 3 + 10px);
@@ -1494,11 +1493,11 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
position: relative;
right: var(--header-height);
}
}
&.spectator-view #top_navbar .column-right .spectator_login_buttons {
#top_navbar .column-right .spectator_login_buttons {
display: none;
}
}
.header-main .column-right {
/* For a diminutive right column in the navbar,
@@ -1507,10 +1506,9 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
width: auto;
}
}
}
%hide-right-sidebar {
.app-main .column-right {
.column-right {
display: none;
&.expanded {
@@ -1544,7 +1542,9 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
}
.hide-right-sidebar {
.app-main {
@extend %hide-right-sidebar;
}
&.fluid_layout_width {
#compose-content,
@@ -1559,7 +1559,7 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
}
%hide-left-sidebar {
.app-main .column-left {
.column-left {
display: none;
&.expanded {
@@ -1586,7 +1586,9 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
}
.hide-left-sidebar {
.app-main {
@extend %hide-left-sidebar;
}
&.fluid_layout_width {
#compose-content,
@@ -1605,8 +1607,9 @@ body:not(.hide-left-sidebar) {
}
@media (width < $xl_min) {
.default-sidebar-behaviour {
.app-main {
@extend %hide-right-sidebar;
}
.app-main .column-middle {
margin-right: 7px;
@@ -1622,7 +1625,6 @@ body:not(.hide-left-sidebar) {
#compose-content {
margin-right: 7px;
}
}
.hide-left-sidebar {
#compose-content,
@@ -1649,8 +1651,9 @@ body:not(.hide-left-sidebar) {
}
@media (width < $md_min) {
.default-sidebar-behaviour {
.app-main {
@extend %hide-left-sidebar;
}
.header-main .column-left {
display: none;
@@ -1690,7 +1693,6 @@ body:not(.hide-left-sidebar) {
margin-left: 7px;
}
}
}
@media (height < $short_navbar_cutoff_height) {
.app-main .column-right.expanded .right-sidebar,