diff options
author | Stas Vilchik <stas.vilchik@sonarsource.com> | 2017-10-18 17:28:12 +0200 |
---|---|---|
committer | Stas Vilchik <stas.vilchik@sonarsource.com> | 2017-10-19 11:07:32 +0200 |
commit | 350d53a5f25a1ad8438ba73faad78846e7e2c590 (patch) | |
tree | 82bd4da60945274ba35de2b41712a9b2d70c04c3 /server | |
parent | 0a2f324b94e66acc9183cfd98ede1802667d525f (diff) | |
download | sonarqube-350d53a5f25a1ad8438ba73faad78846e7e2c590.tar.gz sonarqube-350d53a5f25a1ad8438ba73faad78846e7e2c590.zip |
better rendering of long events on project activity page
Diffstat (limited to 'server')
3 files changed, 16 insertions, 13 deletions
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/EventInner.js b/server/sonar-web/src/main/js/apps/projectActivity/components/EventInner.js index bdd3dd81fd1..a5e992ecfc3 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/EventInner.js +++ b/server/sonar-web/src/main/js/apps/projectActivity/components/EventInner.js @@ -19,8 +19,8 @@ */ // @flow import React from 'react'; +import Tooltip from '../../../components/controls/Tooltip'; import ProjectEventIcon from '../../../components/icons-components/ProjectEventIcon'; -import { TooltipsContainer } from '../../../components/mixins/tooltips-mixin'; import { translate } from '../../../helpers/l10n'; /*:: import type { Event as EventType } from '../types'; */ @@ -28,20 +28,18 @@ export default function EventInner(props /*: { event: EventType } */) { const { event } = props; return ( - <TooltipsContainer> - <div className="project-activity-event-inner"> - <div className="project-activity-event-inner-icon little-spacer-right"> - <ProjectEventIcon - className={'project-activity-event-icon margin-align ' + event.category} - /> - </div> + <div className="project-activity-event-inner"> + <div className="project-activity-event-inner-icon little-spacer-right"> + <ProjectEventIcon + className={'project-activity-event-icon margin-align ' + event.category} + /> + </div> + <Tooltip mouseEnterDelay={0.5} overlay={event.name}> <span className="project-activity-event-inner-text"> <span className="note">{translate('event.category', event.category)}:</span>{' '} - <strong title={event.description} data-toggle="tooltip"> - {event.name} - </strong> + <strong title={event.description}>{event.name}</strong> </span> - </div> - </TooltipsContainer> + </Tooltip> + </div> ); } diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/projectActivity.css b/server/sonar-web/src/main/js/apps/projectActivity/components/projectActivity.css index 25fd2bb2f8b..a2327b5fb26 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/projectActivity.css +++ b/server/sonar-web/src/main/js/apps/projectActivity/components/projectActivity.css @@ -205,6 +205,7 @@ flex: 1; display: flex; flex-direction: row; + overflow: hidden; } .project-activity-event-inner-icon { @@ -213,6 +214,9 @@ .project-activity-event-inner-text { flex: 1; + display: inline-block; + overflow: hidden; + text-overflow: ellipsis; } .project-activity-event-actions { diff --git a/server/sonar-web/src/main/js/components/controls/Tooltip.tsx b/server/sonar-web/src/main/js/components/controls/Tooltip.tsx index f33a4f1677c..cfc6037198a 100644 --- a/server/sonar-web/src/main/js/components/controls/Tooltip.tsx +++ b/server/sonar-web/src/main/js/components/controls/Tooltip.tsx @@ -21,6 +21,7 @@ import * as React from 'react'; import TooltipCore from 'rc-tooltip'; interface Props { + mouseEnterDelay?: number; overlay: React.ReactNode; placement?: string; [attr: string]: any; |