h2, | h2, | ||||
h3 { | h3 { | ||||
color: ${themeColor('pageTitle')}; | |||||
${tw`sw-heading-md`} | |||||
color: ${themeColor('pageContentDark')}; | |||||
${tw`sw-body-md-highlight`} | |||||
${tw`sw-my-6`} | ${tw`sw-my-6`} | ||||
} | } | ||||
h4, | h4, | ||||
h5, | h5, | ||||
h6 { | h6 { | ||||
color: ${themeColor('pageContent')}; | |||||
${tw`sw-body-md-highlight`} | |||||
color: ${themeColor('pageContentDark')}; | |||||
${tw`sw-body-sm-highlight`} | |||||
${tw`sw-mt-6 sw-mb-2`} | ${tw`sw-mt-6 sw-mb-2`} | ||||
} | } | ||||
// progressBar | // progressBar | ||||
progressBarForeground: COLORS.indigo[500], | progressBarForeground: COLORS.indigo[500], | ||||
progressBarBackground: COLORS.indigo[100], | progressBarBackground: COLORS.indigo[100], | ||||
//education principles | |||||
educationPrincipleBackground: COLORS.indigo[25], | |||||
educationPrincipleBorder: COLORS.indigo[300], | |||||
}, | }, | ||||
// contrast colors to be used for text when using a color background with the same name | // contrast colors to be used for text when using a color background with the same name |
* along with this program; if not, write to the Free Software Foundation, | * along with this program; if not, write to the Free Software Foundation, | ||||
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | ||||
*/ | */ | ||||
import { | |||||
ClipboardIconButton, | |||||
IssueMessageHighlighting, | |||||
LinkIcon, | |||||
PageContentFontWrapper, | |||||
} from 'design-system'; | |||||
import { ClipboardIconButton, IssueMessageHighlighting, LinkIcon, Title } from 'design-system'; | |||||
import * as React from 'react'; | import * as React from 'react'; | ||||
import { translate } from '../../../helpers/l10n'; | import { translate } from '../../../helpers/l10n'; | ||||
import { getPathUrlAsString, getRuleUrl } from '../../../helpers/urls'; | import { getPathUrlAsString, getRuleUrl } from '../../../helpers/urls'; | ||||
return ( | return ( | ||||
<header className="sw-flex sw-mb-6"> | <header className="sw-flex sw-mb-6"> | ||||
<div className="sw-mr-8 sw-grow sw-flex sw-flex-col sw-gap-4"> | <div className="sw-mr-8 sw-grow sw-flex sw-flex-col sw-gap-4"> | ||||
<PageContentFontWrapper className="sw-heading-md" as="h1"> | |||||
<Title className="sw-mb-0"> | |||||
<IssueMessageHighlighting message={ruleDetails.name} /> | <IssueMessageHighlighting message={ruleDetails.name} /> | ||||
<ClipboardIconButton | <ClipboardIconButton | ||||
Icon={LinkIcon} | Icon={LinkIcon} | ||||
copyValue={getPathUrlAsString(ruleUrl, ruleDetails.isExternal)} | copyValue={getPathUrlAsString(ruleUrl, ruleDetails.isExternal)} | ||||
discreet | discreet | ||||
/> | /> | ||||
</PageContentFontWrapper> | |||||
</Title> | |||||
<div className="sw-flex sw-flex-wrap sw-gap-2"> | <div className="sw-flex sw-flex-wrap sw-gap-2"> | ||||
{hasTypeData && ( | {hasTypeData && ( |
* along with this program; if not, write to the Free Software Foundation, | * along with this program; if not, write to the Free Software Foundation, | ||||
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | ||||
*/ | */ | ||||
import { ContentCell, Link, Spinner, SubHeadingHighlight, Table, TableRow } from 'design-system'; | |||||
import { ContentCell, Link, Spinner, SubTitle, Table, TableRow } from 'design-system'; | |||||
import { keyBy } from 'lodash'; | import { keyBy } from 'lodash'; | ||||
import * as React from 'react'; | import * as React from 'react'; | ||||
import { FormattedMessage } from 'react-intl'; | import { FormattedMessage } from 'react-intl'; | ||||
return ( | return ( | ||||
<div className="sw-mb-8"> | <div className="sw-mb-8"> | ||||
<Spinner loading={loading}> | <Spinner loading={loading}> | ||||
<SubHeadingHighlight as="h2"> | |||||
<SubTitle> | |||||
{translate('coding_rules.issues')} | {translate('coding_rules.issues')} | ||||
{this.renderTotal()} | {this.renderTotal()} | ||||
</SubHeadingHighlight> | |||||
</SubTitle> | |||||
{projects.length > 0 ? ( | {projects.length > 0 ? ( | ||||
<> | <> |
InheritanceIcon, | InheritanceIcon, | ||||
Link, | Link, | ||||
Note, | Note, | ||||
SubHeadingHighlight, | |||||
SubTitle, | |||||
Table, | Table, | ||||
TableRowInteractive, | TableRowInteractive, | ||||
} from 'design-system'; | } from 'design-system'; | ||||
}; | }; | ||||
return ( | return ( | ||||
<div className="js-rule-profiles sw-mb-8"> | <div className="js-rule-profiles sw-mb-8"> | ||||
<SubHeadingHighlight as="h2" id={PROFILES_HEADING_ID}> | |||||
<SubTitle id={PROFILES_HEADING_ID}> | |||||
<FormattedMessage id="coding_rules.quality_profiles" /> | <FormattedMessage id="coding_rules.quality_profiles" /> | ||||
</SubHeadingHighlight> | |||||
</SubTitle> | |||||
{canActivate && ( | {canActivate && ( | ||||
<ActivationButton | <ActivationButton |
import withLocation from '../hoc/withLocation'; | import withLocation from '../hoc/withLocation'; | ||||
import MoreInfoRuleDescription from './MoreInfoRuleDescription'; | import MoreInfoRuleDescription from './MoreInfoRuleDescription'; | ||||
import RuleDescription from './RuleDescription'; | import RuleDescription from './RuleDescription'; | ||||
import './style.css'; | |||||
interface IssueTabViewerProps extends CurrentUserContextInterface { | interface IssueTabViewerProps extends CurrentUserContextInterface { | ||||
ruleDetails: RuleDetails; | ruleDetails: RuleDetails; |
* along with this program; if not, write to the Free Software Foundation, | * along with this program; if not, write to the Free Software Foundation, | ||||
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | ||||
*/ | */ | ||||
import styled from '@emotion/styled'; | |||||
import { FlagMessage, SubTitle, themeBorder, themeColor } from 'design-system'; | |||||
import * as React from 'react'; | import * as React from 'react'; | ||||
import { RuleDescriptionSection } from '../../apps/coding-rules/rule'; | import { RuleDescriptionSection } from '../../apps/coding-rules/rule'; | ||||
import { translate } from '../../helpers/l10n'; | import { translate } from '../../helpers/l10n'; | ||||
import { Dict } from '../../types/types'; | import { Dict } from '../../types/types'; | ||||
import { ButtonLink } from '../controls/buttons'; | import { ButtonLink } from '../controls/buttons'; | ||||
import { Alert } from '../ui/Alert'; | |||||
import RuleDescription from './RuleDescription'; | import RuleDescription from './RuleDescription'; | ||||
import DefenseInDepth from './educationPrinciples/DefenseInDepth'; | import DefenseInDepth from './educationPrinciples/DefenseInDepth'; | ||||
import NeverTrustUserInput from './educationPrinciples/NeverTrustUserInput'; | import NeverTrustUserInput from './educationPrinciples/NeverTrustUserInput'; | ||||
import './style.css'; | |||||
interface Props { | interface Props { | ||||
displayEducationalPrinciplesNotification?: boolean; | displayEducationalPrinciplesNotification?: boolean; | ||||
return ( | return ( | ||||
<div className="sw-my-6 rule-desc"> | <div className="sw-my-6 rule-desc"> | ||||
{displayEducationalPrinciplesNotification && ( | {displayEducationalPrinciplesNotification && ( | ||||
<Alert variant="info"> | |||||
<FlagMessage variant="info"> | |||||
<p className="little-spacer-bottom little-spacer-top"> | <p className="little-spacer-bottom little-spacer-top"> | ||||
{translate('coding_rules.more_info.notification_message')} | {translate('coding_rules.more_info.notification_message')} | ||||
</p> | </p> | ||||
> | > | ||||
{translate('coding_rules.more_info.scroll_message')} | {translate('coding_rules.more_info.scroll_message')} | ||||
</ButtonLink> | </ButtonLink> | ||||
</Alert> | |||||
</FlagMessage> | |||||
)} | )} | ||||
{sections.length > 0 && ( | {sections.length > 0 && ( | ||||
<> | <> | ||||
<h2>{translate('coding_rules.more_info.resources.title')}</h2> | |||||
<SubTitle>{translate('coding_rules.more_info.resources.title')}</SubTitle> | |||||
<RuleDescription language={language} sections={sections} /> | <RuleDescription language={language} sections={sections} /> | ||||
</> | </> | ||||
)} | )} | ||||
{educationPrinciples.length > 0 && ( | {educationPrinciples.length > 0 && ( | ||||
<> | <> | ||||
<h2 ref={educationPrinciplesRef}> | |||||
<SubTitle ref={educationPrinciplesRef}> | |||||
{translate('coding_rules.more_info.education_principles.title')} | {translate('coding_rules.more_info.education_principles.title')} | ||||
</h2> | |||||
</SubTitle> | |||||
{educationPrinciples.map((key) => { | {educationPrinciples.map((key) => { | ||||
const Concept = EDUCATION_PRINCIPLES_MAP[key]; | const Concept = EDUCATION_PRINCIPLES_MAP[key]; | ||||
} | } | ||||
return ( | return ( | ||||
<div key={key} className="education-principles big-spacer-top big-padded"> | |||||
<StyledEducationPrinciples key={key} className="sw-mt-4 sw-p-4 sw-rounded-1"> | |||||
<Concept /> | <Concept /> | ||||
</div> | |||||
</StyledEducationPrinciples> | |||||
); | ); | ||||
})} | })} | ||||
</> | </> | ||||
); | ); | ||||
} | } | ||||
} | } | ||||
const StyledEducationPrinciples = styled.div` | |||||
background-color: ${themeColor('educationPrincipleBackground')}; | |||||
border: ${themeBorder('default', 'educationPrincipleBorder')}; | |||||
& h3:first-child { | |||||
margin-top: 0px; | |||||
} | |||||
`; |
import withLocation from '../hoc/withLocation'; | import withLocation from '../hoc/withLocation'; | ||||
import MoreInfoRuleDescription from './MoreInfoRuleDescription'; | import MoreInfoRuleDescription from './MoreInfoRuleDescription'; | ||||
import RuleDescription from './RuleDescription'; | import RuleDescription from './RuleDescription'; | ||||
import './style.css'; | |||||
interface RuleTabViewerProps extends CurrentUserContextInterface { | interface RuleTabViewerProps extends CurrentUserContextInterface { | ||||
ruleDetails: RuleDetails; | ruleDetails: RuleDetails; |
/* | |||||
* 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. | |||||
*/ | |||||
.education-principles { | |||||
background-color: var(--educationPrinciplesBgColor); | |||||
border-radius: 2px; | |||||
border: 1px solid var(--educationPrinciplesBorderColor); | |||||
} | |||||
.education-principles h3:first-child { | |||||
margin-top: 0px; | |||||
} |