Style panel title

mesosphere · Mar 10, 2016 · 89d1f88 · 89d1f88
1 parent 02d37ae
commit 89d1f88
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/src/css/layout/helpers.less b/src/css/layout/helpers.less
@@ -35,3 +35,7 @@
 .base-bottom {
   padding-bottom: @base-spacing-unit;
 }
+
+.inline-block {
+  display: inline-block;
+}
diff --git a/src/js/components/AppConfigEditFormComponent.jsx b/src/js/components/AppConfigEditFormComponent.jsx
@@ -159,7 +159,7 @@ var AppConfigEditFormComponent = React.createClass({
   getPortsPanelTitle: function () {
     return (
       <span>
-        Ports<PluginMountPointComponent
+        Ports<PluginMountPointComponent className="inline-block"
           placeId={PluginMountPoints.APP_EDIT_FORM_PORTS_PANEL_TITLE} />
       </span>
     );

diff --git a/src/js/components/PluginMountPointComponent.jsx b/src/js/components/PluginMountPointComponent.jsx
@@ -6,9 +6,16 @@ import PluginComponentStore from "../stores/PluginComponentStore";
 var PluginMountPointComponent = React.createClass({
 
   propTypes: {
+    className: React.PropTypes.string,
     placeId: React.PropTypes.string.isRequired
   },
 
+  getDefaultProps: function () {
+    return {
+      className: null
+    };
+  },
+
   getInitialState: function () {
     return {
       mountPoint: []
@@ -51,7 +58,7 @@ var PluginMountPointComponent = React.createClass({
   },
 
   render: function () {
-    return <div>{this.state.mountPoint}</div>;
+    return <div className={this.props.className}>{this.state.mountPoint}</div>;
   }
 });