]> source.dussan.org Git - sonarqube.git/commitdiff
fix display of organizations
authorStas Vilchik <vilchiks@gmail.com>
Thu, 2 Feb 2017 09:24:30 +0000 (10:24 +0100)
committerStas Vilchik <stas-vilchik@users.noreply.github.com>
Thu, 2 Feb 2017 12:32:25 +0000 (13:32 +0100)
server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css [deleted file]
server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.js
server/sonar-web/src/main/js/app/components/nav/component/ComponentNavBreadcrumbs.js
server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavBreadcrumbs-test.js.snap
server/sonar-web/src/main/js/app/components/nav/templates/nav-search-item.hbs
server/sonar-web/src/main/js/apps/background-tasks/components/TaskComponent.js
server/sonar-web/src/main/js/apps/issues/templates/issues-workspace-list-component.hbs
server/sonar-web/src/main/js/apps/organizations/navigation/OrganizationNavigation.js
server/sonar-web/src/main/js/apps/organizations/navigation/__tests__/__snapshots__/OrganizationNavigation-test.js.snap
server/sonar-web/src/main/less/components/navbar.less
server/sonar-web/src/main/less/init/misc.less

diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
deleted file mode 100644 (file)
index 59d210c..0000000
+++ /dev/null
@@ -1,16 +0,0 @@
-.navbar-context {
-  position: static;
-  padding: 0;
-  height: 65px;
-}
-
-.navbar-context-inner {
-  position: fixed;
-  z-index: 420;
-  left: 0;
-  right: 0;
-  height: 65px;
-  padding-top: 5px;
-  box-sizing: border-box;
-  background-color: #f3f3f3;
-}
index 303a45c6cc15a325bc78c1fff7259f56b869e2fe..916dbe127266176aa00f7115744e717dda3c0b2c 100644 (file)
@@ -26,7 +26,6 @@ import RecentHistory from './RecentHistory';
 import { TooltipsContainer } from '../../../../components/mixins/tooltips-mixin';
 import { getTasksForComponent } from '../../../../api/ce';
 import { STATUSES } from '../../../../apps/background-tasks/constants';
-import './ComponentNav.css';
 
 export default React.createClass({
   componentDidMount () {
index c787efb5bca5c0e071bda63714652cc4f2b7fc4f..3f09a2c637bf8c1932f0030deb5519c38109c851 100644 (file)
@@ -36,27 +36,40 @@ class ComponentNavBreadcrumbs extends React.Component {
       return null;
     }
 
-    const items = breadcrumbs.map(item => {
+    const lastItem = breadcrumbs[breadcrumbs.length - 1];
+
+    const items = breadcrumbs.map((item, index) => {
       return (
-          <li key={item.key}>
-            <Link to={{ pathname: '/dashboard', query: { id: item.key } }}>
-              <QualifierIcon qualifier={item.qualifier}/>
-              {' '}
-              <strong>{item.name}</strong>
+          <span key={item.key}>
+            <Link to={{ pathname: '/dashboard', query: { id: item.key } }} className="link-base-color">
+              {index === breadcrumbs.length - 1 ? (
+                  <strong>{item.name}</strong>
+              ) : (
+                  <span>{item.name}</span>
+              )}
             </Link>
-          </li>
+            {index < breadcrumbs.length - 1 && (
+                <span className="slash-separator"/>
+            )}
+          </span>
       );
     });
 
     return (
-        <ul className="nav navbar-nav nav-crumbs">
+        <h2 className="navbar-context-title">
           {organization != null && shouldOrganizationBeDisplayed && (
-              <li>
-                <OrganizationLink organization={organization}>{organization.name}</OrganizationLink>
-              </li>
+              <span>
+                <span className="navbar-context-title-qualifier little-spacer-right">
+                  <QualifierIcon qualifier={lastItem.qualifier}/>
+                </span>
+                <OrganizationLink organization={organization} className="link-base-color">
+                  {organization.name}
+                </OrganizationLink>
+                <span className="slash-separator"/>
+              </span>
           )}
           {items}
-        </ul>
+        </h2>
     );
   }
 }
index 19ad1cd2856c2adc56038540edbd0c19b1f05053..40c7c51d3b37c5732454c315c921a749279f383d 100644 (file)
@@ -1,8 +1,9 @@
 exports[`test should not render breadcrumbs with one element 1`] = `
-<ul
-  className="nav navbar-nav nav-crumbs">
-  <li>
+<h2
+  className="navbar-context-title">
+  <span>
     <Link
+      className="link-base-color"
       onlyActiveOnIndex={false}
       style={Object {}}
       to={
@@ -13,22 +14,25 @@ exports[`test should not render breadcrumbs with one element 1`] = `
           },
         }
       }>
