applied simplified brunchdetail design

scm-ui/public/locales/de/repos.json

@@ -61,9 +61,7 @@
     }
   },
   "branch": {
-    "name": "Name",
-    "repository": "Repository",
-    "actions": "Aktionen",
+    "name": "Name:",
     "commits": "Commits",
     "sources": "Sources"
   },

scm-ui/public/locales/en/repos.json

@@ -61,9 +61,7 @@
     }
   },
   "branch": {
-    "name": "Name",
-    "repository": "Repository",
-    "actions": "Actions",
+    "name": "Name:",
     "commits": "Commits",
     "sources": "Sources"
   },

scm-ui/src/repos/branches/components/BranchDetail.js

@@ -21,31 +21,17 @@ const styles = {
   }
 };
 
-class BranchDetailTable extends React.Component<Props> {
+class BranchDetail extends React.Component<Props> {
   render() {
     const { repository, branch, t } = this.props;
 
     return (
-      <table className="table">
-        <tbody>
-          <tr>
-            <th>{t("branch.name")}</th>
-            <td>
-              {branch.name} {this.renderDefaultBranch()}
-            </td>
-          </tr>
-          <tr>
-            <th>{t("branch.repository")}</th>
-            <td>{repository.name}</td>
-          </tr>
-          <tr>
-            <th>{t("branch.actions")}</th>
-            <td>
+      <div className="media">
+        <div className="media-content subtitle"><strong>{t("branch.name")}</strong> {branch.name} {this.renderDefaultBranch()}</div>
+        <div className="media-right">
           <BranchButtonGroup repository={repository} branch={branch} />
-            </td>
-          </tr>
-        </tbody>
-      </table>
+        </div>
+      </div>
     );
   }
 
@@ -62,4 +48,4 @@ class BranchDetailTable extends React.Component<Props> {
   }
 }
 
-export default injectSheet(styles)(translate("repos")(BranchDetailTable));
+export default injectSheet(styles)(translate("repos")(BranchDetail));

scm-ui/src/repos/branches/containers/BranchView.js

@@ -1,6 +1,6 @@
 // @flow
 import React from "react";
-import BranchDetailTable from "../components/BranchDetailTable";
+import BranchDetail from "../components/BranchDetail";
 import { ExtensionPoint } from "@scm-manager/ui-extensions";
 import type { Repository, Branch } from "@scm-manager/ui-types";
 import { connect } from "react-redux";
@@ -54,7 +54,7 @@ class BranchView extends React.Component<Props> {
 
     return (
       <div>
-        <BranchDetailTable repository={repository} branch={branch} />
+        <BranchDetail repository={repository} branch={branch} />
         <hr />
         <div className="content">
           <ExtensionPoint