diff --git a/packages/bruno-app/src/components/ResponsePane/QueryResponse/StyledWrapper.js b/packages/bruno-app/src/components/ResponsePane/QueryResponse/StyledWrapper.js index ee599f4dd..61913b7cc 100644 --- a/packages/bruno-app/src/components/ResponsePane/QueryResponse/StyledWrapper.js +++ b/packages/bruno-app/src/components/ResponsePane/QueryResponse/StyledWrapper.js @@ -6,10 +6,10 @@ const StyledWrapper = styled.div` height: 100%; width: 100%; border-radius: 4px; - border: 1px solid ${(props) => props.theme.console.border}; + border: 1px solid ${(props) => props.theme.table.border}; .result-type-selector { - border-bottom: 1px solid ${(props) => props.theme.console.border}; + border-bottom: 1px solid ${(props) => props.theme.table.border}; } `; diff --git a/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/StyledWrapper.js b/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/StyledWrapper.js index ced0f0904..98c6680f5 100644 --- a/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/StyledWrapper.js +++ b/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/StyledWrapper.js @@ -1,6 +1,12 @@ import styled from 'styled-components'; const Wrapper = styled.div` + .table-wrapper { + border: 1px solid ${(props) => props.theme.table.border}; + border-radius: 4px; + overflow: hidden; + } + table { width: 100%; border-collapse: collapse; @@ -9,12 +15,24 @@ const Wrapper = styled.div` color: #777777; font-size: ${(props) => props.theme.font.size.sm}; font-weight: 500; - text-transform: uppercase; + + td { + border-top: none; + } } td { + border: 1px solid ${(props) => props.theme.table.border}; padding: 6px 10px; + &:first-child { + border-left: none; + } + + &:last-child { + border-right: none; + } + &.value { word-break: break-all; } @@ -24,6 +42,10 @@ const Wrapper = styled.div` tr:nth-child(odd) { background-color: ${(props) => props.theme.table.striped}; } + + tr:last-child td { + border-bottom: none; + } } } `; diff --git a/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js b/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js index 9964a5f4b..f4614520a 100644 --- a/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js +++ b/packages/bruno-app/src/components/ResponsePane/ResponseHeaders/index.js @@ -6,26 +6,28 @@ const ResponseHeaders = ({ headers }) => { return ( - - - - - - - - - {headersArray && headersArray.length - ? headersArray.map((header, index) => { - return ( - - - - - ); - }) - : null} - -
NameValue
{header[0]}{header[1]}
+
+ + + + + + + + + {headersArray && headersArray.length + ? headersArray.map((header, index) => { + return ( + + + + + ); + }) + : null} + +
NameValue
{header[0]}{header[1]}
+
); }; diff --git a/packages/bruno-app/src/components/RunnerResults/ResponsePane/index.js b/packages/bruno-app/src/components/RunnerResults/ResponsePane/index.js index 483bd8e8d..7aedf12f9 100644 --- a/packages/bruno-app/src/components/RunnerResults/ResponsePane/index.js +++ b/packages/bruno-app/src/components/RunnerResults/ResponsePane/index.js @@ -129,7 +129,7 @@ const ResponsePane = ({ rightPaneWidth, item, collection }) => { -
+
{hasScriptError && showScriptErrorCard && (