-      <qualifier-icon
-        qualifier="TRK" />
-       
       <strong>
         My Project
       </strong>
     </Link>
-  </li>
-</ul>
+  </span>
+</h2>
 `;
 
 exports[`test should render organization 1`] = `
-<ul
-  className="nav navbar-nav nav-crumbs">
-  <li>
+<h2
+  className="navbar-context-title">
+  <span>
+    <span
+      className="navbar-context-title-qualifier little-spacer-right">
+      <qualifier-icon
+        qualifier="TRK" />
+    </span>
     <OrganizationLink
+      className="link-base-color"
       organization={
         Object {
           "key": "foo",
@@ -37,9 +41,12 @@ exports[`test should render organization 1`] = `
       }>
       The Foo Organization
     </OrganizationLink>
-  </li>
-  <li>
+    <span
+      className="slash-separator" />
+  </span>
+  <span>
     <Link
+      className="link-base-color"
       onlyActiveOnIndex={false}
       style={Object {}}
       to={
@@ -50,13 +57,10 @@ exports[`test should render organization 1`] = `
           },
         }
       }>
-      <qualifier-icon
-        qualifier="TRK" />
-       
       <strong>
         My Project
       </strong>
     </Link>
-  </li>
-</ul>
+  </span>
+</h2>
 `;
index 890643d9237ef55e8d09db7514ee28d64ee57f43..185169fdbda31293697d770db7e24b5a39c8da15 100644 (file)
@@ -8,6 +8,12 @@
 {{/notNull}}
 
 <a href="{{this.url}}" data-title="{{name}}<br>{{key}}" data-toggle="tooltip">
+  {{#if organization}}
+    <div class="pull-right nowrap note">
+      {{organization.name}}
+    </div>
+  {{/if}}
+
   {{#if icon}}<i class="icon-{{icon}} text-text-bottom"></i>{{/if}}
   {{#if q}}{{qualifierIcon q}}{{/if}}
   {{#eq q 'FIL'}}
       {{name}}
     {{/eq}}
   {{/eq}}
-
-  {{#if organization}}
-    <div class="pull-right nowrap note">
-      {{organization.name}}
-    </div>
-  {{/if}}
 </a>
index c76ad724cbba8c596bd50b027aa674668300b838..b72f02ed758e412e6317a0b0bfc2030f65862131 100644 (file)
@@ -47,15 +47,16 @@ export default class TaskComponent extends React.Component {
 
     return (
         <td>
+          <span className="little-spacer-right">
+            <QualifierIcon qualifier={task.componentQualifier}/>
+          </span>
+
           {task.organization != null && (
               <Organization organizationKey={task.organization}/>
           )}
 
-          <Link to={{ pathname: '/dashboard', query: { id: task.componentKey } }} className="link-with-icon">
-            <span className="little-spacer-right">
-              <QualifierIcon qualifier={task.componentQualifier}/>
-            </span>
-            <span>{task.componentName}</span>
+          <Link to={{ pathname: '/dashboard', query: { id: task.componentKey } }}>
+            {task.componentName}
           </Link>
 
           {types.length > 1 && (
index cd604d2a4a6dcaaf31aff7ec4b94d394f180c1fc..f1c12ffb4915723df72f095779d4c00fd94abfad 100644 (file)
@@ -7,18 +7,18 @@
   {{/notNull}}
 
   <a class="link-no-underline" href="{{dashboardUrl project}}">
-    <span class="little-spacer-right">{{qualifierIcon "TRK"}}</span>{{projectLongName}}
+    {{projectLongName}}
   </a>
 
   {{#if subProject}}
     <span class="slash-separator"></span>
     <a class="link-no-underline" href="{{dashboardUrl subProject}}">
-      <span class="little-spacer-right">{{qualifierIcon "TRK"}}</span>{{subProjectLongName}}
+      {{subProjectLongName}}
     </a>
   {{/if}}
 
   <span class="slash-separator"></span>
   <a class="link-no-underline" href="{{dashboardUrl component}}">
-    <span class="little-spacer-right">{{qualifierIcon componentQualifier}}</span>{{collapsePath componentLongName}}
+    {{collapsePath componentLongName}}
   </a>
 </div>
index a167596b06fa1c7b25c304663ba083ad4c3a7a62..eff625b4facf66a49a2ef6aeb48859e6ced4b2d8 100644 (file)
@@ -86,13 +86,11 @@ export default class OrganizationNavigation extends React.Component {
         <nav className="navbar navbar-context page-container" id="context-navigation">
           <div className="navbar-context-inner">
             <div className="container">
-              <ul className="nav navbar-nav nav-crumbs">
-                <li>
-                  <Link to={`/organizations/${organization.key}`}>
-                    {organization.name}
-                  </Link>
-                </li>
-              </ul>
+              <h2 className="navbar-context-title">
+                <Link to={`/organizations/${organization.key}`} className="link-base-color">
+                  <strong>{organization.name}</strong>
+                </Link>
+              </h2>
 
               <ul className="nav navbar-nav nav-tabs">
                 <li>
index 361c77f09cb7d9bc6657ac8b5b6e40392bfea044..4d4d4d7d2379a5d05a3aaccd52a703e7a345ad4f 100644 (file)
@@ -6,17 +6,18 @@ exports[`test admin 1`] = `
     className="navbar-context-inner">
     <div
       className="container">
