diff options
Diffstat (limited to 'server/sonar-web')
10 files changed, 97 insertions, 82 deletions
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/Event.css b/server/sonar-web/src/main/js/apps/projectActivity/components/Event.css deleted file mode 100644 index ee96a69b0c0..00000000000 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/Event.css +++ /dev/null @@ -1,5 +0,0 @@ -.project-activity-event {} - -.project-activity-event + .project-activity-event { - margin-top: 4px; -} diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/Event.js b/server/sonar-web/src/main/js/apps/projectActivity/components/Event.js index 2dc04fec94c..6e1a3878c88 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/Event.js +++ b/server/sonar-web/src/main/js/apps/projectActivity/components/Event.js @@ -22,8 +22,8 @@ import React from 'react'; import EventInner from './EventInner'; import ChangeEventForm from './forms/ChangeEventForm'; import RemoveEventForm from './forms/RemoveEventForm'; -import DeleteIcon from './DeleteIcon'; -import ChangeIcon from './ChangeIcon'; +import DeleteIcon from '../../../components/icons-components/DeleteIcon'; +import ChangeIcon from '../../../components/icons-components/ChangeIcon'; import type { Event as EventType } from '../types'; type Props = { @@ -89,7 +89,7 @@ export default class Event extends React.PureComponent { <EventInner event={this.props.event} /> {showActions && - <div className="project-activity-event-actions"> + <div className="project-activity-event-actions spacer-left"> {canChange && <button className="js-change-event button-clean" onClick={this.startChanging}> <ChangeIcon /> 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 62bc0e7e229..13152f46f94 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,25 +19,28 @@ */ // @flow import React from 'react'; +import ProjectEventIcon from '../../../components/icons-components/ProjectEventIcon'; import { TooltipsContainer } from '../../../components/mixins/tooltips-mixin'; -import type { Event as EventType } from '../types'; import { translate } from '../../../helpers/l10n'; -import './Event.css'; +import type { Event as EventType } from '../types'; export default function EventInner(props: { event: EventType }) { const { event } = props; - if (event.category === 'VERSION') { - return <span className="badge project-activity-version-badge">{props.event.name}</span>; - } - return ( <TooltipsContainer> - <span> - <span className="note">{translate('event.category', event.category)}:</span> - {' '} - <strong title={event.description} data-toggle="tooltip">{event.name}</strong> - </span> + <div className="project-activity-event-inner"> + <div className="project-activity-event-inner-icon little-spacer-right"> + <ProjectEventIcon + className={'text-text-bottom project-activity-event-icon ' + event.category} + /> + </div> + <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> + </span> + </div> </TooltipsContainer> ); } diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/Events.js b/server/sonar-web/src/main/js/apps/projectActivity/components/Events.js index 27678c0a9ac..6f2725388d9 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/Events.js +++ b/server/sonar-web/src/main/js/apps/projectActivity/components/Events.js @@ -35,8 +35,8 @@ type Props = { export default function Events(props: Props) { const sortedEvents: Array<EventType> = sortBy( props.events, - // versions first - (event: EventType) => (event.category === 'VERSION' ? 0 : 1), + // versions last + (event: EventType) => (event.category === 'VERSION' ? 1 : 0), // then the rest sorted by category 'category' ); diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js index 01f933beadc..870dfd61c6a 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js +++ b/server/sonar-web/src/main/js/apps/projectActivity/components/ProjectActivityAnalysis.js @@ -45,11 +45,23 @@ export default function ProjectActivityAnalysis(props: Props) { return ( <li className="project-activity-analysis clearfix"> + <div className="project-activity-time spacer-right"> + <FormattedDate date={date} format="LT" tooltipFormat="LTS" /> + </div> + <div + className="project-activity-analysis-icon little-spacer-top big-spacer-right" + title={translate('project_activity.analysis')} + /> + {canAdmin && - <div className="project-activity-analysis-actions"> + <div className="project-activity-analysis-actions spacer-left"> <div className="dropdown display-inline-block"> - <button className="js-create button-small" data-toggle="dropdown"> - {translate('create')} <i className="icon-dropdown" /> + <button + className="js-analysis-actions button-small dropdown-toggle" + data-toggle="dropdown"> + <i className="icon-settings" /> + {' '} + <i className="icon-dropdown" /> </button> <ul className="dropdown-menu dropdown-menu-right"> {version == null && @@ -67,19 +79,18 @@ export default function ProjectActivityAnalysis(props: Props) { addEventButtonText="project_activity.add_custom_event" /> </li> + {!isFirst && <li role="separator" className="divider" />} + {!isFirst && + <li> + <RemoveAnalysisForm + analysis={props.analysis} + deleteAnalysis={props.deleteAnalysis} + /> + </li>} </ul> </div> - - {!isFirst && - <div className="display-inline-block little-spacer-left"> - <RemoveAnalysisForm analysis={props.analysis} deleteAnalysis={props.deleteAnalysis} /> - </div>} </div>} - <div className="project-activity-time"> - <FormattedDate date={date} format="LT" tooltipFormat="LTS" /> - </div> - {events.length > 0 && <Events analysis={props.analysis.key} @@ -89,6 +100,7 @@ export default function ProjectActivityAnalysis(props: Props) { events={events} isFirst={props.isFirst} />} + </li> ); } diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/forms/RemoveAnalysisForm.js b/server/sonar-web/src/main/js/apps/projectActivity/components/forms/RemoveAnalysisForm.js index 9b0e215c686..138274caefc 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/forms/RemoveAnalysisForm.js +++ b/server/sonar-web/src/main/js/apps/projectActivity/components/forms/RemoveAnalysisForm.js @@ -49,7 +49,8 @@ export default class RemoveAnalysisForm extends React.PureComponent { this.mounted = false; } - openForm = () => { + openForm = (evt: Event) => { + evt.preventDefault(); if (this.mounted) { this.setState({ open: true }); } @@ -110,17 +111,16 @@ export default class RemoveAnalysisForm extends React.PureComponent { </div>} </footer> </form> - </Modal> ); } render() { return ( - <button className="js-delete-analysis button-small button-red" onClick={this.openForm}> - {translate('delete')} + <a className="js-delete-analysis" href="#" onClick={this.openForm}> + {translate('project_activity.delete_analysis')} {this.state.open && this.renderModal()} - </button> + </a> ); } } 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 f8d35f22a26..6754b5dfa12 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 @@ -9,6 +9,11 @@ margin-bottom: 0; } +.project-activity-page-side-outer > .boxed-group-inner { + padding-left: 12px; + padding-right: 12px; +} + .project-activity-layout-page-main { flex-grow: 1; min-width: 640px; @@ -53,7 +58,7 @@ .project-activity-days-list {} .project-activity-day { - margin-bottom: 40px; + margin-bottom: 32px; } .project-activity-day:last-child { @@ -71,8 +76,7 @@ .project-activity-analysis { position: relative; min-height: 20px; - padding-top: 6px; - padding-bottom: 6px; + padding: 4px; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; } @@ -87,55 +91,23 @@ .project-activity-analysis-actions { float: right; - padding-right: 10px; -} - -.project-activity-analysis-actions:first-child, -.project-activity-analysis-actions:empty { - margin-top: 0; -} - -.project-activity-analysis-actions > button + button, -.project-activity-analysis-actions > button + form, -.project-activity-analysis-actions > form + button, -.project-activity-analysis-actions > form + form { - margin-left: 8px; -} - -.project-activity-analysis-form { - display: inline-block; - vertical-align: top; - line-height: 20px; - margin-bottom: 10px; - padding: 9px; - border: 1px solid #faebcc; - border-radius: 2px; - background-color: #fcf8e3; -} - -.project-activity-analysis-form + .project-activity-analysis-form { - margin-left: 8px; } .project-activity-time { float: left; - width: 130px; + width: 54px; line-height: 20px; - padding-right: 50px; box-sizing: border-box; font-size: 12px; font-weight: bold; text-align: right; } -.project-activity-time::after { - position: absolute; - z-index: 21; - top: 11px; - left: 100px; - display: block; +.project-activity-analysis-icon { + float: left; width: 10px; height: 10px; + margin-top: 4px; border: 2px solid #4b9fd5; border-radius: 10px; box-sizing: border-box; @@ -148,11 +120,29 @@ .project-activity-event { line-height: 20px; + display: flex; +} + +.project-activity-event + .project-activity-event { + margin-top: 4px; +} + +.project-activity-event-inner { + flex: 1; + display: flex; + flex-direction: row; +} + +.project-activity-event-inner-icon { + flex-shrink: 0; +} + +.project-activity-event-inner-text { + flex: 1; } .project-activity-event-actions { display: inline-block; - margin-left: 8px; } .project-activity-event-actions button { diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ChangeIcon.js b/server/sonar-web/src/main/js/components/icons-components/ChangeIcon.js index e47455c3c1b..f6d5f894e4f 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/ChangeIcon.js +++ b/server/sonar-web/src/main/js/components/icons-components/ChangeIcon.js @@ -20,10 +20,17 @@ // @flow import React from 'react'; -export default function ChangeIcon() { +type Props = { className?: string, size?: number }; + +export default function ChangeIcon({ className, size = 12 }: Props) { /* eslint-disable max-len */ return ( - <svg width="12" height="12" viewBox="0 0 14 14"> + <svg + className={className} + xmlns="http://www.w3.org/2000/svg" + viewBox="0 0 14 14" + width={size} + height={size}> <path fill="#236a97" d="M3.35 12.82l.85-.84L2.02 9.8l-.84.85v.98h1.2v1.2h.97zM8.2 4.24c0-.13-.08-.2-.22-.2-.06 0-.1.02-.15.06l-5 5c-.05.05-.08.1-.08.17 0 .13.07.2.2.2.07 0 .12-.02.16-.06l5.02-5c.05-.04.07-.1.07-.16zm-.5-1.77l3.83 3.84-7.7 7.7H0v-3.84l7.7-7.7zm6.3.88c0 .33-.1.6-.34.84L12.12 5.7 8.28 1.88 9.8.35c.24-.23.5-.35.85-.35.32 0 .6.12.84.35l2.16 2.16c.23.25.34.53.34.85z" diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/DeleteIcon.js b/server/sonar-web/src/main/js/components/icons-components/DeleteIcon.js index 99a349e2ed3..049cc565aaa 100644 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/DeleteIcon.js +++ b/server/sonar-web/src/main/js/components/icons-components/DeleteIcon.js @@ -20,10 +20,17 @@ // @flow import React from 'react'; -export default function DeleteIcon() { +type Props = { className?: string, size?: number }; + +export default function DeleteIcon({ className, size = 12 }: Props) { /* eslint-disable max-len */ return ( - <svg width="12" height="12" viewBox="0 0 14 14"> + <svg + className={className} + xmlns="http://www.w3.org/2000/svg" + viewBox="0 0 14 14" + width={size} + height={size}> <path fill="#d4333f" d="M14 11.27c0 .3-.1.58-.33.8l-1.6 1.6c-.22.22-.5.33-.8.33-.32 0-.6-.1-.8-.33L7 10.2l-3.46 3.47c-.22.22-.5.33-.8.33-.32 0-.6-.1-.8-.33l-1.6-1.6c-.23-.22-.34-.5-.34-.8 0-.32.1-.6.33-.8L3.8 7 .32 3.54C.1 3.32 0 3.04 0 2.74c0-.32.1-.6.33-.8l1.6-1.6c.22-.23.5-.34.8-.34.32 0 .6.1.8.33L7 3.8 10.46.32c.22-.22.5-.33.8-.33.32 0 .6.1.8.33l1.6 1.6c.23.22.34.5.34.8 0 .32-.1.6-.33.8L10.2 7l3.47 3.46c.22.22.33.5.33.8z" diff --git a/server/sonar-web/src/main/less/init/type.less b/server/sonar-web/src/main/less/init/type.less index d26cae210ba..bdf19f94f7d 100644 --- a/server/sonar-web/src/main/less/init/type.less +++ b/server/sonar-web/src/main/less/init/type.less @@ -115,6 +115,7 @@ small, .text-middle { vertical-align: middle; } .text-bottom { vertical-align: bottom; } .text-text-top { vertical-align: text-top !important; } +.text-text-bottom { vertical-align: text-bottom !important; } // Overflow |