From: Grégoire Aubert Date: Thu, 22 Jun 2017 13:49:30 +0000 (+0200) Subject: SONAR-9404 Rework the project activity list style X-Git-Tag: 6.5-M2~40 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=fd52ea47ca9353d13fa3f599154393a175669081;p=sonarqube.git SONAR-9404 Rework the project activity list style --- diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/ChangeIcon.js b/server/sonar-web/src/main/js/apps/projectActivity/components/ChangeIcon.js deleted file mode 100644 index e47455c3c1b..00000000000 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/ChangeIcon.js +++ /dev/null @@ -1,33 +0,0 @@ -/* - * 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 ( - - - - ); -} diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/DeleteIcon.js b/server/sonar-web/src/main/js/apps/projectActivity/components/DeleteIcon.js deleted file mode 100644 index 99a349e2ed3..00000000000 --- a/server/sonar-web/src/main/js/apps/projectActivity/components/DeleteIcon.js +++ /dev/null @@ -1,33 +0,0 @@ -/* - * 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 ( - - - - ); -} 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 { {showActions && -
+
{canChange &&
    {version == null && @@ -67,19 +79,18 @@ export default function ProjectActivityAnalysis(props: Props) { addEventButtonText="project_activity.add_custom_event" /> + {!isFirst &&
  • } + {!isFirst && +
  • + +
    • }
- - {!isFirst && -
- -
}
} -
- -
- {events.length > 0 && } + ); } 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 { } - ); } render() { return ( - + ); } } 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/components/icons-components/ChangeIcon.js b/server/sonar-web/src/main/js/components/icons-components/ChangeIcon.js new file mode 100644 index 00000000000..f6d5f894e4f --- /dev/null +++ b/server/sonar-web/src/main/js/components/icons-components/ChangeIcon.js @@ -0,0 +1,40 @@ +/* + * 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 ( + + + + ); +} diff --git a/server/sonar-web/src/main/js/components/icons-components/DeleteIcon.js b/server/sonar-web/src/main/js/components/icons-components/DeleteIcon.js new file mode 100644 index 00000000000..049cc565aaa --- /dev/null +++ b/server/sonar-web/src/main/js/components/icons-components/DeleteIcon.js @@ -0,0 +1,40 @@ +/* + * 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 ( + + + + ); +} 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 diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties index 11f0301d946..bc2d0f77ff4 100644 --- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties +++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties @@ -1270,6 +1270,7 @@ manual_rules.add_manual_rule=Add Manual Rule # #------------------------------------------------------------------------------ +project_activity.analysis=Analysis project_activity.add_version=Create Version project_activity.project_analyzed=Project Analyzed project_activity.remove_version=Remove Version