-      <ul
-        className="nav navbar-nav nav-crumbs">
-        <li>
-          <Link
-            onlyActiveOnIndex={false}
-            style={Object {}}
-            to="/organizations/foo">
+      <h2
+        className="navbar-context-title">
+        <Link
+          className="link-base-color"
+          onlyActiveOnIndex={false}
+          style={Object {}}
+          to="/organizations/foo">
+          <strong>
             Foo
-          </Link>
-        </li>
-      </ul>
+          </strong>
+        </Link>
+      </h2>
       <ul
         className="nav navbar-nav nav-tabs">
         <li>
@@ -93,17 +94,18 @@ exports[`test regular user 1`] = `
     className="navbar-context-inner">
     <div
       className="container">
-      <ul
-        className="nav navbar-nav nav-crumbs">
-        <li>
-          <Link
-            onlyActiveOnIndex={false}
-            style={Object {}}
-            to="/organizations/foo">
+      <h2
+        className="navbar-context-title">
+        <Link
+          className="link-base-color"
+          onlyActiveOnIndex={false}
+          style={Object {}}
+          to="/organizations/foo">
+          <strong>
             Foo
-          </Link>
-        </li>
-      </ul>
+          </strong>
+        </Link>
+      </h2>
       <ul
         className="nav navbar-nav nav-tabs">
         <li>
index 7a14845b96a31e4e0ba1437e867c7ed653e41bb5..29322fa0d4796554b7e4236355a90b066f56ce4d 100644 (file)
 
 
 .navbar-context {
+  position: static;
   top: @navbarGlobalHeight;
   z-index: @navbar-context-z-index;
   height: @navbarContextHeight;
-  padding-top: 5px;
+  padding: 0;
   background-color: @navbarContextBackground;
 
   .nav-tabs {
   color: @secondFontColor;
   font-size: @smallFontSize;
 }
+.navbar-context-inner {
+  position: fixed;
+  z-index: 420;
+  left: 0;
+  right: 0;
+  height: 65px;
+  padding-top: 5px;
+  box-sizing: border-box;
+  background-color: #f3f3f3;
+}
+
+.navbar-context-title {
+  float: left;
+  padding: 2px 10px 0;
+}
+
+.navbar-context-title-qualifier {
+  display: inline-block;
+  vertical-align: top;
+  line-height: 16px;
+  padding-top: 5px;
+  box-sizing: border-box;
+}
+
+.navbar-context-title-qualifier i {
+  vertical-align: top;
+}
+
 
 .navbar-side {
   padding: 10px;
index 0a7b283cdeafff5088b7b1070e0db812a0dd32bb..472cc405189a707f9a6c363cb8092ebc7586dfdc 100644 (file)
@@ -130,8 +130,8 @@ td.big-spacer-top    { padding-top: 16px; }
 }
 
 .slash-separator {
-  margin-left: 4px;
-  margin-right: 4px;
+  margin-left: 5px;
+  margin-right: 5px;
 
   &:after {
     content: "/";