+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-export default function ChangeIcon() {
- /* eslint-disable max-len */
- return (
- <svg width="12" height="12" viewBox="0 0 14 14">
- <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"
- />
- </svg>
- );
-}
+++ /dev/null
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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.
- */
-// @flow
-import React from 'react';
-
-export default function DeleteIcon() {
- /* eslint-disable max-len */
- return (
- <svg width="12" height="12" viewBox="0 0 14 14">
- <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"
- />
- </svg>
- );
-}
+++ /dev/null
-.project-activity-event {}
-
-.project-activity-event + .project-activity-event {
- margin-top: 4px;
-}
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 = {
<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 />
*/
// @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>
);
}
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'
);
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 &&
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}
events={events}
isFirst={props.isFirst}
/>}
+
</li>
);
}
this.mounted = false;
}
- openForm = () => {
+ openForm = (evt: Event) => {
+ evt.preventDefault();
if (this.mounted) {
this.setState({ open: true });
}
</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>
);
}
}
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;
.project-activity-days-list {}
.project-activity-day {
- margin-bottom: 40px;
+ margin-bottom: 32px;
}
.project-activity-day:last-child {
.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;
}
.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;
.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 {
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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.
+ */
+// @flow
+import React from 'react';
+
+type Props = { className?: string, size?: number };
+
+export default function ChangeIcon({ className, size = 12 }: Props) {
+ /* eslint-disable max-len */
+ return (
+ <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"
+ />
+ </svg>
+ );
+}
--- /dev/null
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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.
+ */
+// @flow
+import React from 'react';
+
+type Props = { className?: string, size?: number };
+
+export default function DeleteIcon({ className, size = 12 }: Props) {
+ /* eslint-disable max-len */
+ return (
+ <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"
+ />
+ </svg>
+ );
+}
.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
#
#------------------------------------------------------------------------------
+project_activity.analysis=Analysis
project_activity.add_version=Create Version
project_activity.project_analyzed=Project Analyzed
project_activity.remove_version=Remove Version