diff options
| author | Oskar Nyberg <oskar@mullvad.net> | 2020-08-25 11:25:31 +0200 |
|---|---|---|
| committer | Oskar Nyberg <oskar@mullvad.net> | 2020-08-25 11:25:31 +0200 |
| commit | 03c6a74aeef56ed3a3dbe83a62c4cf2bd922023e (patch) | |
| tree | 9a8b8a2344c31981dd5062173b1cbc3f10230c1c /gui/src | |
| parent | 03a0f1c83b807148f155dd71a500b24137a9d47d (diff) | |
| download | mullvadvpn-03c6a74aeef56ed3a3dbe83a62c4cf2bd922023e.tar.xz mullvadvpn-03c6a74aeef56ed3a3dbe83a62c4cf2bd922023e.zip | |
Make addresses use one line each
Diffstat (limited to 'gui/src')
| -rw-r--r-- | gui/src/renderer/components/ConnectionPanel.tsx | 9 |
1 files changed, 7 insertions, 2 deletions
diff --git a/gui/src/renderer/components/ConnectionPanel.tsx b/gui/src/renderer/components/ConnectionPanel.tsx index 248d466706..d0b0098d50 100644 --- a/gui/src/renderer/components/ConnectionPanel.tsx +++ b/gui/src/renderer/components/ConnectionPanel.tsx @@ -60,6 +60,11 @@ const Caption = styled(Text)({ marginRight: '8px', }); +const IpAddresses = styled.div({ + display: 'flex', + flexDirection: 'column', +}); + const Header = styled.div({ display: 'flex', alignItems: 'center', @@ -100,10 +105,10 @@ export default class ConnectionPanel extends React.Component<IProps> { {outAddress && (outAddress.ipv4 || outAddress.ipv6) && ( <Row> <Caption>{messages.pgettext('connection-info', 'Out')}</Caption> - <div> + <IpAddresses> {outAddress.ipv4 && <Text>{outAddress.ipv4}</Text>} {outAddress.ipv6 && <Text>{outAddress.ipv6}</Text>} - </div> + </IpAddresses> </Row> )} </React.Fragment> |