From 9b0b007a5da75d70ec25b141c2a47b1b0010f5a3 Mon Sep 17 00:00:00 2001
From: Clemens <cle1000.cb@gmail.com>
Date: Fri, 5 Aug 2016 12:47:34 +0200
Subject: change some style

---
 web/src/js/components/FlowView/Messages.jsx | 96 +++++++++++++++++------------
 1 file changed, 57 insertions(+), 39 deletions(-)

(limited to 'web/src/js/components/FlowView/Messages.jsx')

diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx
index 9de25b5b..27644823 100644
--- a/web/src/js/components/FlowView/Messages.jsx
+++ b/web/src/js/components/FlowView/Messages.jsx
@@ -5,6 +5,7 @@ import { connect } from 'react-redux'
 import { RequestUtils, isValidHttpVersion, parseUrl } from '../../flow/utils.js'
 import { formatTimeStamp } from '../../utils.js'
 import ContentView from '../ContentView'
+import ContentViewOptions from '../ContentView/ContentViewOptions'
 import ValidateEditor from '../ValueEditor/ValidateEditor'
 import ValueEditor from '../ValueEditor/ValueEditor'
 
@@ -81,27 +82,35 @@ const Message = connect(
 export class Request extends Component {
     render() {
         const { flow, isEdit, updateFlow, uploadContent } = this.props
-
+        let noContent =  !isEdit && (flow.request.contentLength == 0 || flow.request.contentLength == null)
         return (
-            <section className="request">
-                <ToggleEdit/>
-                <RequestLine
-                    flow={flow}
-                    readonly={!isEdit}
-                    updateFlow={updateFlow}/>
-                <Headers
-                    message={flow.request}
-                    readonly={!isEdit}
-                    onChange={headers => updateFlow({ request: { headers } })}
-                />
-
-                <hr/>
-                <ContentView
-                    readonly={!isEdit}
-                    flow={flow}
-                    onContentChange={content => updateFlow({ request: {content}})}
-                    uploadContent={content => uploadContent(flow, content, "request")}
-                    message={flow.request}/>
+            <section className="request flowview-container">
+                <div className="flowview-body">
+                    <ToggleEdit/>
+                    <RequestLine
+                        flow={flow}
+                        readonly={!isEdit}
+                        updateFlow={updateFlow}/>
+                    <Headers
+                        message={flow.request}
+                        readonly={!isEdit}
+                        onChange={headers => updateFlow({ request: { headers } })}
+                    />
+
+                    <hr/>
+                    <ContentView
+                        readonly={!isEdit}
+                        flow={flow}
+                        onContentChange={content => updateFlow({ request: {content}})}
+                        message={flow.request}/>
+                </div>
+                <div hidden={noContent} className="flowview-footer">
+                    <ContentViewOptions
+                        flow={flow}
+                        readonly={!isEdit}
+                        message={flow.request}
+                        uploadContent={content => uploadContent(flow, content, "request")}/>
+                </div>
             </section>
         )
     }
@@ -137,27 +146,36 @@ Request = Message(Request)
 export class Response extends Component {
     render() {
         const { flow, isEdit, updateFlow, uploadContent } = this.props
+        let noContent =  !isEdit && (flow.response.contentLength == 0 || flow.response.contentLength == null)
 
         return (
-            <section className="response">
-                <ToggleEdit/>
-                <ResponseLine
-                    flow={flow}
-                    readonly={!isEdit}
-                    updateFlow={updateFlow}/>
-                <Headers
-                    message={flow.response}
-                    readonly={!isEdit}
-                    onChange={headers => updateFlow({ response: { headers } })}
-                />
-                <hr/>
-                <ContentView
-                    readonly={!isEdit}
-                    flow={flow}
-                    onContentChange={content => updateFlow({ response: {content}})}
-                    uploadContent={content => uploadContent(flow, content, "response")}
-                    message={flow.response}
-                />
+            <section className="response flowview-container">
+                <div className="flowview-body">
+                    <ToggleEdit/>
+                    <ResponseLine
+                        flow={flow}
+                        readonly={!isEdit}
+                        updateFlow={updateFlow}/>
+                    <Headers
+                        message={flow.response}
+                        readonly={!isEdit}
+                        onChange={headers => updateFlow({ response: { headers } })}
+                    />
+                    <hr/>
+                    <ContentView
+                        readonly={!isEdit}
+                        flow={flow}
+                        onContentChange={content => updateFlow({ response: {content}})}
+                        message={flow.response}
+                    />
+                </div>
+                <div hidden={noContent} className="flowview-footer">
+                    <ContentViewOptions
+                        flow={flow}
+                        message={flow.response}
+                        uploadContent={content => uploadContent(flow, content, "response")}
+                        readonly={!isEdit}/>
+                </div>
             </section>
         )
     }
-- 
cgit v1.2.3


From adfdcc9391ed70202a1b4af65259a89634f36fa0 Mon Sep 17 00:00:00 2001
From: Clemens <cle1000.cb@gmail.com>
Date: Tue, 9 Aug 2016 08:40:24 +0200
Subject: added hints from mhils

---
 web/src/js/components/FlowView/Messages.jsx | 44 ++++++++++++++++-------------
 1 file changed, 24 insertions(+), 20 deletions(-)

(limited to 'web/src/js/components/FlowView/Messages.jsx')

diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx
index 27644823..6d049fa4 100644
--- a/web/src/js/components/FlowView/Messages.jsx
+++ b/web/src/js/components/FlowView/Messages.jsx
@@ -84,8 +84,8 @@ export class Request extends Component {
         const { flow, isEdit, updateFlow, uploadContent } = this.props
         let noContent =  !isEdit && (flow.request.contentLength == 0 || flow.request.contentLength == null)
         return (
-            <section className="request flowview-container">
-                <div className="flowview-body">
+            <section className="request">
+                <article>
                     <ToggleEdit/>
                     <RequestLine
                         flow={flow}
@@ -103,14 +103,16 @@ export class Request extends Component {
                         flow={flow}
                         onContentChange={content => updateFlow({ request: {content}})}
                         message={flow.request}/>
-                </div>
-                <div hidden={noContent} className="flowview-footer">
-                    <ContentViewOptions
-                        flow={flow}
-                        readonly={!isEdit}
-                        message={flow.request}
-                        uploadContent={content => uploadContent(flow, content, "request")}/>
-                </div>
+                </article>
+                {!noContent &&
+                    <footer>
+                        <ContentViewOptions
+                            flow={flow}
+                            readonly={!isEdit}
+                            message={flow.request}
+                            uploadContent={content => uploadContent(flow, content, "request")}/>
+                    </footer>
+                }
             </section>
         )
     }
@@ -149,8 +151,8 @@ export class Response extends Component {
         let noContent =  !isEdit && (flow.response.contentLength == 0 || flow.response.contentLength == null)
 
         return (
-            <section className="response flowview-container">
-                <div className="flowview-body">
+            <section className="response">
+                <article>
                     <ToggleEdit/>
                     <ResponseLine
                         flow={flow}
@@ -168,14 +170,16 @@ export class Response extends Component {
                         onContentChange={content => updateFlow({ response: {content}})}
                         message={flow.response}
                     />
-                </div>
-                <div hidden={noContent} className="flowview-footer">
-                    <ContentViewOptions
-                        flow={flow}
-                        message={flow.response}
-                        uploadContent={content => uploadContent(flow, content, "response")}
-                        readonly={!isEdit}/>
-                </div>
+                </article>
+                {!noContent &&
+                    <footer >
+                        <ContentViewOptions
+                            flow={flow}
+                            message={flow.response}
+                            uploadContent={content => uploadContent(flow, content, "response")}
+                            readonly={!isEdit}/>
+                    </footer>
+                }
             </section>
         )
     }
-- 
cgit v1.2.3


From 78bd99f97c36ba24bbab389350eb8e80ba16738f Mon Sep 17 00:00:00 2001
From: Clemens <cle1000.cb@gmail.com>
Date: Tue, 9 Aug 2016 16:15:45 +0200
Subject: little changes in css

---
 web/src/js/components/FlowView/Messages.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'web/src/js/components/FlowView/Messages.jsx')

diff --git a/web/src/js/components/FlowView/Messages.jsx b/web/src/js/components/FlowView/Messages.jsx
index 6d049fa4..93c52660 100644
--- a/web/src/js/components/FlowView/Messages.jsx
+++ b/web/src/js/components/FlowView/Messages.jsx
@@ -216,7 +216,7 @@ ErrorView.propTypes = {
 
 export function ErrorView({ flow }) {
     return (
-        <section>
+        <section className="error">
             <div className="alert alert-warning">
                 {flow.error.msg}
                 <div>
-- 
cgit v1.2.3