diff --git a/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js index 9a214880..f04a30be 100644 --- a/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/FormUrlEncodedParams/StyledWrapper.js @@ -5,6 +5,7 @@ const Wrapper = styled.div` width: 100%; border-collapse: collapse; font-weight: 600; + table-layout: fixed; thead, td { @@ -18,6 +19,14 @@ const Wrapper = styled.div` } td { padding: 6px 10px; + + &:nth-child(1) { + width: 30%; + } + + &:nth-child(3) { + width: 70px; + } } } diff --git a/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js index 0142fd52..de3218cb 100644 --- a/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js @@ -5,6 +5,7 @@ const Wrapper = styled.div` width: 100%; border-collapse: collapse; font-weight: 600; + table-layout: fixed; thead, td { @@ -18,6 +19,14 @@ const Wrapper = styled.div` } td { padding: 6px 10px; + + &:nth-child(1) { + width: 30%; + } + + &:nth-child(3) { + width: 70px; + } } } diff --git a/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js b/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js index fbcaabd2..a15d5a4b 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js +++ b/packages/bruno-app/src/components/RequestPane/QueryParams/StyledWrapper.js @@ -5,6 +5,7 @@ const Wrapper = styled.div` width: 100%; border-collapse: collapse; font-weight: 600; + table-layout: fixed; thead, td { @@ -18,6 +19,14 @@ const Wrapper = styled.div` } td { padding: 6px 10px; + + &:nth-child(1) { + width: 30%; + } + + &:nth-child(3) { + width: 70px; + } } } diff --git a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js index dfdc8196..eda5e33e 100644 --- a/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js +++ b/packages/bruno-app/src/components/RequestPane/QueryUrl/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useState, useEffect} from 'react'; import get from 'lodash/get'; import { useDispatch } from 'react-redux'; import { requestUrlChanged, updateRequestMethod } from 'providers/ReduxStore/slices/collections'; @@ -15,6 +15,13 @@ const QueryUrl = ({ item, collection, handleRun }) => { const method = item.draft ? get(item, 'draft.request.method') : get(item, 'request.method'); const url = item.draft ? get(item, 'draft.request.url') : get(item, 'request.url'); + const [methodSelectorWidth, setMethodSelectorWidth] = useState(90); + + useEffect(() => { + const el = document.querySelector(".method-selector-container"); + setMethodSelectorWidth(el.offsetWidth); + }, [method]); + const onSave = () => dispatch(saveRequest(item.uid, collection.uid)); const onUrlChange = (value) => { dispatch( @@ -41,7 +48,14 @@ const QueryUrl = ({ item, collection, handleRun }) => {