* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-/* eslint-disable no-console */
-function getCustomProperties() {
- const customProperties = {};
- const parseCustomProperties = (theme) => {
- Object.keys(theme).forEach((key) => {
- if (typeof theme[key] === 'object') {
- parseCustomProperties(theme[key]);
- } else if (typeof theme[key] === 'string') {
- if (!customProperties[`--${key}`]) {
- customProperties[`--${key}`] = theme[key];
- } else {
- console.error(
- `Custom CSS property "${key}" already exists with value "${
- customProperties[`--${key}`]
- }".`,
- );
- process.exit(1);
- }
- }
- });
- };
- parseCustomProperties(require('../src/main/js/app/theme-old'));
-
- return customProperties;
-}
// See https://github.com/evanw/esbuild/issues/337
function importAsGlobals(mapping) {
}
module.exports = {
- getCustomProperties,
importAsGlobals,
// NOTE: esbuild will transpile the _syntax_ down to what the TARGET_BROWSERS understand.
// It will _not_, however, polyfill missing API methods, such as String.prototype.replaceAll
"jest": "29.7.0",
"postcss": "8.4.47",
"postcss-calc": "10.0.2",
- "postcss-custom-properties": "12.1.11",
"prettier": "3.3.3",
"prettier-plugin-organize-imports": "4.1.0",
"twin.macro": "3.4.1",
import autoprefixer from 'autoprefixer';
import { resolve } from 'node:path';
import postCssCalc from 'postcss-calc';
-import postCssCustomProperties from 'postcss-custom-properties';
import tailwind from 'tailwindcss';
import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';
-import { getCustomProperties } from '../config/utils';
import babelConfig from './babel.config';
import * as packageJson from './package.json';
-const customProperties = getCustomProperties();
-
// https://vitejs.dev/config/
export default defineConfig({
build: {
},
css: {
postcss: {
- plugins: [
- tailwind('../tailwind.config.js'),
- autoprefixer,
- postCssCustomProperties({
- importFrom: { customProperties },
- preserve: false,
- }),
- postCssCalc,
- ],
+ plugins: [tailwind('../tailwind.config.js'), autoprefixer, postCssCalc],
},
},
esbuild: {
"path-browserify": "1.0.1",
"postcss": "8.4.47",
"postcss-calc": "10.0.2",
- "postcss-custom-properties": "12.1.11",
"prettier": "3.3.3",
"prettier-plugin-organize-imports": "4.1.0",
"rollup-plugin-visualizer": "5.12.0",
kbd,
samp,
tt {
- font-family: var(--sourceCodeFontFamily);
- font-size: var(--smallFontSize);
+ font-family: Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace;
+ font-size: 12px;
line-height: 18px;
}
padding: 0;
height: 1px;
border: none;
- background-color: var(--barBorderColor);
+ background-color: #e6e6e6;
}
}
a {
- color: var(--baseFontColor);
+ color: #333;
border-bottom: none;
}
}
.markdown h2 {
- font-size: var(--bigFontSize);
+ font-size: 16px;
font-weight: 400;
}
.markdown h4,
.markdown h5,
.markdown h6 {
- font-size: var(--baseFontSize);
+ font-size: 13px;
font-weight: 600;
}
.rule-desc h5,
.rule-desc h6 {
- font-size: var(--baseFontSize);
+ font-size: 13px;
font-weight: 600;
}
.markdown pre,
.rule-desc code,
.markdown code {
- font-family: var(--sourceCodeFontFamily);
- font-size: var(--smallFontSize);
+ font-family: Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace;
+ font-size: 12px;
}
.rule-desc pre,
.markdown pre {
- background-color: var(--codeBackground);
+ background-color: #f5f5f5;
border-radius: 8px;
- border: 1px solid var(--codeBorder);
- padding: calc(2 * var(--gridSize));
+ border: 1px solid #e6e6e6;
+ padding: calc(2 * 8px);
margin-top: 0;
margin-bottom: 0;
overflow-x: auto;
.markdown table {
min-width: 50%;
border-collapse: collapse;
- border: 1px solid var(--barBorderColor);
+ border: 1px solid #e6e6e6;
}
.rule-desc th,
.markdown th {
padding: 5px 10px;
- border: 1px solid var(--barBorderColor);
- background-color: var(--barBackgroundColor);
+ border: 1px solid #e6e6e6;
+ background-color: #f3f3f3;
font-weight: 600;
text-align: center;
}
.rule-desc td,
.markdown td {
padding: 5px 10px;
- border: 1px solid var(--barBorderColor);
+ border: 1px solid #e6e6e6;
}
+++ /dev/null
-/*
- * 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.
- */
-// IMPORTANT: any change in this file requires restart of the dev server
-const grid = 8;
-const baseFontSizeRaw = 13;
-
-module.exports = {
- colors: {
- blue: '#4b9fd5',
- veryLightBlue: '#f2faff',
- lightBlue: '#cae3f2',
- darkBlue: '#236a97',
- veryDarkBlue: '#0E516F',
- green: '#00aa00',
- lightGreen: '#b0d513',
- veryLightGreen: '#f5f9fc',
- yellow: '#eabe06',
- orange: '#ed7d20',
- red: '#D02F3A',
- purple: '#9139d4',
-
- gray94: '#efefef',
- gray80: '#cdcdcd',
- gray71: '#b4b4b4',
- gray67: '#aaa',
- gray60: '#888',
- gray52: '#525252',
- gray40: '#404040',
-
- disabledQualityGate: '#757575',
-
- sizeRatingBackground: '#297BAE',
-
- transparentWhite: 'rgba(255,255,255,0.62)',
- transparentGray: 'rgba(200, 200, 200, 0.5)',
- transparentBlack: 'rgba(0, 0, 0, 0.25)',
-
- disableGrayText: '#bbb',
- disableGrayBorder: '#ddd',
- disableGrayBg: '#ebebeb',
-
- barBackgroundColor: '#f3f3f3',
- barBackgroundColorHighlight: '#f8f8f8',
- barBorderColor: '#e6e6e6',
-
- globalNavBarBg: '#262626',
-
- educationPrinciplesBgColor: '#F4F6FF',
- educationPrinciplesBorderColor: '#B0BDF9',
-
- favoriteColor: '#e77213',
- homepageColor: '#D86C13',
-
- // table
- rowHoverHighlight: '#ecf6fe',
-
- // fonts
- baseFontColor: '#333',
- secondFontColor: '#656565',
-
- // forms
- mandatoryFieldColor: '#a4030f',
-
- // leak
- leakPrimaryColor: '#fbf3d5',
- leakSecondaryColor: '#f1e8cb',
-
- // issues
- secondIssueBgColor: '#f8eeee',
- issueBgColor: '#f2dede',
- hotspotBgColor: '#eeeff4',
- issueLocationSelected: '#f4b1b0',
- issueLocationHighlighted: '#e1e1f2',
- conciseIssueRed: '#d18582',
- conciseIssueRedSelected: '#a4030f',
-
- // coverage
- lineCoverageRed: '#a4030f',
- lineCoverageGreen: '#b4dd78',
-
- // alerts
- warningIconColor: '#eabe06',
-
- alertBorderError: '#f4b1b0',
- alertBackgroundError: '#f2dede',
- alertTextError: '#862422',
- alertIconError: '#a4030f',
-
- alertBorderWarning: '#faebcc',
- alertBackgroundWarning: '#fcf8e3',
- alertTextWarning: '#6f4f17',
- alertIconWarning: '#db781a',
-
- alertBorderSuccess: '#d6e9c6',
- alertBackgroundSuccess: '#dff0d8',
- alertTextSuccess: '#215821',
- alertIconSuccess: '#6d9867',
-
- alertBorderInfo: '#b1dff3',
- alertBackgroundInfo: '#d9edf7',
- alertTextInfo: '#0e516f',
- alertIconInfo: '#0271b9',
-
- // badge
- badgeBlueBackground: '#2E7CB5',
- badgeBlueColor: '#FFFFFF',
- badgeRedBackgroundOnIssue: '#EEC8C8',
-
- // alm
- azure: '#0078d7',
- bitbucket: '#0052CC',
- github: '#e1e4e8',
-
- // code/pre
- codeBackground: '#f5f5f5',
- codeBorder: '#e6e6e6',
- codeAdded: '#dff0d8',
- codeRemoved: '#f2dede',
-
- // promotion
- darkBackground: '#292929',
- darkBackgroundSeparator: '#413b3b',
- darkBackgroundFontColor: '#f6f8fa',
-
- //quality gate badges
- badgeGreenBackground: '#f0faec',
- badgeRedBackground: '#ffeaea',
-
- // new color palette
- // Some of these colors duplicate what we have above, but this will make it
- // easier to align with the UX designers on what colors to use where.
- // Colors that have transparency are suffixed with an "a" followed by the percentage
- // value of the alpha channel.
- primary: '#236a97',
- primarya40: 'rgba(35, 107, 151, 0.40)',
- primary400: '#297BAE',
-
- info50: '#ECF6FE',
- info100: '#D9EDF7',
- info200: '#B1DFF3',
- info400: '#4B9FD5',
- info500: '#0271B9',
-
- success300: '#6CD46C',
- success300a20: 'rgba(108, 212, 108, 0.2)',
- success500: '#008223',
- success500a20: 'rgba(0, 138, 37, 0.20)',
- successVariant: '#C6E056',
- successVarianta20: 'rgba(198, 224, 86, 0.2)',
- successVariantDark: '#809E00',
-
- warning: '#B95E04',
- warningVariant: '#F4D348',
- warningVarianta20: 'rgba(244, 211, 72, 0.2)',
- warningVariantDark: '#B18F00',
- warningAccent: '#F69D53',
- warningAccenta20: 'rgba(246, 157, 83, 0.2)',
-
- error400: '#F0878E',
- error400a20: 'rgba(240, 135, 142, 0.2)',
- error500: '#D02F3A',
- error500a20: 'rgba(208, 47, 58, 0.20)',
- error700: '#B81723',
-
- neutral50: '#F3F3F3',
- neutral200: '#CCCCCC',
- neutral600: '#666666',
- neutral800: '#333333',
-
- white: '#FFFFFF',
- whitea18: 'rgba(255, 255, 255, 0.18)',
- whitea60: 'rgba(255, 255, 255, 0.60)',
-
- black: '#000000',
- blacka06: 'rgba(0, 0, 0, 0.06)',
- blacka38: 'rgba(0, 0, 0, 0.38)',
- blacka60: 'rgba(0, 0, 0, 0.60)',
- blacka75: 'rgba(0, 0, 0, 0.75)',
- blacka87: 'rgba(0, 0, 0, 0.87)',
- },
-
- sizes: {
- gridSize: `${grid}px`,
-
- baseFontSize: `${baseFontSizeRaw}px`,
- verySmallFontSize: '10px',
- smallFontSize: '12px',
- mediumFontSize: '14px',
- bigFontSize: '16px',
- veryBigFontSize: '18px',
- hugeFontSize: '24px',
- giganticFontSize: '36px',
-
- hugeControlHeight: `${5 * grid}px`,
- largeControlHeight: `${4 * grid}px`,
- controlHeight: `${3 * grid}px`,
- smallControlHeight: `${2.5 * grid}px`,
- tinyControlHeight: `${2 * grid}px`,
-
- globalNavHeight: `${6 * grid}px`,
-
- globalNavContentHeight: `${4 * grid}px`,
-
- pagePadding: '20px',
- },
-
- rawSizes: {
- grid,
- baseFontSizeRaw,
- globalNavHeightRaw: 6 * grid,
- globalNavContentHeightRaw: 4 * grid,
- contextNavHeightRaw: 9 * grid,
- },
-
- fonts: {
- baseFontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif",
- systemFontFamily: "-apple-system,'BlinkMacSystemFont','Helvetica','Arial',sans-serif",
- sourceCodeFontFamily: "Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace",
- },
-
- // z-index
- // =======
- // 1 - 100 for page elements (e.g. sidebars, panels)
- // 101 - 500 for generic page fixed elements (e.g. navigation, workspace)
- // 501 - 3000 for page ui elements
- // 3001 - 8000 for generic ui elements (e.g. dropdowns, tooltips)
- zIndexes: {
- // common
- aboveNormalZIndex: '3',
- normalZIndex: '2',
- belowNormalZIndex: '1',
-
- // ui elements
- pageMainZIndex: '50',
- pageSideZIndex: '50',
- pageHeaderZIndex: '55',
-
- globalBannerZIndex: '60',
-
- contextbarZIndex: '420',
-
- tooltipZIndex: '9001',
-
- dropdownMenuZIndex: '7500',
-
- processContainerZIndex: '7000',
-
- modalZIndex: '6001',
- modalOverlayZIndex: '6000',
-
- popupZIndex: '5000',
- },
-
- others: {
- defaultShadow: '0 6px 12px rgba(0, 0, 0, 0.175)',
- },
-};
+++ /dev/null
-/*
- * 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.
- */
-// IMPORTANT: any change in this file requires restart of the dev server
-const grid = 8;
-const baseFontSizeRaw = 13;
-
-const theme = {
- colors: {
- blue: '#4b9fd5',
- veryLightBlue: '#f2faff',
- lightBlue: '#cae3f2',
- darkBlue: '#236a97',
- veryDarkBlue: '#0E516F',
- green: '#00aa00',
- lightGreen: '#b0d513',
- veryLightGreen: '#f5f9fc',
- yellow: '#eabe06',
- orange: '#ed7d20',
- red: '#D02F3A',
- purple: '#9139d4',
-
- gray94: '#efefef',
- gray80: '#cdcdcd',
- gray71: '#b4b4b4',
- gray67: '#aaa',
- gray60: '#888',
- gray52: '#525252',
- gray40: '#404040',
-
- disabledQualityGate: '#757575',
-
- sizeRatingBackground: '#297BAE',
-
- transparentWhite: 'rgba(255,255,255,0.62)',
- transparentGray: 'rgba(200, 200, 200, 0.5)',
- transparentBlack: 'rgba(0, 0, 0, 0.25)',
-
- disableGrayText: '#bbb',
- disableGrayBorder: '#ddd',
- disableGrayBg: '#ebebeb',
-
- barBackgroundColor: '#f3f3f3',
- barBackgroundColorHighlight: '#f8f8f8',
- barBorderColor: '#e6e6e6',
-
- globalNavBarBg: '#262626',
-
- educationPrinciplesBgColor: '#F4F6FF',
- educationPrinciplesBorderColor: '#B0BDF9',
-
- favoriteColor: '#e77213',
- homepageColor: '#D86C13',
-
- // table
- rowHoverHighlight: '#ecf6fe',
-
- // fonts
- baseFontColor: '#333',
- secondFontColor: '#656565',
-
- // forms
- mandatoryFieldColor: '#a4030f',
-
- // leak
- leakPrimaryColor: '#fbf3d5',
- leakSecondaryColor: '#f1e8cb',
-
- // issues
- secondIssueBgColor: '#f8eeee',
- issueBgColor: '#f2dede',
- hotspotBgColor: '#eeeff4',
- issueLocationSelected: '#f4b1b0',
- issueLocationHighlighted: '#e1e1f2',
- conciseIssueRed: '#d18582',
- conciseIssueRedSelected: '#a4030f',
-
- // coverage
- lineCoverageRed: '#a4030f',
- lineCoverageGreen: '#b4dd78',
-
- // alerts
- warningIconColor: '#eabe06',
-
- alertBorderError: '#f4b1b0',
- alertBackgroundError: '#f2dede',
- alertTextError: '#862422',
- alertIconError: '#a4030f',
-
- alertBorderWarning: '#faebcc',
- alertBackgroundWarning: '#fcf8e3',
- alertTextWarning: '#6f4f17',
- alertIconWarning: '#db781a',
-
- alertBorderSuccess: '#d6e9c6',
- alertBackgroundSuccess: '#dff0d8',
- alertTextSuccess: '#215821',
- alertIconSuccess: '#6d9867',
-
- alertBorderInfo: '#b1dff3',
- alertBackgroundInfo: '#d9edf7',
- alertTextInfo: '#0e516f',
- alertIconInfo: '#0271b9',
-
- // badge
- badgeBlueBackground: '#2E7CB5',
- badgeBlueColor: '#FFFFFF',
- badgeRedBackgroundOnIssue: '#EEC8C8',
-
- // alm
- azure: '#0078d7',
- bitbucket: '#0052CC',
- github: '#e1e4e8',
-
- // code/pre
- codeBackground: '#f5f5f5',
- codeBorder: '#e6e6e6',
- codeAdded: '#dff0d8',
- codeRemoved: '#f2dede',
-
- // promotion
- darkBackground: '#292929',
- darkBackgroundSeparator: '#413b3b',
- darkBackgroundFontColor: '#f6f8fa',
-
- //quality gate badges
- badgeGreenBackground: '#f0faec',
- badgeRedBackground: '#ffeaea',
-
- // new color palette
- // Some of these colors duplicate what we have above, but this will make it
- // easier to align with the UX designers on what colors to use where.
- // Colors that have transparency are suffixed with an "a" followed by the percentage
- // value of the alpha channel.
- primary: '#236a97',
- primarya40: 'rgba(35, 107, 151, 0.40)',
- primary400: '#297BAE',
-
- info50: '#ECF6FE',
- info100: '#D9EDF7',
- info200: '#B1DFF3',
- info400: '#4B9FD5',
- info500: '#0271B9',
-
- success300: '#6CD46C',
- success300a20: 'rgba(108, 212, 108, 0.2)',
- success500: '#008223',
- success500a20: 'rgba(0, 138, 37, 0.20)',
- successVariant: '#C6E056',
- successVarianta20: 'rgba(198, 224, 86, 0.2)',
- successVariantDark: '#809E00',
-
- warning: '#B95E04',
- warningVariant: '#F4D348',
- warningVarianta20: 'rgba(244, 211, 72, 0.2)',
- warningVariantDark: '#B18F00',
- warningAccent: '#F69D53',
- warningAccenta20: 'rgba(246, 157, 83, 0.2)',
-
- error400: '#F0878E',
- error400a20: 'rgba(240, 135, 142, 0.2)',
- error500: '#D02F3A',
- error500a20: 'rgba(208, 47, 58, 0.20)',
- error700: '#B81723',
-
- neutral50: '#F3F3F3',
- neutral200: '#CCCCCC',
- neutral600: '#666666',
- neutral800: '#333333',
-
- white: '#FFFFFF',
- whitea18: 'rgba(255, 255, 255, 0.18)',
- whitea60: 'rgba(255, 255, 255, 0.60)',
-
- black: '#000000',
- blacka06: 'rgba(0, 0, 0, 0.06)',
- blacka38: 'rgba(0, 0, 0, 0.38)',
- blacka60: 'rgba(0, 0, 0, 0.60)',
- blacka75: 'rgba(0, 0, 0, 0.75)',
- blacka87: 'rgba(0, 0, 0, 0.87)',
- },
-
- sizes: {
- gridSize: `${grid}px`,
-
- baseFontSize: `${baseFontSizeRaw}px`,
- verySmallFontSize: '10px',
- smallFontSize: '12px',
- mediumFontSize: '14px',
- bigFontSize: '16px',
- veryBigFontSize: '18px',
- hugeFontSize: '24px',
- giganticFontSize: '36px',
-
- hugeControlHeight: `${5 * grid}px`,
- largeControlHeight: `${4 * grid}px`,
- controlHeight: `${3 * grid}px`,
- smallControlHeight: `${2.5 * grid}px`,
- tinyControlHeight: `${2 * grid}px`,
-
- globalNavHeight: `${6 * grid}px`,
-
- globalNavContentHeight: `${4 * grid}px`,
-
- pagePadding: '20px',
- },
-
- rawSizes: {
- grid,
- baseFontSizeRaw,
- globalNavHeightRaw: 6 * grid,
- globalNavContentHeightRaw: 4 * grid,
- contextNavHeightRaw: 9 * grid,
- },
-
- fonts: {
- baseFontFamily: "'Helvetica Neue', Helvetica, Arial, sans-serif",
- systemFontFamily: "-apple-system,'BlinkMacSystemFont','Helvetica','Arial',sans-serif",
- sourceCodeFontFamily: "Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace",
- },
-
- // z-index
- // =======
- // 1 - 100 for page elements (e.g. sidebars, panels)
- // 101 - 500 for generic page fixed elements (e.g. navigation, workspace)
- // 501 - 3000 for page ui elements
- // 3001 - 8000 for generic ui elements (e.g. dropdowns, tooltips)
- zIndexes: {
- // common
- aboveNormalZIndex: '3',
- normalZIndex: '2',
- belowNormalZIndex: '1',
-
- // ui elements
- pageMainZIndex: '50',
- pageSideZIndex: '50',
- pageHeaderZIndex: '55',
-
- globalBannerZIndex: '60',
-
- contextbarZIndex: '420',
-
- tooltipZIndex: '9001',
-
- dropdownMenuZIndex: '7500',
-
- processContainerZIndex: '7000',
-
- modalZIndex: '6001',
- modalOverlayZIndex: '6000',
-
- popupZIndex: '5000',
- },
-
- others: {
- defaultShadow: '0 6px 12px rgba(0, 0, 0, 0.175)',
- },
-};
-
-export default theme;
-export const { colors, rawSizes } = theme;
import * as React from 'react';
import { Image } from '~sonar-aligned/components/common/Image';
import { getIdentityProviders } from '../../../api/users';
-import { colors } from '../../../app/theme';
import { IdentityProvider } from '../../../types/types';
import { LoggedInUser } from '../../../types/users';
className="sw-inline-flex sw-items-center sw-px-1"
style={{
backgroundColor: identityProvider.backgroundColor,
- color: getTextColor(identityProvider.backgroundColor, colors.secondFontColor),
+ color: getTextColor(identityProvider.backgroundColor, '#656565'),
}}
>
<Image
.coding-rules-similar-tag-divider {
margin-top: 6px;
- border-top: 1px solid var(--barBorderColor);
+ border-top: 1px solid #e6e6e6;
}
.coding-rules-filter-title {
- padding: var(--gridSize);
+ padding: 8px;
font-size: 12px;
- color: var(--neutral600);
+ color: #666666;
white-space: nowrap;
line-height: unset;
}
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
- font-family: var(--sourceCodeFontFamily);
+ font-family: Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace;
}
.coding-rules-detail-quality-profile-parameter + .coding-rules-detail-quality-profile-parameter {
}
.coding-rules-detail-header {
- font-size: var(--veryBigFontSize);
+ font-size: 18px;
}
.coding-rules-detail-properties {
display: flex;
flex-wrap: wrap;
align-items: center;
- margin-top: var(--gridSize);
+ margin-top: 8px;
}
.coding-rules-detail-properties + .coding-rules-detail-properties {
.coding-rules-detail-property {
display: flex;
align-items: center;
- margin-right: var(--gridSize);
- margin-bottom: var(--gridSize);
- font-size: var(--smallFontSize);
+ margin-right: 8px;
+ margin-bottom: 8px;
+ font-size: 12px;
}
.coding-rules-detail-property.muted {
- color: var(--neutral200);
+ color: #cccccc;
}
.coding-rules-detail-tag + .coding-rules-detail-tag {
}
.coding-rules-detail-parameter-value {
- font-family: var(--sourceCodeFontFamily);
+ font-family: Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace;
word-break: break-all;
}
.coding-rules-detail-quality-profiles td,
.coding-rules-detail-list td {
- border-top: 1px solid var(--barBorderColor);
+ border-top: 1px solid #e6e6e6;
}
.coding-rules-detail-quality-profiles tr:first-child td,
}
.coding-rules-detail-quality-profile-inheritance {
- font-size: var(--smallFontSize);
+ font-size: 12px;
font-weight: normal;
}
}
.coding-rules-most-violated-projects tr:first-child + tr td {
- border-top-color: var(--barBorderColor);
+ border-top-color: #e6e6e6;
}
.coding-rules-most-violated-projects .coding-rules-detail-list-name {
}
.coding-rule.selected {
- border-color: var(--blue) !important;
+ border-color: #4b9fd5 !important;
}
.coding-rule + .coding-rule {
- border-top-color: var(--barBorderColor);
+ border-top-color: #e6e6e6;
}
.coding-rule.selected + .coding-rule {
}
}
.coding-rule-title {
- line-height: calc(2.5 * var(--gridSize));
- font-size: var(--baseFontSize);
+ line-height: calc(2.5 * 8px);
+ font-size: 13px;
}
.coding-rule-meta {
- padding: calc(0.25 * var(--gridSize));
+ padding: calc(0.25 * 8px);
padding-left: 30px;
- font-size: var(--smallFontSize);
+ font-size: 12px;
}
.coding-rule-activation {
}
.notice-dot {
- height: var(--gridSize);
- width: var(--gridSize);
- background-color: var(--blue);
+ height: 8px;
+ width: 8px;
+ background-color: #4b9fd5;
border-radius: 50%;
display: inline-block;
- margin-left: var(--gridSize);
+ margin-left: 8px;
}
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
.snippet {
- border: 1px solid var(--gray80);
+ border: 1px solid #cdcdcd;
overflow-x: auto;
}
.expand-block > button {
background: transparent;
box-sizing: border-box;
- color: var(--secondFontColor);
+ color: #656565;
height: 20px;
width: 100%;
- padding: calc(var(--gridSize) / 4);
+ padding: calc(8px / 4);
border: 0;
text-align: left;
cursor: pointer;
.expand-block > button:hover,
.expand-block > button:focus,
.expand-block > button:active {
- color: var(--darkBlue);
+ color: #236a97;
outline: none;
}
vertical-align: top;
line-height: 18px;
box-sizing: border-box;
- background-color: var(--issueBgColor);
+ background-color: #f2dede;
transition: background-color 0.3s ease;
}
}
.overview-measures-row + .overview-measures-row {
- border-top: 1px solid var(--barBorderColor);
+ border-top: 1px solid #e6e6e6;
}
.overview-measures-value {
line-height: 1;
- font-size: var(--giganticFontSize);
+ font-size: 36px;
white-space: nowrap;
}
.overview-measures-empty-value {
height: 1px;
- width: var(--bigFontSize);
- background: var(--baseFontColor);
+ width: 16px;
+ background: #333;
}
.overview-measures-aside {
}
.overview-measures-tab {
- width: calc(160px - calc(4 * var(--gridSize)));
+ width: calc(160px - calc(4 * 8px));
}
.overview-measures-emphasis {
- background: var(--veryLightGreen);
+ background: #f5f9fc;
}
.overview-quality-gate-conditions-list {
.overview-quality-gate-condition,
.overview-quality-gate-condition:hover {
display: block;
- color: var(--baseFontColor);
+ color: #333;
border: none;
transition: background-color 0.3s ease;
}
.overview-quality-gate-condition:hover {
- background-color: var(--rowHoverHighlight);
+ background-color: #ecf6fe;
}
/*
}
.pr-overview .overview-quality-gate-condition-error {
- border-color: var(--red);
+ border-color: #d02f3a;
}
.pr-overview .overview-quality-gate-condition-warn {
- border-color: var(--orange);
+ border-color: #ed7d20;
}
.pr-pverview .overview-measures-row {
}
.overview-analysis {
- color: var(--secondFontColor);
+ color: #656565;
}
.overview-analysis + .overview-analysis {
- margin-top: calc(2 * var(--gridSize));
+ margin-top: calc(2 * 8px);
}
.overview-activity-events {
.overview-analysis-event.badge {
border-radius: 2px;
font-weight: bold;
- font-size: var(--smallFontSize);
+ font-size: 12px;
letter-spacing: 0;
overflow: hidden;
text-overflow: ellipsis;
.permissions-table .divider::after {
display: block;
content: '';
- background: var(--barBorderColor);
+ background: #e6e6e6;
height: 1px;
width: 100%;
}
*/
.projects-leak-sorting-option.is-focused {
- background-color: var(--leakSecondaryColor);
+ background-color: #f1e8cb;
}
.project-filters-list {
}
.quality-gate-permissions .permission-list-item:hover {
- background-color: var(--rowHoverHighlight);
+ background-color: #ecf6fe;
}
.quality-gate-section tbody {
}
.bordered-bottom-cayc {
- border-bottom: 1px solid var(--whitea18);
+ border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}
.cayc-warning-header {
- color: var(--alertTextWarning);
+ color: #6f4f17;
}
.cayc-success-header {
- color: var(--alertTextSuccess);
+ color: #215821;
}
.cayc-warning-description {
}
.red-text {
- color: var(--red);
+ color: #d02f3a;
}
.green-text {
- color: var(--success500);
+ color: #008223;
}
.strike-through {
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
.hotspot-primary-location {
- border: 1px solid var(--blue);
- background-color: var(--issueBgColor);
+ border: 1px solid #4b9fd5;
+ background-color: #f2dede;
border-left: 4px solid;
margin: 10px 0px;
}
.hotspot-primary-location.hotspot-risk-exposure-HIGH {
- border-left-color: var(--error400);
+ border-left-color: #f0878e;
}
.hotspot-primary-location.hotspot-risk-exposure-MEDIUM {
- border-left-color: var(--warningAccent);
+ border-left-color: #f69d53;
}
.hotspot-primary-location.hotspot-risk-exposure-LOW {
- border-left-color: var(--warningVariant);
+ border-left-color: #f4d348;
}
.settings-sub-categories-list > li + li {
margin: 30px -20px 0;
padding: 30px 20px;
- border-top: 1px solid var(--barBorderColor);
+ border-top: 1px solid #e6e6e6;
}
.settings-sub-category-name {
margin-bottom: 20px;
- font-size: var(--bigFontSize);
+ font-size: 16px;
}
.settings-large-input {
.system-info-copy-paste-id-info {
max-width: 550px;
- padding: var(--gridSize) calc(2 * var(--gridSize));
+ padding: 8px calc(2 * 8px);
clear: both;
line-height: 1.8;
}
import { Badge, Note, getTextColor } from 'design-system';
import * as React from 'react';
import { Image } from '~sonar-aligned/components/common/Image';
-import { colors } from '../../../app/theme';
import { translate } from '../../../helpers/l10n';
import { isDefined } from '../../../helpers/types';
import { IdentityProvider, Provider } from '../../../types/types';
className="sw-inline-flex sw-items-center sw-px-1"
style={{
backgroundColor: identityProvider.backgroundColor,
- color: getTextColor(identityProvider.backgroundColor, colors.secondFontColor),
+ color: getTextColor(identityProvider.backgroundColor, '#656565'),
}}
>
<Image
.web-api-search {
margin: 20px 10px 0;
padding: 0 10px 20px;
- border-bottom: 1px solid var(--barBorderColor);
+ border-bottom: 1px solid #e6e6e6;
white-space: nowrap;
}
}
.web-api-domain-actions {
- margin-top: calc(2 * var(--gridSize));
+ margin-top: calc(2 * 8px);
}
.web-api-action-title {
.web-api-params td {
vertical-align: top;
padding: 8px 10px;
- border-top: 1px solid var(--barBorderColor);
+ border-top: 1px solid #e6e6e6;
}
.web-api-params tr:first-child td {
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-.source-line:hover .source-line-number,
-.source-line:hover .source-line-issues,
-.source-line:hover .source-line-coverage,
-.source-line:hover .source-line-duplications,
-.source-line:hover .source-line-duplications-extra,
-.source-line:hover .source-line-scm {
- border-color: #e9e9e9;
- background-color: #e9e9e9;
-}
-
-.source-line:hover .source-line-code {
- background-color: #f5f5f5;
-}
-
-.source-line [role='button'] {
- cursor: pointer;
-}
-
-.source-line-highlighted .source-line-number,
-.source-line-highlighted:hover .source-line-number,
-.source-line-highlighted .source-line-issues,
-.source-line-highlighted:hover .source-line-issues,
-.source-line-highlighted .source-line-coverage,
-.source-line-highlighted:hover .source-line-coverage,
-.source-line-highlighted .source-line-duplications,
-.source-line-highlighted:hover .source-line-duplications,
-.source-line-highlighted .source-line-duplications-extra,
-.source-line-highlighted:hover .source-line-duplications-extra,
-.source-line-highlighted .source-line-scm,
-.source-line-highlighted:hover .source-line-scm {
- border-color: #c4dfec !important;
- background-color: #c4dfec;
-}
-
-.source-line-highlighted .source-line-code,
-.source-line-highlighted:hover .source-line-code {
- background-color: #d9edf7;
-}
-
-.source-line-filtered .source-line-code {
- background-color: var(--leakPrimaryColor) !important;
-}
-
-.source-line-filtered.source-line-highlighted .source-line-code,
-.source-line-filtered.source-line-highlighted:hover .source-line-code {
- background-color: #cdd9c4 !important;
-}
-
-.source-line-filtered.source-line-filtered-dark .source-line-code {
- background-color: #f9ebb7 !important;
-}
-
-.source-line-filtered:hover .source-line-code,
-.source-line-filtered.source-line-filtered-dark:hover .source-line-code {
- background-color: var(--leakSecondaryColor) !important;
-}
-
-.source-line-last .source-line-code {
- padding-bottom: 160px;
-}
-.source-viewer pre,
-.source-line-number,
-.source-line-scm {
+.source-viewer pre {
line-height: 18px;
- font-family: var(--sourceCodeFontFamily);
- font-size: var(--smallFontSize);
-}
-
-.source-line-code {
- position: relative;
-}
-
-.source-line-code pre {
- float: left;
- word-wrap: break-word;
- white-space: pre-wrap;
-}
-
-.source-line-code-inner {
- min-height: 18px;
- padding: 0 10px;
-}
-
-.source-line-code-inner:before,
-.source-line-code-inner:after {
- display: table;
- content: '';
- line-height: 0;
-}
-
-.source-line-code-inner:after {
- clear: both;
-}
-
-.source-line-code-inner pre {
- tab-size: 4;
+ font-family: Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace;
+ font-size: 12px;
}
.source-line-code-issue {
background-size: 4px;
background-position: bottom;
}
-
-.source-meta {
- position: relative;
- vertical-align: top;
- width: 1px;
- background-clip: padding-box;
- user-select: none;
-}
-
-.source-meta:focus {
- outline: none;
-}
-
-.source-line-number {
- min-width: 18px;
- padding: 0 10px;
- background-color: var(--barBackgroundColor);
- color: var(--secondFontColor);
- text-align: right;
-}
-
-.source-line-issues {
- position: relative;
- padding: 0 2px;
- background-color: var(--barBackgroundColor);
- white-space: nowrap;
-}
-
-.source-line-with-issues svg {
- padding-right: 2px;
- vertical-align: middle;
-}
-
-.source-line-issues-counter {
- position: absolute;
- left: 17px;
- line-height: 8px;
- font-size: 8px;
- z-index: 900;
-}
-
-.source-line-coverage {
- background-color: var(--barBackgroundColor);
-}
-
-.source-line-duplications,
-.source-line-duplications-extra {
- background-color: var(--barBackgroundColor);
-}
-
-.source-line-duplications-extra {
- display: none;
-}
-
-.source-line-scm {
- padding: 0 5px;
- background-color: var(--barBackgroundColor);
-}
-
-.source-line-scm .dropdown {
- display: block;
-}
-
-.source-line-scm button {
- display: block;
- width: 100%;
- height: 18px;
-}
-
-.source-line-scm-inner {
- max-width: 40px;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-
-.source-line-bar {
- width: 5px;
- height: 18px;
-}
-
-.source-line-bar:focus {
- outline: none;
-}
-
-.source-line-covered {
- background-color: var(--lineCoverageGreen) !important;
-}
-
-.source-line-uncovered {
- background-color: var(--lineCoverageRed) !important;
-}
-
-.source-line-partially-covered {
- background-color: var(--lineCoverageRed) !important;
- background-image: repeating-linear-gradient(
- 45deg,
- rgba(255, 255, 255, 0.5) 4px,
- transparent 4px,
- transparent 8px,
- rgba(255, 255, 255, 0.5) 8px,
- rgba(255, 255, 255, 0.5) 12px,
- transparent 12px,
- transparent 16px,
- rgba(255, 255, 255, 0.5) 16px,
- rgba(255, 255, 255, 0.5) 20px
- ) !important;
-}
-
-.source-line-duplicated {
- background-color: #797979 !important;
-}
-
-.source-viewer-bubble-popup a {
- font-family: var(--baseFontFamily);
- font-size: var(--baseFontSize);
- text-align: left;
- user-select: text;
- border-bottom: none;
- transition: none;
- color: unset;
-}
.source-viewer {
width: 100%;
min-height: 200px;
- border: 1px solid var(--gray80);
+ border: 1px solid #cdcdcd;
box-sizing: border-box;
background-color: #fff;
}
.source-viewer-more-code {
padding: 40px 0;
- border-bottom: 1px solid var(--barBorderColor);
- background-color: var(--barBackgroundColor);
+ border-bottom: 1px solid #e6e6e6;
+ background-color: #f3f3f3;
text-align: center;
}
.source-table + .source-viewer-more-code {
border-bottom: none;
- border-top: 1px solid var(--barBorderColor);
+ border-top: 1px solid #e6e6e6;
}
.issue-location.highlighted {
- border-color: var(--issueLocationHighlighted);
- background-color: var(--issueLocationHighlighted);
+ border-color: #e1e1f2;
+ background-color: #e1e1f2;
}
.issue-location.selected {
- border-color: var(--issueLocationSelected);
- background-color: var(--issueLocationSelected);
+ border-color: #f4b1b0;
+ background-color: #f4b1b0;
}
.measures-viewer {
display: flex;
- margin: 0 calc(-1 * var(--gridSize));
+ margin: 0 calc(-1 * 8px);
}
.measures-viewer + .measures-viewer {
- margin-top: var(--gridSize);
+ margin-top: 8px;
}
.measures-viewer-header {
- font-size: var(--smallFontSize);
+ font-size: 12px;
}
.measures-viewer-secondary .measures-viewer-card {
- background-color: var(--barBackgroundColor);
+ background-color: #f3f3f3;
}
.measures-viewer-section {
}
.measures-viewer-card {
- margin: calc(2 * var(--gridSize)) var(--gridSize);
- padding: var(--gridSize);
- border: 1px solid var(--barBorderColor);
+ margin: calc(2 * 8px) 8px;
+ padding: 8px;
+ border: 1px solid #e6e6e6;
background-color: #fff;
}
.measures + .measures {
- margin-top: calc(2 * var(--gridSize));
- padding-top: calc(2 * var(--gridSize));
- border-top: 1px solid var(--barBorderColor);
+ margin-top: calc(2 * 8px);
+ padding-top: calc(2 * 8px);
+ border-top: 1px solid #e6e6e6;
}
.measures-chart {
display: inline-block;
vertical-align: middle;
- width: calc(var(--gridSize) * 10);
- margin-right: calc(var(--gridSize) * 3);
+ width: calc(8px * 10);
+ margin-right: calc(8px * 3);
text-align: center;
}
.measure-name {
display: block;
- font-size: var(--baseFontSize);
+ font-size: 13px;
}
.measure-value {
- color: var(--darkBlue);
- font-size: var(--bigFontSize);
+ color: #236a97;
+ font-size: 16px;
font-weight: 400;
}
}
.measure-big .measure-name {
- margin-top: calc(var(--gridSize) / 2);
- margin-bottom: var(--gridSize);
- font-size: var(--bigFontSize);
+ margin-top: calc(8px / 2);
+ margin-bottom: 8px;
+ font-size: 16px;
}
.measure-big .measure-value,
.measure-big .rating {
- font-size: var(--hugeFontSize);
+ font-size: 24px;
}
.measure-big + .measure-big {
- margin-left: calc(var(--gridSize) * 3);
+ margin-left: calc(8px * 3);
}
vertical-align: top;
line-height: 18px;
padding: 8px 10px;
- border-bottom: 1px solid var(--barBorderColor);
+ border-bottom: 1px solid #e6e6e6;
font-weight: 600;
}
& > tfoot > tr > td {
font-size: 93%;
- color: var(--secondFontColor);
+ color: #656565;
padding: 5px;
}
*/
.line-tooltip {
fill: none;
- stroke: var(--secondFontColor);
+ stroke: #656565;
stroke-width: 1px;
shape-rendering: crispEdges;
}
.line-chart-event {
fill: #fff;
- stroke: var(--blue);
+ stroke: #4b9fd5;
stroke-width: 2px;
}
.line-chart-event.VERSION {
- stroke: var(--blue);
+ stroke: #4b9fd5;
}
.line-chart-event.QUALITY_GATE {
- stroke: var(--green);
+ stroke: #00aa00;
}
.line-chart-event.QUALITY_PROFILE {
- stroke: var(--orange);
+ stroke: #ed7d20;
}
.line-chart-event.OTHER {
- stroke: var(--purple);
+ stroke: #9139d4;
}
.new-code-legend {
- fill: var(--secondFontColor);
- font-size: var(--smallFontSize);
+ fill: #656565;
+ font-size: 12px;
}
.line-chart-point {
fill: #fff;
- stroke: var(--blue);
+ stroke: #4b9fd5;
stroke-width: 2px;
}
.line-chart-tick {
- fill: var(--secondFontColor);
+ fill: #656565;
}
.line-chart-tick-x {
import { throttle } from 'lodash';
import * as React from 'react';
import { findDOMNode } from 'react-dom';
-import { rawSizes } from '../../app/theme';
interface Props {
/**
topFix?: number;
}
-const EDGE_MARGIN = rawSizes.grid / 2;
+const EDGE_MARGIN = 4;
export default class ScreenPositionFixer extends React.Component<Props, Fixes> {
throttledPosition: () => void;
*/
.tooltip {
position: absolute;
- z-index: var(--tooltipZIndex);
+ z-index: 9001;
display: block;
height: auto;
box-sizing: border-box;
}
.tooltip .issue-message-highlight-CODE {
- background-color: var(--whitea18);
+ background-color: rgba(255, 255, 255, 0.18);
}
@keyframes fadeIn {
import { throttle, uniqueId } from 'lodash';
import * as React from 'react';
import { createPortal, findDOMNode } from 'react-dom';
-import { rawSizes } from '../../app/theme';
import { ONE_SECOND } from '../../helpers/constants';
import { translate } from '../../helpers/l10n';
import EscKeydownHandler from './EscKeydownHandler';
// We can live with a tooltip that's slightly positioned over the toggle
// node. Only trigger if it really starts overlapping, as the re-positioning
// is quite expensive, needing 2 re-renders.
- const threshold = rawSizes.grid;
+ const threshold = 8;
switch (this.getPlacement()) {
case 'left':
case 'right':
*/
.issue {
position: relative;
- padding-top: var(--gridSize);
- padding-bottom: var(--gridSize);
- background-color: var(--issueBgColor);
+ padding-top: 8px;
+ padding-bottom: 8px;
+ background-color: #f2dede;
transition: all 0.3s ease;
border: 2px solid transparent;
cursor: pointer;
.issue-message-box.selected {
box-shadow: none;
outline: none;
- border: 2px solid var(--blue) !important;
+ border: 2px solid #4b9fd5 !important;
}
.issue + .issue,
.issue-message .button-plain {
line-height: 18px;
- font-size: var(--baseFontSize);
+ font-size: 13px;
font-weight: 600;
text-align: left;
}
.issue-message {
flex: 1;
- padding-left: var(--gridSize);
- padding-right: var(--gridSize);
+ padding-left: 8px;
+ padding-right: 8px;
line-height: 18px;
- font-size: var(--baseFontSize);
+ font-size: 13px;
font-weight: 600;
text-overflow: ellipsis;
}
}
.issue-meta {
- line-height: var(--smallFontSize);
- font-size: var(--smallFontSize);
+ line-height: 12px;
+ font-size: 12px;
display: flex;
}
.issue-meta + .issue-meta {
- margin-left: var(--gridSize);
+ margin-left: 8px;
}
.issue-meta-label {
.issue-comments {
margin-top: 5px;
- padding-left: var(--gridSize);
- font-size: var(--smallFontSize);
+ padding-left: 8px;
+ font-size: 12px;
}
.issue-comment {
flex-shrink: 0;
max-width: 130px;
line-height: 18px;
- color: var(--secondFontColor);
+ color: #656565;
font-weight: 600;
overflow: hidden;
text-overflow: ellipsis;
flex-shrink: 0;
line-height: 18px;
white-space: nowrap;
- color: var(--secondFontColor);
+ color: #656565;
}
.issue-comment-actions {
.issue-comment-bubble-popup {
width: 440px;
- font-size: var(--smallFontSize);
+ font-size: 12px;
}
.issue-comment-form-text textarea {
}
.issue:not(.selected) .location-index {
- background-color: var(--gray60);
+ background-color: #888;
}
.issue .menu:not(.issues-similar-issues-menu):not(.issue-changelog) {
}
.issue-message-box {
- background-color: var(--issueBgColor);
+ background-color: #f2dede;
border: 2px solid transparent;
margin: 10px 0px;
}
.issue-message-highlight-CODE {
- background-color: var(--whitea60);
+ background-color: rgba(255, 255, 255, 0.6);
border-radius: 4px;
- font-family: var(--sourceCodeFontFamily);
+ font-family: Consolas, 'Ubuntu Mono', 'Liberation Mono', Menlo, Courier, monospace;
font-weight: 400;
line-height: 1.4em;
padding: 2px 2px 0;
}
.issue-message-box.secondary-issue {
- background-color: var(--secondIssueBgColor);
+ background-color: #f8eeee;
}
.issue-message-box.secondary-issue:hover,
.issue:hover {
- border: 2px dashed var(--blue);
+ border: 2px dashed #4b9fd5;
outline: 0;
cursor: pointer;
}
}
.issue-comment-tile {
- background-color: var(--barBackgroundColor);
+ background-color: #f3f3f3;
}
.issue .button-link {
- color: var(--veryDarkBlue);
+ color: #0e516f;
}
.issue .button-link:hover,
.issue .button-link:focus,
.issue .button-link:active {
- color: var(--darkBlue);
+ color: #236a97;
}
align-items: flex-start;
border: 1px solid transparent;
border-radius: 4px;
- padding: calc(1 / 2 * var(--gridSize));
- margin-bottom: calc(1 / 4 * var(--gridSize));
+ padding: calc(1 / 2 * 8px);
+ margin-bottom: calc(1 / 4 * 8px);
color: inherit;
text-align: left;
}
button.locations-navigator:hover,
button.locations-navigator:active {
- border-color: var(--info400);
+ border-color: #4b9fd5;
}
button.locations-navigator:focus {
}
button.locations-navigator.selected {
- border-color: var(--info400);
- background-color: var(--info50);
+ border-color: #4b9fd5;
+ background-color: #ecf6fe;
}
}
.search-navigator-facet-box {
- background-color: var(--barBackgroundColor);
- font-size: var(--baseFontSize);
+ background-color: #f3f3f3;
+ font-size: 13px;
}
.search-navigator-facet-box.leak-facet-box {
- background-color: var(--leakPrimaryColor);
- border: 1px solid var(--leakSecondaryColor);
+ background-color: #fbf3d5;
+ border: 1px solid #f1e8cb;
}
.search-navigator-facet-box.is-inner {
margin-left: 8px;
padding-left: 12px;
- border-left: 1px solid var(--barBorderColor);
+ border-left: 1px solid #e6e6e6;
}
.search-navigator-facet-box.is-inner .search-navigator-facet-header {
.search-navigator-facet-box-forbidden .search-navigator-facet-header {
cursor: default;
- color: var(--gray60);
+ color: #888;
}
.search-navigator-facet,
justify-content: space-between;
align-items: center;
width: 100%;
- height: calc(3.5 * var(--gridSize));
+ height: calc(3.5 * 8px);
margin-bottom: 1px;
- padding: 0 calc(0.75 * var(--gridSize));
+ padding: 0 calc(0.75 * 8px);
border: 1px solid transparent;
border-radius: 2px;
box-sizing: border-box;
}
button.search-navigator-facet .facet-name {
- color: var(--baseFontColor);
+ color: #333;
}
button.search-navigator-facet:hover,
button.search-navigator-facet:focus,
.search-navigator-facet.active {
- border-color: var(--blue);
+ border-color: #4b9fd5;
}
.search-navigator-facet.facet-category {
}
.search-navigator-facet.facet-category .facet-name {
- color: var(--secondFontColor);
+ color: #656565;
}
.search-navigator-facet .facet-name {
min-width: 0;
line-height: 16px;
padding: 1px 0; /* needed to fit small ratings and levels */
- color: var(--secondFontColor);
- font-size: var(--smallFontSize);
+ color: #656565;
+ font-size: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.search-navigator-facet .facet-stat {
display: flex;
align-items: center;
- margin-left: var(--gridSize);
- color: var(--secondFontColor);
- font-size: var(--smallFontSize);
+ margin-left: 8px;
+ color: #656565;
+ font-size: 12px;
}
.search-navigator-facet .facet-toggle {
}
.search-navigator-facet .facet-toggle:hover {
- color: var(--baseFontColor);
+ color: #333;
}
.search-navigator-facet .facet-toggle-active.facet-toggle-green {
- background-color: var(--green);
+ background-color: #00aa00;
color: #ffffff;
}
.search-navigator-facet .facet-toggle-active.facet-toggle-red {
- background-color: var(--red);
+ background-color: #d02f3a;
color: #ffffff;
}
.leak-facet-box .search-navigator-facet .facet-name {
- background-color: var(--leakPrimaryColor);
+ background-color: #fbf3d5;
}
.leak-facet-box .search-navigator-facet .facet-stat {
- background-color: var(--leakPrimaryColor);
+ background-color: #fbf3d5;
}
.leak-facet-box .search-navigator-facet .facet-stat:before {
- background-image: linear-gradient(to right, rgba(251, 243, 213, 0), var(--leakPrimaryColor) 75%);
+ background-image: linear-gradient(to right, rgba(251, 243, 213, 0), #fbf3d5 75%);
}
.search-navigator-facet.active {
- background-color: var(--veryLightBlue);
+ background-color: #f2faff;
text-decoration: none;
}
}
.search-navigator-facet.compare .facet-toggle.facet-toggle-green {
- background-color: var(--green);
+ background-color: #00aa00;
color: #ffffff;
}
.search-navigator-facet.compare .facet-toggle.facet-toggle-red {
background-color: transparent;
- color: var(--secondFontColor);
+ color: #656565;
}
.search-navigator-facet-half {
display: block;
flex-shrink: 0;
padding: 8px 1px;
- color: var(--baseFontColor);
+ color: #333;
font-weight: 600;
overflow: hidden;
white-space: nowrap;
.search-navigator-facet-header > button {
border-bottom: none;
- color: var(--baseFontColor);
+ color: #333;
cursor: pointer;
font-weight: inherit;
}
.search-navigator-facet-header > button:focus,
.search-navigator-facet-header > button:hover {
- color: var(--darkBlue);
+ color: #236a97;
}
.search-navigator-facet-header > h3,
}
.search-navigator-facet-list {
- padding-bottom: var(--gridSize);
+ padding-bottom: 8px;
font-size: 0;
}
.search-navigator-facet-list-title {
- margin: 0 var(--gridSize) calc(var(--gridSize) / 2);
- font-size: var(--smallFontSize);
+ margin: 0 8px calc(8px / 2);
+ font-size: 12px;
font-weight: bold;
}
.search-navigator-facet-list + .search-navigator-facet-list > .search-navigator-facet-list-title {
- border-top: 1px solid var(--barBorderColor);
- padding-top: var(--gridSize);
+ border-top: 1px solid #e6e6e6;
+ padding-top: 8px;
}
.search-navigator-facet-empty {
margin: 0 0 0 0;
padding: 0 10px 10px;
- color: var(--baseFontColor);
- font-size: var(--smallFontSize);
+ color: #333;
+ font-size: 12px;
}
.search-navigator-facet-footer {
display: block;
- padding-bottom: var(--gridSize);
+ padding-bottom: 8px;
border-bottom: none;
}
.search-navigator-filters {
position: relative;
padding: 5px 10px;
- background-color: var(--barBackgroundColor);
+ background-color: #f3f3f3;
}
.search-navigator-filters:before,
.search-navigator-filters-header {
margin-bottom: 12px;
padding-bottom: 11px;
- border-bottom: 1px solid var(--barBorderColor);
+ border-bottom: 1px solid #e6e6e6;
}
.search-navigator-intro {
width: 500px;
*/
.rating {
display: inline-flex;
- width: var(--controlHeight);
- height: var(--controlHeight);
- border-radius: var(--controlHeight);
+ width: 24px;
+ height: 24px;
+ border-radius: 24px;
box-sizing: border-box;
- font-size: var(--bigFontSize);
+ font-size: 16px;
font-weight: 400;
align-items: center;
justify-content: center;
}
.rating-muted {
- background-color: var(--gray71) !important;
- color: var(--white) !important;
+ background-color: #b4b4b4 !important;
+ color: #ffffff !important;
}
a > .rating-A,
.rating-A {
- color: var(--blacka75);
- background-color: var(--success300);
+ color: rgba(0, 0, 0, 0.75);
+ background-color: #6cd46c;
}
a > .rating-B,
.rating-B {
- color: var(--blacka75);
- background-color: var(--successVariant);
+ color: rgba(0, 0, 0, 0.75);
+ background-color: #c6e056;
}
a > .rating-C,
.rating-C {
- color: var(--blacka75);
- background-color: var(--warningVariant);
+ color: rgba(0, 0, 0, 0.75);
+ background-color: #f4d348;
}
a > .rating-D,
.rating-D {
- color: var(--blacka75);
- background-color: var(--warningAccent);
+ color: rgba(0, 0, 0, 0.75);
+ background-color: #f69d53;
}
a > .rating-E,
.rating-E {
- color: var(--blacka75);
- background-color: var(--error400);
+ color: rgba(0, 0, 0, 0.75);
+ background-color: #f0878e;
}
.popup {
position: absolute;
- z-index: var(--popupZIndex);
+ z-index: 5000;
margin-top: -16px;
margin-left: 8px;
- padding: var(--gridSize);
+ padding: 8px;
border: 1px solid var(--echoes-color-border-weak);
border-radius: 3px;
box-sizing: border-box;
background-color: #ffffff;
- box-shadow: var(--defaultShadow);
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
cursor: default;
}
top: 15px;
left: -6px;
border-left-width: 0;
- border-right-color: var(--barBorderColor);
+ border-right-color: #e6e6e6;
}
.popup-arrow:after {
border-left-width: 6px;
border-top-width: 0;
border-right-color: transparent;
- border-bottom-color: var(--barBorderColor);
+ border-bottom-color: #e6e6e6;
}
.popup.is-bottom .popup-arrow.is-left {
border-left-width: 6px;
border-top-width: 0;
border-right-color: transparent;
- border-bottom-color: var(--barBorderColor);
+ border-bottom-color: #e6e6e6;
}
.popup.is-bottom-right .popup-arrow:after {
border-left-width: 6px;
border-top-width: 0;
border-right-color: transparent;
- border-bottom-color: var(--barBorderColor);
+ border-bottom-color: #e6e6e6;
}
.popup.is-bottom-left .popup-arrow:after {
top: 8px;
border-right-width: 0;
border-left-width: 6px;
- border-left-color: var(--barBorderColor);
+ border-left-color: #e6e6e6;
border-right-color: transparent;
}
top: 8px;
border-left-width: 0;
border-right-width: 6px;
- border-right-color: var(--barBorderColor);
+ border-right-color: #e6e6e6;
border-left-color: transparent;
}
top: calc(100% - 15px);
border-left-width: 0;
border-right-width: 6px;
- border-right-color: var(--barBorderColor);
+ border-right-color: #e6e6e6;
border-left-color: transparent;
}
bottom: -6px;
top: auto;
left: 8px;
- border-color: var(--barBorderColor) transparent transparent;
+ border-color: #e6e6e6 transparent transparent;
border-width: 6px 6px 0 6px;
}
/* #region .popup & .menu or .multi-select */
.popup:not(.no-padding) > .menu,
.popup:not(.no-padding) > .multi-select {
- margin: calc(-1 * var(--gridSize));
+ margin: calc(-1 * 8px);
}
/* #endregion */
import { ComponentQualifier } from '~sonar-aligned/types/component';
import { MetricKey } from '~sonar-aligned/types/metrics';
-import { colors } from '../app/theme';
import { AlmKeys } from '../types/alm-settings';
import {
CleanCodeAttribute,
export const RULE_STATUSES = ['READY', 'BETA', 'DEPRECATED'];
+/**
+ * @deprecated Legacy colors. Equivalents should be added to the Echoes design system soon
+ */
+const colors = {
+ success300: '#6CD46C',
+ success300a20: 'rgba(108, 212, 108, 0.2)',
+ success500: '#008223',
+ successVariant: '#C6E056',
+ successVarianta20: 'rgba(198, 224, 86, 0.2)',
+ successVariantDark: '#809E00',
+
+ warning: '#B95E04',
+ warningVariant: '#F4D348',
+ warningVarianta20: 'rgba(244, 211, 72, 0.2)',
+ warningVariantDark: '#B18F00',
+ warningAccent: '#F69D53',
+ warningAccenta20: 'rgba(246, 157, 83, 0.2)',
+
+ error400: '#F0878E',
+ error400a20: 'rgba(240, 135, 142, 0.2)',
+ error700: '#B81723',
+};
+
export const RATING_COLORS = [
{ fill: colors.success300, fillTransparent: colors.success300a20, stroke: colors.success500 },
{
.a11y-skip-link {
width: 0;
height: 0;
- padding: var(--gridSize);
+ padding: 8px;
position: absolute;
left: -9999px;
top: -9999px;
left: 6px;
top: 6px;
color: white;
- background-color: var(--globalNavBarBg);
+ background-color: #262626;
text-decoration: underline;
}
path-browserify: "npm:1.0.1"
postcss: "npm:8.4.47"
postcss-calc: "npm:10.0.2"
- postcss-custom-properties: "npm:12.1.11"
prettier: "npm:3.3.3"
prettier-plugin-organize-imports: "npm:4.1.0"
react: "npm:18.3.1"
jest: "npm:29.7.0"
postcss: "npm:8.4.47"
postcss-calc: "npm:10.0.2"
- postcss-custom-properties: "npm:12.1.11"
prettier: "npm:3.3.3"
prettier-plugin-organize-imports: "npm:4.1.0"
react-toastify: "npm:10.0.5"
languageName: node
linkType: hard
-"postcss-custom-properties@npm:12.1.11":
- version: 12.1.11
- resolution: "postcss-custom-properties@npm:12.1.11"
- dependencies:
- postcss-value-parser: "npm:^4.2.0"
- peerDependencies:
- postcss: ^8.2
- checksum: 10/3f049f07cc45c9debcc8d662374947eb3158bb66b2722c81368b36d60de0629e75d80ccfe2ca25ba21af8ce146c50dbc91c62c28e01c06635252e39678c1eb6d
- languageName: node
- linkType: hard
-
"postcss-import@npm:^15.1.0":
version: 15.1.0
resolution: "postcss-import@npm:15.1.0"