extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2024-11-21 23:43:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

style: add logic to handle different screen sizes

Browse Source
This commit is contained in:
Pragadesh-45 2024-10-16 13:00:00 +05:30
parent b900d3070d
commit ca6c2ebb03
2 changed files with 23 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/StyledWrapper.js
View File

@ -35,6 +35,28 @@ const StyledWrapper = styled.div`
background-color: ${(props) => props.theme.collection.environment.settings.item.active.hoverBg} !important; background-color: ${(props) => props.theme.collection.environment.settings.item.active.hoverBg} !important;
} }
} }
.flexible-container {
width: 100%;
}
@media (max-width: 600px) {
.flexible-container {
width: 500px;
}
}
@media (min-width: 601px) and (max-width: 1200px) {
.flexible-container {
width: 800px;
}
}
@media (min-width: 1201px) {
.flexible-container {
width: 900px;
}
}
`; `;
export default StyledWrapper; export default StyledWrapper;

2
packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/index.js
View File

@ -48,7 +48,7 @@ const GenerateCodeItem = ({ collection, item, onClose }) => {
return ( return (
<Modal size="lg" title="Generate Code" handleCancel={onClose} hideFooter={true}> <Modal size="lg" title="Generate Code" handleCancel={onClose} hideFooter={true}>
<StyledWrapper> <StyledWrapper>
<div className="flex w-full" style={{ width: '1000px' }}> <div className="flex w-full flexible-container">
<div> <div>
<div className="generate-code-sidebar"> <div className="generate-code-sidebar">
{languages && {languages &&