From 412d95c7e2a2cee0e5fbad8011b315ea642b93fc Mon Sep 17 00:00:00 2001
From: sveisvei <sveinung.rosaker@gmail.com>
Date: Sat, 10 Dec 2016 12:35:28 +0100
Subject: [PATCH] fix titles

---
 frontend/src/component/feature/form/index.jsx            | 9 +++++++--
 frontend/src/component/feature/view-edit-container.jsx   | 4 ++--
 .../src/component/strategies/show-strategy-component.js  | 5 ++---
 frontend/src/page/features/create.js                     | 8 ++------
 4 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/frontend/src/component/feature/form/index.jsx b/frontend/src/component/feature/form/index.jsx
index 63073396f1..1682ea1c79 100644
--- a/frontend/src/component/feature/form/index.jsx
+++ b/frontend/src/component/feature/form/index.jsx
@@ -2,7 +2,7 @@ import React, { Component, PropTypes } from 'react';
 import { Textfield, Switch } from 'react-mdl';
 import StrategiesSection from './strategies-section-container';
 
-import { FormButtons } from '../../common';
+import { FormButtons, HeaderTitle } from '../../common';
 
 const trim = (value) => {
     if (value && value.trim) {
@@ -32,6 +32,7 @@ class AddFeatureToggleComponent extends Component {
             onSubmit,
             onCancel,
             editmode = false,
+            title,
         } = this.props;
 
         const {
@@ -44,8 +45,10 @@ class AddFeatureToggleComponent extends Component {
 
         return (
             <form onSubmit={onSubmit(input)}>
+                <HeaderTitle title={title} />
                 <section>
                     <Textfield
+                        floatingLabel
                         label="Name"
                         name="name"
                         disabled={editmode}
@@ -56,7 +59,9 @@ class AddFeatureToggleComponent extends Component {
                         onChange={(v) => setValue('name', trim(v.target.value))} />
                     <br />
                     <Textfield
-                        rows={2}
+                        floatingLabel
+                        style={{ width: '100%' }}
+                        rows={5}
                         label="Description"
                         required
                         value={description}
diff --git a/frontend/src/component/feature/view-edit-container.jsx b/frontend/src/component/feature/view-edit-container.jsx
index 89f0a74901..9551ee28d4 100644
--- a/frontend/src/component/feature/view-edit-container.jsx
+++ b/frontend/src/component/feature/view-edit-container.jsx
@@ -124,8 +124,8 @@ class EditFeatureToggleWrapper extends React.Component {
                 <p>{featureToggle.description}</p>
 
                 <hr />
-                <h4>Edit</h4>
-                <EditFeatureToggle featureToggle={featureToggle} />
+
+                <EditFeatureToggle title="Edit" featureToggle={featureToggle} />
             </div>
         );
     }
diff --git a/frontend/src/component/strategies/show-strategy-component.js b/frontend/src/component/strategies/show-strategy-component.js
index 8258fa4981..bfa8d99dc3 100644
--- a/frontend/src/component/strategies/show-strategy-component.js
+++ b/frontend/src/component/strategies/show-strategy-component.js
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { Grid, Cell } from 'react-mdl';
 
-import { AppsLinkList } from '../common';
+import { AppsLinkList, HeaderTitle } from '../common';
 
 class ShowStrategyComponent extends Component {
     componentDidMount () {
@@ -43,8 +43,7 @@ class ShowStrategyComponent extends Component {
 
         return (
             <div>
-                <h4>{name}</h4>
-                <p>{description}</p>
+                <HeaderTitle title={name} subtitle={description} />
                 <Grid>
                     <Cell col={6}>
                         <h6>Parameters</h6>
diff --git a/frontend/src/page/features/create.js b/frontend/src/page/features/create.js
index 784c9f6dbe..f621b98def 100644
--- a/frontend/src/page/features/create.js
+++ b/frontend/src/page/features/create.js
@@ -1,11 +1,7 @@
 import React from 'react';
 import AddFeatureToggleForm from '../../component/feature/form-add-container';
 
-const render = () => (
-    <div>
-        <h6>Create feature toggle</h6>
-        <AddFeatureToggleForm />
-    </div>
-);
+
+const render = () => (<AddFeatureToggleForm title="Create feature toggle" />);
 
 export default render;