Spearhead
/
joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

feat(instances): adjust network info container width

This commit is contained in:
Fábio Moreira 2018-05-25 15:46:48 +01:00
parent 8ac9ca3645
commit 1f54a586f3
1 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/resource-widgets/src/network/index.js
View File

@ -49,6 +49,10 @@ const CardHeader = styled(BaseCardHeader)`
`}; `};
`; `;
const ResponsiveFormGroup = styled(FormGroup)`
width: 100%;
`;
export const Collapsed = ({ name, fabric, ...network }) => ( export const Collapsed = ({ name, fabric, ...network }) => (
<Margin inline right={3} top={3}> <Margin inline right={3} top={3}>
<Box> <Box>
@ -262,7 +266,7 @@ export const Expanded = ({
) : null} ) : null}
<FlexItem> <FlexItem>
<Margin bottom={2}> <Margin bottom={2}>
<FormGroup name="id"> <ResponsiveFormGroup name="id">
<FormLabel>ID</FormLabel> <FormLabel>ID</FormLabel>
<Margin top={0.5}> <Margin top={0.5}>
<Input <Input
@ -273,11 +277,11 @@ export const Expanded = ({
value={id} value={id}
/> />
</Margin> </Margin>
</FormGroup> </ResponsiveFormGroup>
</Margin> </Margin>
</FlexItem> </FlexItem>
<FlexItem> <FlexItem>
<FormGroup name="subnet"> <ResponsiveFormGroup name="subnet">
<FormLabel>Subnet</FormLabel> <FormLabel>Subnet</FormLabel>
<Margin top={0.5}> <Margin top={0.5}>
<Input <Input
@ -288,10 +292,10 @@ export const Expanded = ({
value={subnet} value={subnet}
/> />
</Margin> </Margin>
</FormGroup> </ResponsiveFormGroup>
</FlexItem> </FlexItem>
<FlexItem> <FlexItem>
<FormGroup name="ip-range"> <ResponsiveFormGroup name="ip-range">
<FormLabel>IP range</FormLabel> <FormLabel>IP range</FormLabel>
<Margin top={0.5}> <Margin top={0.5}>
<Input <Input
@ -302,7 +306,7 @@ export const Expanded = ({
value={`${provision_start_ip} - ${provision_end_ip}`} value={`${provision_start_ip} - ${provision_end_ip}`}
/> />
</Margin> </Margin>
</FormGroup> </ResponsiveFormGroup>
</FlexItem> </FlexItem>
</Flex> </Flex>
</Padding> </Padding>