From 238317635bde12abd48ff969e01bc94582054d55 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Gr=C3=A9goire=20Aubert?= Date: Thu, 7 Mar 2024 17:38:53 -0600 Subject: [PATCH] SONAR-21656 Drop old page.css classes and associated --- .../design-system/src/components/Badge.tsx | 5 - .../main/js/app/components/FormattingHelp.tsx | 5 +- .../js/app/components/GlobalContainer.tsx | 53 ++-- .../js/app/components/PluginRiskConsent.tsx | 8 +- .../main/js/app/components/ResetPassword.tsx | 4 +- .../js/app/components/SimpleContainer.tsx | 4 +- .../components/SimpleSessionsContainer.tsx | 4 +- .../main/js/app/styles/components/page.css | 268 ------------------ .../sonar-web/src/main/js/app/styles/sonar.ts | 1 - server/sonar-web/src/main/js/app/theme.js | 2 - .../components/BackgroundTasksApp.tsx | 94 +++--- .../ChangeAdminPasswordAppRenderer.tsx | 2 +- .../components/CodingRulesApp.tsx | 10 - .../components/ComponentMeasuresApp.tsx | 2 +- .../js/apps/issues/components/IssuesApp.tsx | 11 - .../src/main/js/apps/issues/styles.css | 61 ---- .../apps/projects/components/AllProjects.tsx | 4 - .../src/main/js/apps/projects/styles.css | 165 ----------- .../js/apps/quality-gates/components/App.tsx | 24 +- .../apps/quality-gates/components/Details.tsx | 22 +- .../security-hotspots/SecurityHotspotsApp.tsx | 1 - .../SecurityHotspotsAppRenderer.tsx | 1 - .../components/HotspotList.tsx | 5 - .../main/js/apps/security-hotspots/styles.css | 62 ---- .../apps/settings/components/SettingsApp.tsx | 10 - .../src/main/js/apps/settings/styles.css | 170 +---------- .../js/apps/web-api/__tests__/WebApi-it.tsx | 5 - .../js/apps/web-api/components/WebApiApp.tsx | 3 - .../components/common/VisibilitySelector.tsx | 10 +- .../main/js/helpers/__tests__/pages-test.ts | 47 --- server/sonar-web/src/main/js/helpers/pages.ts | 44 --- 31 files changed, 106 insertions(+), 1001 deletions(-) delete mode 100644 server/sonar-web/src/main/js/app/styles/components/page.css delete mode 100644 server/sonar-web/src/main/js/apps/security-hotspots/styles.css delete mode 100644 server/sonar-web/src/main/js/helpers/__tests__/pages-test.ts delete mode 100644 server/sonar-web/src/main/js/helpers/pages.ts diff --git a/server/sonar-web/design-system/src/components/Badge.tsx b/server/sonar-web/design-system/src/components/Badge.tsx index b1cc762001e..54ed4d62289 100644 --- a/server/sonar-web/design-system/src/components/Badge.tsx +++ b/server/sonar-web/design-system/src/components/Badge.tsx @@ -74,11 +74,6 @@ const StyledBadge = styled.span<{ &:empty { ${tw`sw-hidden`} } - - .page-actions & { - ${tw`sw-my-1`}; - ${tw`sw-mx-0`}; - } `; const StyledCounter = styled.span<{ diff --git a/server/sonar-web/src/main/js/app/components/FormattingHelp.tsx b/server/sonar-web/src/main/js/app/components/FormattingHelp.tsx index f41e1dd59cc..473e6c59389 100644 --- a/server/sonar-web/src/main/js/app/components/FormattingHelp.tsx +++ b/server/sonar-web/src/main/js/app/components/FormattingHelp.tsx @@ -17,13 +17,14 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ +import { CenteredLayout } from 'design-system'; import * as React from 'react'; import { Helmet } from 'react-helmet-async'; import { translate } from '../../helpers/l10n'; export default function FormattingHelp() { return ( -
+

Formatting Syntax

@@ -147,6 +148,6 @@ export default function FormattingHelp() {
-
+ ); } diff --git a/server/sonar-web/src/main/js/app/components/GlobalContainer.tsx b/server/sonar-web/src/main/js/app/components/GlobalContainer.tsx index 2669f611a71..50ee227d2b3 100644 --- a/server/sonar-web/src/main/js/app/components/GlobalContainer.tsx +++ b/server/sonar-web/src/main/js/app/components/GlobalContainer.tsx @@ -82,38 +82,36 @@ export default function GlobalContainer() { -
+ -
- - - - -
- - - - - - {/* The following is the portal anchor point for the component nav - * See ComponentContainer.tsx - */} -
-
- - - - - -
+ + + + +
+ + + + + + {/* The following is the portal anchor point for the component nav + * See ComponentContainer.tsx + */} +
+
+ + + + + -
+ @@ -121,6 +119,13 @@ export default function GlobalContainer() { ); } +const GlobalContainerWrapper = styled.div` + display: flex; + flex-direction: column; + height: 100%; + min-height: 100vh; +`; + const GlobalBackground = styled.div<{ secondary: boolean }>` background-color: ${({ secondary }) => themeColor(secondary ? 'backgroundSecondary' : 'backgroundPrimary')}; diff --git a/server/sonar-web/src/main/js/app/components/PluginRiskConsent.tsx b/server/sonar-web/src/main/js/app/components/PluginRiskConsent.tsx index 8ac5fff5109..3d781f422f2 100644 --- a/server/sonar-web/src/main/js/app/components/PluginRiskConsent.tsx +++ b/server/sonar-web/src/main/js/app/components/PluginRiskConsent.tsx @@ -18,7 +18,7 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { ButtonPrimary, Card, Title } from 'design-system'; +import { ButtonPrimary, Card, CenteredLayout, Title } from 'design-system'; import * as React from 'react'; import { Helmet } from 'react-helmet-async'; import { setSimpleSettingValue } from '../../api/settings'; @@ -67,11 +67,11 @@ export function PluginRiskConsent(props: Readonly) { }; return ( - <> + {translate('plugin_risk_consent.title')} @@ -84,7 +84,7 @@ export function PluginRiskConsent(props: Readonly) { {translate('plugin_risk_consent.action')} - + ); } diff --git a/server/sonar-web/src/main/js/app/components/ResetPassword.tsx b/server/sonar-web/src/main/js/app/components/ResetPassword.tsx index 2feeaad91a9..9835794633f 100644 --- a/server/sonar-web/src/main/js/app/components/ResetPassword.tsx +++ b/server/sonar-web/src/main/js/app/components/ResetPassword.tsx @@ -38,10 +38,10 @@ export interface ResetPasswordProps { export function ResetPassword({ currentUser }: Readonly) { return ( - + -
+
{translate('my_account.reset_password')} diff --git a/server/sonar-web/src/main/js/app/components/SimpleContainer.tsx b/server/sonar-web/src/main/js/app/components/SimpleContainer.tsx index b227f4ce5c8..e1876f58752 100644 --- a/server/sonar-web/src/main/js/app/components/SimpleContainer.tsx +++ b/server/sonar-web/src/main/js/app/components/SimpleContainer.tsx @@ -28,8 +28,8 @@ import MainSonarQubeBar from './nav/global/MainSonarQubeBar'; */ export default function SimpleContainer({ children }: { children?: React.ReactNode }) { return ( -
-
+
+
{children !== undefined ? children : }
diff --git a/server/sonar-web/src/main/js/app/components/SimpleSessionsContainer.tsx b/server/sonar-web/src/main/js/app/components/SimpleSessionsContainer.tsx index 8d7d42033b3..9509e39d75a 100644 --- a/server/sonar-web/src/main/js/app/components/SimpleSessionsContainer.tsx +++ b/server/sonar-web/src/main/js/app/components/SimpleSessionsContainer.tsx @@ -27,8 +27,8 @@ export default function SimpleSessionsContainer() { <> -
-
+
+
diff --git a/server/sonar-web/src/main/js/app/styles/components/page.css b/server/sonar-web/src/main/js/app/styles/components/page.css deleted file mode 100644 index 37962ef9a7c..00000000000 --- a/server/sonar-web/src/main/js/app/styles/components/page.css +++ /dev/null @@ -1,268 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -.white-page { - background-color: #fff !important; -} - -.global-container { - display: flex; - flex-direction: column; - height: 100%; - min-height: 100vh; -} - -.page { - z-index: var(--normalZIndex); - padding: 10px 20px; -} - -.page:before, -.page:after { - display: table; - content: ''; - line-height: 0; -} - -.page:after { - clear: both; -} - -.page-limited { - max-width: 1280px; - margin-left: auto; - margin-right: auto; - padding-top: 20px; - padding-bottom: 20px; -} - -.page-container { - min-width: var(--minPageWidth); -} - -.page-wrapper { - box-sizing: border-box; - flex: 1 0 auto; -} - -.page-header { - position: relative; - margin-bottom: 20px; -} - -.page-header:before, -.page-header:after { - display: table; - content: ''; - line-height: 0; -} - -.page-header:after { - clear: both; -} - -.page-title { - float: left; - margin-bottom: 0; - line-height: var(--controlHeight); -} - -.page-actions { - float: right; - margin-bottom: 10px; - margin-left: 10px; - line-height: var(--controlHeight); - text-align: right; -} - -.page-actions .badge { - margin: 3px 0; -} - -.page-description { - float: left; - clear: left; - max-width: 800px; - line-height: 1.5; - margin-top: 6px; -} - -.page-with-sidebar { - display: flex; -} - -.page-main { - flex-grow: 1; -} - -.page-sidebar { - width: 30%; - min-width: 300px; - flex-shrink: 0; - padding-left: 40px; - box-sizing: border-box; -} - -.page-sidebar-fixed { - min-width: 300px; - flex-shrink: 0; - padding-left: 40px; - box-sizing: border-box; - width: 300px; -} - -.page-sidebar-sticky { - width: 320px !important; - padding-right: 0; -} - -.page-limited .page-sidebar-sticky { - margin: -20px 0 -20px -20px; - padding-right: 0 !important; -} - -.page-limited .page-sidebar-sticky .page-sidebar-sticky-inner { - padding: 20px 0; -} - -.page-sidebar-sticky .page-sidebar-sticky-inner { - position: fixed; - z-index: 10; - top: 30px; - bottom: 0; - left: 0; - overflow: auto; - width: calc(50vw - 640px + 280px + 3px); - border-right: 1px solid var(--barBorderColor); - box-sizing: border-box; - background: var(--barBackgroundColor); -} - -@media (max-width: 1335px) { - .page-sidebar-sticky .page-sidebar-sticky-inner { - width: 310px; - } -} - -.layout-page { - display: flex; - align-items: stretch; - width: 100%; - flex-grow: 1; -} - -.layout-page-filters { - width: 260px; - padding: 20px; -} - -.layout-page-main { - flex-grow: 1; - min-width: 740px; - padding: 20px; - z-index: var(--pageMainZIndex); -} - -.layout-page-main-inner { - position: relative; - z-index: var(--normalZIndex); - min-width: 740px; - max-width: 980px; -} - -.layout-page-side-outer { - width: calc(50vw - 370px); - flex-grow: 0; - flex-shrink: 0; - background-color: var(--barBackgroundColor); -} - -.layout-page-side { - position: fixed; - z-index: var(--pageSideZIndex); - top: 30px; - bottom: 0; - left: 0; - width: calc(50vw - 370px); - border-right: 1px solid var(--barBorderColor); - overflow-y: auto; - overflow-x: hidden; - background-color: var(--barBackgroundColor); -} - -.layout-page-side-inner { - width: 300px; - margin-left: calc(50vw - 670px); - background-color: var(--barBackgroundColor); -} - -.layout-page-header-panel, -.layout-page-header-panel-inner { - height: 56px; - box-sizing: border-box; -} - -.layout-page-header-panel { - margin-top: -20px; -} - -.layout-page-header-panel-inner { - position: fixed; - z-index: 30; - line-height: var(--controlHeight); - padding-top: 16px; - padding-bottom: 16px; - border-bottom: 1px solid var(--barBorderColor); - background-color: var(--barBackgroundColor); -} - -.layout-page-main-header { - position: relative; - z-index: var(--aboveNormalZIndex); - margin-bottom: 20px; -} - -.layout-page-main-header .component-name { - line-height: var(--controlHeight); -} - -.layout-page-main-header-inner { - left: calc(50vw - 370px + 1px); - right: 0; - padding-left: 20px; - padding-right: 20px; -} - -@media (max-width: 1320px) { - .layout-page-side-outer { - width: 300px; - } - - .layout-page-side { - width: 300px; - } - - .layout-page-side-inner { - margin-left: 0; - } - - .layout-page-main-header-inner { - left: 301px; - } -} diff --git a/server/sonar-web/src/main/js/app/styles/sonar.ts b/server/sonar-web/src/main/js/app/styles/sonar.ts index cf4ba700eb5..bd9a6735581 100644 --- a/server/sonar-web/src/main/js/app/styles/sonar.ts +++ b/server/sonar-web/src/main/js/app/styles/sonar.ts @@ -24,7 +24,6 @@ import '../../../../../public/fonts/Inter/inter.css'; import '../../../../../public/fonts/Ubuntu/Ubuntu.css'; import './components/global-loading.css'; -import './components/page.css'; import './init/base.css'; import './init/misc.css'; import './print.css'; diff --git a/server/sonar-web/src/main/js/app/theme.js b/server/sonar-web/src/main/js/app/theme.js index ad86d643ff8..f6568a90ba5 100644 --- a/server/sonar-web/src/main/js/app/theme.js +++ b/server/sonar-web/src/main/js/app/theme.js @@ -218,8 +218,6 @@ module.exports = { globalNavContentHeight: `${4 * grid}px`, - maxPageWidth: '1320px', - minPageWidth: '1080px', pagePadding: '20px', }, diff --git a/server/sonar-web/src/main/js/apps/background-tasks/components/BackgroundTasksApp.tsx b/server/sonar-web/src/main/js/apps/background-tasks/components/BackgroundTasksApp.tsx index 16e02e9b520..f462ab82d38 100644 --- a/server/sonar-web/src/main/js/apps/background-tasks/components/BackgroundTasksApp.tsx +++ b/server/sonar-web/src/main/js/apps/background-tasks/components/BackgroundTasksApp.tsx @@ -17,7 +17,8 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { LargeCenteredLayout, PageContentFontWrapper, Spinner } from 'design-system'; +import { Spinner } from '@sonarsource/echoes-react'; +import { LargeCenteredLayout, PageContentFontWrapper } from 'design-system'; import { debounce } from 'lodash'; import * as React from 'react'; import { Helmet } from 'react-helmet-async'; @@ -215,15 +216,6 @@ export class BackgroundTasksApp extends React.PureComponent { const { component, location } = this.props; const { loading, pagination, types, tasks } = this.state; - if (!types) { - return ( -
- - -
- ); - } - const status = location.query.status || DEFAULT_FILTERS.status; const taskType = location.query.taskType || DEFAULT_FILTERS.taskType; const currents = location.query.currents || DEFAULT_FILTERS.currents; @@ -233,48 +225,50 @@ export class BackgroundTasksApp extends React.PureComponent { return ( - + -
- - - - - - - - + +
+ + + + + + + + + ); diff --git a/server/sonar-web/src/main/js/apps/change-admin-password/ChangeAdminPasswordAppRenderer.tsx b/server/sonar-web/src/main/js/apps/change-admin-password/ChangeAdminPasswordAppRenderer.tsx index 8d56f7b1cdc..43a11c52981 100644 --- a/server/sonar-web/src/main/js/apps/change-admin-password/ChangeAdminPasswordAppRenderer.tsx +++ b/server/sonar-web/src/main/js/apps/change-admin-password/ChangeAdminPasswordAppRenderer.tsx @@ -74,7 +74,7 @@ export default function ChangeAdminPasswordAppRenderer( } return ( - + diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/CodingRulesApp.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/CodingRulesApp.tsx index 01a7b24531d..94eaa811692 100644 --- a/server/sonar-web/src/main/js/apps/coding-rules/components/CodingRulesApp.tsx +++ b/server/sonar-web/src/main/js/apps/coding-rules/components/CodingRulesApp.tsx @@ -42,12 +42,6 @@ import '../../../components/search-navigator.css'; import { isInput, isShortcut } from '../../../helpers/keyboardEventHelpers'; import { KeyboardKeys } from '../../../helpers/keycodes'; import { translate, translateWithParameters } from '../../../helpers/l10n'; -import { - addSideBarClass, - addWhitePageClass, - removeSideBarClass, - removeWhitePageClass, -} from '../../../helpers/pages'; import { SecurityStandard } from '../../../types/security'; import { SettingsKey } from '../../../types/settings'; import { Dict, Paging, RawQuery, Rule, RuleActivation } from '../../../types/types'; @@ -135,8 +129,6 @@ export class CodingRulesApp extends React.PureComponent { componentDidMount() { this.mounted = true; - addWhitePageClass(); - addSideBarClass(); this.attachShortcuts(); this.fetchInitialData(); } @@ -154,8 +146,6 @@ export class CodingRulesApp extends React.PureComponent { componentWillUnmount() { this.mounted = false; - removeWhitePageClass(); - removeSideBarClass(); this.detachShortcuts(); } diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/ComponentMeasuresApp.tsx b/server/sonar-web/src/main/js/apps/component-measures/components/ComponentMeasuresApp.tsx index 1d87561d1ad..e0ea9d3461b 100644 --- a/server/sonar-web/src/main/js/apps/component-measures/components/ComponentMeasuresApp.tsx +++ b/server/sonar-web/src/main/js/apps/component-measures/components/ComponentMeasuresApp.tsx @@ -280,7 +280,7 @@ class ComponentMeasuresApp extends React.PureComponent { - + {measures.length > 0 ? (
diff --git a/server/sonar-web/src/main/js/apps/issues/components/IssuesApp.tsx b/server/sonar-web/src/main/js/apps/issues/components/IssuesApp.tsx index f793b5bc2b6..7f105354cdd 100644 --- a/server/sonar-web/src/main/js/apps/issues/components/IssuesApp.tsx +++ b/server/sonar-web/src/main/js/apps/issues/components/IssuesApp.tsx @@ -63,12 +63,6 @@ import { parseIssueFromResponse } from '../../../helpers/issues'; import { isInput, isShortcut } from '../../../helpers/keyboardEventHelpers'; import { KeyboardKeys } from '../../../helpers/keycodes'; import { translate, translateWithParameters } from '../../../helpers/l10n'; -import { - addSideBarClass, - addWhitePageClass, - removeSideBarClass, - removeWhitePageClass, -} from '../../../helpers/pages'; import { serializeDate } from '../../../helpers/query'; import { withBranchLikes } from '../../../queries/branch'; import { BranchLike } from '../../../types/branch-like'; @@ -225,8 +219,6 @@ export class App extends React.PureComponent { return; } - addWhitePageClass(); - addSideBarClass(); this.attachShortcuts(); if (!this.props.isFetchingBranch) { @@ -272,9 +264,6 @@ export class App extends React.PureComponent { componentWillUnmount() { this.detachShortcuts(); this.mounted = false; - - removeWhitePageClass(); - removeSideBarClass(); } attachShortcuts() { diff --git a/server/sonar-web/src/main/js/apps/issues/styles.css b/server/sonar-web/src/main/js/apps/issues/styles.css index a728b86e641..5b84774f3a0 100644 --- a/server/sonar-web/src/main/js/apps/issues/styles.css +++ b/server/sonar-web/src/main/js/apps/issues/styles.css @@ -17,33 +17,6 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -.not-all-issue-warning.open-issue-list { - background-color: var(--barBackgroundColor); - box-sizing: border-box; - display: inline-block; - padding: 16px 16px 0; - position: sticky; - top: 0; - z-index: 1000; -} - -.issues .issue-list { - /* no math, just a good guess */ - min-width: 640px; - width: 800px; -} - -.issues .issue a:focus, -.issues .issue button:focus { - box-shadow: none; -} - -@media (max-width: 1320px) { - .issues .issue-list { - width: calc(60vw - 40px); - } -} - .issue-location { display: inline-block; vertical-align: top; @@ -52,37 +25,3 @@ background-color: var(--issueBgColor); transition: background-color 0.3s ease; } - -.issues-workspace-list-component { - padding: 15px 0 6px; -} - -.issues-workspace-list-item + .issues-workspace-list-item { - margin-top: 5px; -} - -li:first-child .issues-workspace-list-component { - padding-top: 0; -} - -.issues-predefined-periods { - display: flex; -} - -.issues-predefined-periods .search-navigator-facet { - width: auto; - margin-right: calc(var(--gridSize) / 2); -} - -.bulk-change-radio-button { - margin: 0 calc(-1 * var(--gridSize) / 2); - padding: 0 calc(var(--gridSize) / 2); -} - -.bulk-change-radio-button:hover { - background-color: var(--barBackgroundColor); -} - -.layout-page-main.open-issue { - padding-top: 0; -} diff --git a/server/sonar-web/src/main/js/apps/projects/components/AllProjects.tsx b/server/sonar-web/src/main/js/apps/projects/components/AllProjects.tsx index 51005341c29..97500dae71d 100644 --- a/server/sonar-web/src/main/js/apps/projects/components/AllProjects.tsx +++ b/server/sonar-web/src/main/js/apps/projects/components/AllProjects.tsx @@ -41,7 +41,6 @@ import { Location, Router, withRouter } from '../../../components/hoc/withRouter import '../../../components/search-navigator.css'; import handleRequiredAuthentication from '../../../helpers/handleRequiredAuthentication'; import { translate } from '../../../helpers/l10n'; -import { addSideBarClass, removeSideBarClass } from '../../../helpers/pages'; import { get, save } from '../../../helpers/storage'; import { isDefined } from '../../../helpers/types'; import { AppState } from '../../../types/appstate'; @@ -94,8 +93,6 @@ export class AllProjects extends React.PureComponent { } this.handleQueryChange(); - - addSideBarClass(); } componentDidUpdate(prevProps: Props) { @@ -106,7 +103,6 @@ export class AllProjects extends React.PureComponent { componentWillUnmount() { this.mounted = false; - removeSideBarClass(); } fetchMoreProjects = () => { diff --git a/server/sonar-web/src/main/js/apps/projects/styles.css b/server/sonar-web/src/main/js/apps/projects/styles.css index b5dbdb5aded..060b18ad7df 100644 --- a/server/sonar-web/src/main/js/apps/projects/styles.css +++ b/server/sonar-web/src/main/js/apps/projects/styles.css @@ -17,176 +17,11 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -.projects-page .layout-page-header-panel-inner, -.projects-page .layout-page-header-panel { - height: 98px; - line-height: normal; -} - -.projects-topbar-item + .projects-topbar-item { - padding-left: 24px; -} - -.projects-topbar-item.is-last { - margin-left: auto; - padding-left: 32px; -} - -.projects-topbar-item-search { - position: relative; - flex: 1; - height: var(--controlHeight); -} - -.projects-header-row { - padding-top: 2px; -} - -.projects-list .page-actions { - margin-bottom: 0; -} - -.project-card-name { - font-weight: 600; -} .projects-leak-sorting-option.is-focused { background-color: var(--leakSecondaryColor); } -.projects-facet-list { - padding-left: 10px; - padding-right: 10px; -} - -.projects-facets-header { - margin-bottom: 10px; - padding: 10px 0; - border-bottom: 1px solid var(--barBorderColor); -} - -.projects-facets-reset { - float: right; -} - -.projects-facet-bar { - display: inline-block; - width: 60px; - margin-left: 8px; -} - -.projects-facet-bar-inner { - min-width: 1px; - height: 10px; - background-color: var(--gray60); - transition: width 0.3s ease; -} - -.projects-empty-list { - padding: calc(4 * var(--gridSize)) 0; - text-align: center; -} - -/*** - Custom filter highlights. - Projects filters are special, as some elements allow the selection of "everything - worse than" filters (e.g., "Rating B or worse"). We still select a single element, - but we want to give a visual indication that we selected multiple fitlers. - That's where the following selectors come in, which extend and override styles - from ../../components/search-navigator.css -***/ - -/* - Completely remove the border of the child facet. Handle them at the parent -
  • level. -*/ -.search-navigator-facet-worse-than-highlight .search-navigator-facet { - border: 0 !important; -} - -.search-navigator-facet-worse-than-highlight { - padding: 1px 0; - border-width: 0 1px; - border-color: transparent; - border-style: solid; - box-sizing: border-box; -} - -/* - When: - - Being hovered - - Or, being a sibling of something hovered - - Or, being active - - Or, being a sibling of something active - show the left and right borders. -*/ -.search-navigator-facet-worse-than-highlight:hover, -.search-navigator-facet-worse-than-highlight:hover ~ .search-navigator-facet-worse-than-highlight, -.search-navigator-facet-worse-than-highlight.active, -.search-navigator-facet-worse-than-highlight.active ~ .search-navigator-facet-worse-than-highlight { - border-left-color: var(--blue); - border-right-color: var(--blue); -} - -/* - When: - - Being hovered - - Or, being active - show the top border, and remove the top padding. -*/ -.search-navigator-facet-worse-than-highlight:hover, -.search-navigator-facet-worse-than-highlight.active { - border-top: 1px solid var(--blue) !important; - border-top-left-radius: 2px; - border-top-right-radius: 2px; - padding-top: 0 !important; -} - -/* - When: - - Being hovered AND the last element of the highlightable group - - Or, being the last element of the highlightable group AND a sibling of something hovered - - Or, being active AND the last element of the highlightable group - - Or, being the last element of the highlightable group AND a sibling of something active - show the bottom border, and remove the bottom padding. -*/ -.search-navigator-facet-worse-than-highlight.last:hover, -.search-navigator-facet-worse-than-highlight:hover - ~ .search-navigator-facet-worse-than-highlight.last, -.search-navigator-facet-worse-than-highlight.active.last, -.search-navigator-facet-worse-than-highlight.active - ~ .search-navigator-facet-worse-than-highlight.last { - border-bottom: 1px solid var(--blue) !important; - border-bottom-left-radius: 2px; - border-bottom-right-radius: 2px; - padding-bottom: 0 !important; -} - -/* - When: - - Being active - - Or, being a sibling of something active - show a light blue background color. -*/ -.search-navigator-facet-worse-than-highlight.active, -.search-navigator-facet-worse-than-highlight.active ~ .search-navigator-facet-worse-than-highlight { - background-color: var(--veryLightBlue); -} - -/* - When: - - Being hovered AND a sibling of something active - - Or, being a sibling of something hovered AND a sibling of something active - show a darker blue background color. -*/ -.search-navigator-facet-worse-than-highlight.active - ~ .search-navigator-facet-worse-than-highlight:hover, -.search-navigator-facet-worse-than-highlight.active - ~ .search-navigator-facet-worse-than-highlight:hover - ~ .search-navigator-facet-worse-than-highlight { - background-color: #a1cde8; -} - .project-filters-list { /* * On Firefox on Windows, the scrollbar hides the sidebar's content. diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/App.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/App.tsx index 1999ac44710..020f38b8e95 100644 --- a/server/sonar-web/src/main/js/apps/quality-gates/components/App.tsx +++ b/server/sonar-web/src/main/js/apps/quality-gates/components/App.tsx @@ -20,6 +20,7 @@ import { withTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { + Card, LAYOUT_FOOTER_HEIGHT, LAYOUT_GLOBAL_NAV_HEIGHT, LargeCenteredLayout, @@ -35,12 +36,6 @@ import { useNavigate, useParams } from 'react-router-dom'; import Suggestions from '../../../components/embed-docs-modal/Suggestions'; import '../../../components/search-navigator.css'; import { translate, translateWithParameters } from '../../../helpers/l10n'; -import { - addSideBarClass, - addWhitePageClass, - removeSideBarClass, - removeWhitePageClass, -} from '../../../helpers/pages'; import { getQualityGateUrl } from '../../../helpers/urls'; import { useQualityGatesQuery } from '../../../queries/quality-gates'; import { QualityGate } from '../../../types/types'; @@ -72,16 +67,6 @@ export default function App() { [navigate], ); - useEffect(() => { - addWhitePageClass(); - addSideBarClass(); - - return () => { - removeWhitePageClass(); - removeSideBarClass(); - }; - }, []); - useEffect(() => { if (!name) { openDefault(qualityGates); @@ -102,7 +87,7 @@ export default function App() { - +
    - +
  • )}
    @@ -133,7 +118,6 @@ export default function App() { const StyledContentWrapper = withTheme(styled.div` box-sizing: border-box; - border-radius: 4px; background-color: ${themeColor('filterbar')}; border: ${themeBorder('default', 'filterbarBorder')}; overflow-x: hidden; diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx index 8d2714cb474..dbc24083432 100644 --- a/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx +++ b/server/sonar-web/src/main/js/apps/quality-gates/components/Details.tsx @@ -17,7 +17,7 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -import { Spinner } from 'design-system'; +import { Spinner } from '@sonarsource/echoes-react'; import * as React from 'react'; import { Helmet } from 'react-helmet-async'; import { useQualityGateQuery } from '../../../queries/quality-gates'; @@ -32,16 +32,14 @@ export default function Details({ qualityGateName }: Readonly) { const { data: qualityGate, isLoading, isFetching } = useQualityGateQuery(qualityGateName); return ( -
    - - {qualityGate && ( - <> - - - - - )} - -
    + + {qualityGate && ( +
    + + + +
    + )} +
    ); } diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx index 2e85343ff49..da23655ed97 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsApp.tsx @@ -46,7 +46,6 @@ import { import { Component, Dict } from '../../types/types'; import { CurrentUser, isLoggedIn } from '../../types/users'; import SecurityHotspotsAppRenderer from './SecurityHotspotsAppRenderer'; -import './styles.css'; import { SECURITY_STANDARDS, getLocations } from './utils'; const PAGE_SIZE = 500; diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx index 5c3a217693f..fc30449e035 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/SecurityHotspotsAppRenderer.tsx @@ -48,7 +48,6 @@ import HotspotSidebarHeader from './components/HotspotSidebarHeader'; import HotspotSimpleList from './components/HotspotSimpleList'; import HotspotFilterByStatus from './components/HotspotStatusFilter'; import HotspotViewer from './components/HotspotViewer'; -import './styles.css'; export interface SecurityHotspotsAppRendererProps { branchLike?: BranchLike; diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx index cbc7cc4ca8a..a3c15d65334 100644 --- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx +++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotList.tsx @@ -25,7 +25,6 @@ import * as React from 'react'; import { FormattedMessage } from 'react-intl'; import ListFooter from '../../../components/controls/ListFooter'; import { translate } from '../../../helpers/l10n'; -import { removeSideBarClass } from '../../../helpers/pages'; import { HotspotStatusFilter, RawHotspot } from '../../../types/security-hotspots'; import { Dict, StandardSecurityCategories } from '../../../types/types'; import { RISK_EXPOSURE_LEVELS, groupByCategory } from '../utils'; @@ -92,10 +91,6 @@ export default class HotspotList extends React.Component { } } - componentWillUnmount() { - removeSideBarClass(); - } - groupHotspots = (hotspots: RawHotspot[], securityCategories: StandardSecurityCategories) => { const risks = groupBy(hotspots, (h) => h.vulnerabilityProbability); diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/styles.css b/server/sonar-web/src/main/js/apps/security-hotspots/styles.css deleted file mode 100644 index e923e19a886..00000000000 --- a/server/sonar-web/src/main/js/apps/security-hotspots/styles.css +++ /dev/null @@ -1,62 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -#security_hotspots .filter-bar-outer { - height: 62px; -} - -#security_hotspots .filter-bar { - position: fixed; - background-color: var(--barBackgroundColor); - z-index: var(--pageHeaderZIndex); - left: 0; - right: 0; -} - -#security_hotspots .filter-bar-inner { - max-width: 1280px; - margin: 0 auto; - padding: calc(2 * var(--gridSize)) var(--gridSize); - box-sizing: border-box; - border-bottom: 1px solid var(--barBorderColor); -} - -#security_hotspots .layout-page-side, -#security_hotspots .layout-page-side-outer { - width: calc(50vw - 330px); -} - -#security_hotspots .layout-page-side-inner { - margin-left: calc(50vw - 645px); -} - -#security_hotspots .layout-page-main { - padding: 0; -} - -@media (max-width: 1320px) { - #security_hotspots .layout-page-side-outer, - #security_hotspots .layout-page-side { - width: 316px; - } - - #security_hotspots .layout-page-side-inner { - margin-left: 0; - } -} diff --git a/server/sonar-web/src/main/js/apps/settings/components/SettingsApp.tsx b/server/sonar-web/src/main/js/apps/settings/components/SettingsApp.tsx index 33829de00fe..46a04676ccf 100644 --- a/server/sonar-web/src/main/js/apps/settings/components/SettingsApp.tsx +++ b/server/sonar-web/src/main/js/apps/settings/components/SettingsApp.tsx @@ -20,12 +20,6 @@ import * as React from 'react'; import { getDefinitions } from '../../../api/settings'; import withComponentContext from '../../../app/components/componentContext/withComponentContext'; -import { - addSideBarClass, - addWhitePageClass, - removeSideBarClass, - removeWhitePageClass, -} from '../../../helpers/pages'; import { ExtendedSettingDefinition } from '../../../types/settings'; import { Component } from '../../../types/types'; import '../styles.css'; @@ -46,8 +40,6 @@ class SettingsApp extends React.PureComponent { componentDidMount() { this.mounted = true; - addSideBarClass(); - addWhitePageClass(); this.fetchSettings(); } @@ -59,8 +51,6 @@ class SettingsApp extends React.PureComponent { componentWillUnmount() { this.mounted = false; - removeSideBarClass(); - removeWhitePageClass(); } fetchSettings = async () => { diff --git a/server/sonar-web/src/main/js/apps/settings/styles.css b/server/sonar-web/src/main/js/apps/settings/styles.css index 130b9aff0dc..6993aea752d 100644 --- a/server/sonar-web/src/main/js/apps/settings/styles.css +++ b/server/sonar-web/src/main/js/apps/settings/styles.css @@ -17,49 +17,6 @@ * along with this program; if not, write to the Free Software Foundation, * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ -#settings-page .layout-page-side, -#settings-page .layout-page-side-outer { - width: calc(50vw - 480px); - border-right: none; -} - -#settings-page .layout-page-side-inner { - width: 160px; - margin-left: calc(50vw - 639px); /* 640px -1px for overlapping the border */ -} - -#settings-page .layout-page-main { - padding: 0; -} - -#settings-page .layout-page-main-inner { - max-width: 1110px; -} - -#settings-page .top-bar-outer { - height: 120px; -} - -#settings-page .top-bar { - background-color: #f3f3f3; - position: fixed; - z-index: 55; /* todo */ - left: 0; - right: 0; -} - -#settings-page .top-bar-inner { - max-width: 1280px; - margin: 0 auto; - height: 120px; - box-sizing: border-box; -} - -#settings-page .page-title, -#settings-page .page-description { - float: none; -} - .settings-definitions-list > li + li { margin-top: 30px; } @@ -73,65 +30,23 @@ align-items: stretch; } -.tabbed-definitions .settings-definition { - margin: 0 -16px; - padding: 10px 16px; -} - -.settings-definition-changed { - border-top: 1px solid var(--alertBorderWarning); - border-bottom: 1px solid var(--alertBorderWarning); - background-color: var(--alertBackgroundWarning); -} - .settings-definition-left { width: 330px; padding-right: 30px; box-sizing: border-box; } -.radio-card .settings-definition-left { - padding-right: 0; -} - .settings-definition-right { position: relative; width: calc(100% - 330px); box-sizing: border-box; } -.radio-card .settings-definition-right input { - width: 100%; -} - .settings-definition-name { text-overflow: ellipsis; } -.settings-definition-key { - line-height: 1.5; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -.settings-definition-state { - min-height: 32px; - padding-bottom: 4px; -} - -.settings-definition-state > span { - display: flex; -} - -.settings-definition-changes { - margin-top: 20px; - padding-top: 20px; - border-top: 1px dotted var(--barBorderColor); -} - -.settings-sub-categories-list > li + li, -.settings-sub-category { +.settings-sub-categories-list > li + li { margin: 30px -20px 0; padding: 30px 20px; border-top: 1px solid var(--barBorderColor); @@ -142,91 +57,8 @@ font-size: var(--bigFontSize); } -.settings-sub-category-description { - margin-top: -15px; - margin-bottom: 20px; - color: var(--secondFontColor); -} - .settings-large-input { width: 100% !important; max-width: 400px; min-width: 200px; } - -.side-tabs-menu { - margin-top: calc(2 * var(--gridSize)); -} - -.side-tabs-menu > li { - margin-bottom: 4px; -} - -.side-tabs-menu > li > a { - display: block; - padding: 10px 10px; - line-height: 1.5; - border-top-left-radius: 3px; - border-bottom-left-radius: 3px; - border: 1px solid var(--barBorderColor); - border-right: none; - overflow: hidden; - text-overflow: ellipsis; - transition: - color 0.3s ease, - background-color 0.3s ease; -} - -.side-tabs-menu > li > a:hover, -.side-tabs-menu > li > a:focus, -.side-tabs-menu > li > a.active { - background-color: #fff; -} - -.side-tabs-menu > li > a.active { - color: var(--baseFontColor); - cursor: default; -} - -@media (max-width: 1320px) { - #settings-page .layout-page-side-outer, - #settings-page .layout-page-side { - width: 180px; - } - - #settings-page .layout-page-side-inner { - margin-left: 20px; - } - - #settings-page .top-bar-inner { - margin: 0 20px; - } -} - -.settings-search-results { - max-height: 50vh; - width: 500px; - overflow-y: auto; - overflow-x: hidden; -} - -.settings-search-results > li > a:hover { - background-color: unset; - border-left-color: unset; -} - -.settings-search-results > li.active > a { - background-color: var(--neutral50); - border-left-color: var(--blacka60); -} - -.fixed-footer { - position: sticky; - bottom: 0px; - align-items: center; - display: flex; - border: 1px solid var(--gray80); - background-color: white; - justify-content: space-between; - margin: 0px -16px; -} diff --git a/server/sonar-web/src/main/js/apps/web-api/__tests__/WebApi-it.tsx b/server/sonar-web/src/main/js/apps/web-api/__tests__/WebApi-it.tsx index 18805f97356..efee505814b 100644 --- a/server/sonar-web/src/main/js/apps/web-api/__tests__/WebApi-it.tsx +++ b/server/sonar-web/src/main/js/apps/web-api/__tests__/WebApi-it.tsx @@ -27,11 +27,6 @@ jest.mock('../../../components/common/ScreenPositionHelper'); const webApiHandler = new WebApiServiceMock(); -jest.mock('../../../helpers/pages', () => ({ - addSideBarClass: jest.fn(), - removeSideBarClass: jest.fn(), -})); - beforeAll(() => { webApiHandler.reset(); }); diff --git a/server/sonar-web/src/main/js/apps/web-api/components/WebApiApp.tsx b/server/sonar-web/src/main/js/apps/web-api/components/WebApiApp.tsx index d0c92dab643..e75cd5e728e 100644 --- a/server/sonar-web/src/main/js/apps/web-api/components/WebApiApp.tsx +++ b/server/sonar-web/src/main/js/apps/web-api/components/WebApiApp.tsx @@ -34,7 +34,6 @@ import A11ySkipTarget from '../../../components/a11y/A11ySkipTarget'; import Suggestions from '../../../components/embed-docs-modal/Suggestions'; import { Location, Router, withRouter } from '../../../components/hoc/withRouter'; import { translate } from '../../../helpers/l10n'; -import { addSideBarClass, removeSideBarClass } from '../../../helpers/pages'; import { WebApi } from '../../../types/types'; import '../styles/web-api.css'; import { @@ -66,7 +65,6 @@ export class WebApiApp extends React.PureComponent { componentDidMount() { this.mounted = true; this.fetchList(); - addSideBarClass(); } componentDidUpdate() { @@ -76,7 +74,6 @@ export class WebApiApp extends React.PureComponent { componentWillUnmount() { this.mounted = false; - removeSideBarClass(); } fetchList() { diff --git a/server/sonar-web/src/main/js/components/common/VisibilitySelector.tsx b/server/sonar-web/src/main/js/components/common/VisibilitySelector.tsx index 88bf598a83d..51f3effe069 100644 --- a/server/sonar-web/src/main/js/components/common/VisibilitySelector.tsx +++ b/server/sonar-web/src/main/js/components/common/VisibilitySelector.tsx @@ -18,7 +18,7 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import classNames from 'classnames'; -import { Note, RadioButton } from 'design-system'; +import { RadioButton } from 'design-system'; import * as React from 'react'; import { translate } from '../../helpers/l10n'; import { Visibility } from '../../types/component'; @@ -27,14 +27,13 @@ export interface VisibilitySelectorProps { canTurnToPrivate?: boolean; className?: string; onChange: (visibility: Visibility) => void; - showDetails?: boolean; visibility?: Visibility; disabled?: boolean; loading?: boolean; } export default function VisibilitySelector(props: VisibilitySelectorProps) { - const { className, canTurnToPrivate, visibility, showDetails, disabled, loading = false } = props; + const { className, canTurnToPrivate, visibility, disabled, loading = false } = props; return (
    {Object.values(Visibility).map((v) => ( @@ -46,10 +45,7 @@ export default function VisibilitySelector(props: VisibilitySelectorProps) { onCheck={props.onChange} disabled={disabled || (v === Visibility.Private && !canTurnToPrivate) || loading} > -
    - {translate('visibility', v)} - {showDetails && {translate('visibility', v, 'description.long')}} -
    +
    {translate('visibility', v)}
    ))}
    diff --git a/server/sonar-web/src/main/js/helpers/__tests__/pages-test.ts b/server/sonar-web/src/main/js/helpers/__tests__/pages-test.ts deleted file mode 100644 index 3771c48a555..00000000000 --- a/server/sonar-web/src/main/js/helpers/__tests__/pages-test.ts +++ /dev/null @@ -1,47 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import { - addSideBarClass, - addWhitePageClass, - removeSideBarClass, - removeWhitePageClass, -} from '../pages'; - -describe('class adders', () => { - it.each([ - [addSideBarClass, 'sidebar-page'], - [addWhitePageClass, 'white-page'], - ])('%s should add the class', (fct, cls) => { - const toggle = jest.spyOn(document.body.classList, 'toggle'); - fct(); - expect(toggle).toHaveBeenCalledWith(cls, true); - }); -}); - -describe('class removers', () => { - it.each([ - [removeSideBarClass, 'sidebar-page'], - [removeWhitePageClass, 'white-page'], - ])('%s should add the class', (fct, cls) => { - const toggle = jest.spyOn(document.body.classList, 'toggle'); - fct(); - expect(toggle).toHaveBeenCalledWith(cls, false); - }); -}); diff --git a/server/sonar-web/src/main/js/helpers/pages.ts b/server/sonar-web/src/main/js/helpers/pages.ts deleted file mode 100644 index dd3ba179191..00000000000 --- a/server/sonar-web/src/main/js/helpers/pages.ts +++ /dev/null @@ -1,44 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2024 SonarSource SA - * mailto:info AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -const CLASS_SIDEBAR_PAGE = 'sidebar-page'; -const CLASS_WHITE_PAGE = 'white-page'; - -export function addSideBarClass() { - toggleBodyClass(CLASS_SIDEBAR_PAGE, true); -} - -export function addWhitePageClass() { - toggleBodyClass(CLASS_WHITE_PAGE, true); -} - -export function removeSideBarClass() { - toggleBodyClass(CLASS_SIDEBAR_PAGE, false); -} - -export function removeWhitePageClass() { - toggleBodyClass(CLASS_WHITE_PAGE, false); -} - -function toggleBodyClass(className: string, force: boolean) { - document.body.classList.toggle(className, force); - if (document.documentElement) { - document.documentElement.classList.toggle(className, force); - } -} -- 2.39.5