Merge branch 'adjust-connection-info-margins'

4 files changed, 5 insertions, 4 deletions

diff --git a/gui/src/renderer/components/ConnectionPanel.tsx b/gui/src/renderer/components/ConnectionPanel.tsx
index b6e14f21d9..060802a1d9 100644
--- a/gui/src/renderer/components/ConnectionPanel.tsx
+++ b/gui/src/renderer/components/ConnectionPanel.tsx
@@ -76,6 +76,7 @@ const Header = styled.div({
   alignSelf: 'start',
   display: 'flex',
   alignItems: 'center',
+  width: '100%',
 });
 
 export default class ConnectionPanel extends React.Component<IProps> {
diff --git a/gui/src/renderer/components/ConnectionPanelDisclosure.tsx b/gui/src/renderer/components/ConnectionPanelDisclosure.tsx
index bb6bdc988c..11ec9a0136 100644
--- a/gui/src/renderer/components/ConnectionPanelDisclosure.tsx
+++ b/gui/src/renderer/components/ConnectionPanelDisclosure.tsx
@@ -40,8 +40,8 @@ export default function ConnectionPanelDisclosure(props: IProps) {
       <Caption open={props.pointsUp}>{props.children}</Caption>
       <Chevron
         source={props.pointsUp ? 'icon-chevron-up' : 'icon-chevron-down'}
-        width={24}
-        height={24}
+        width={22}
+        height={22}
         tintColor={colors.white40}
       />
     </Container>
diff --git a/gui/src/renderer/components/Marquee.tsx b/gui/src/renderer/components/Marquee.tsx
index 778a47cefb..c65524d722 100644
--- a/gui/src/renderer/components/Marquee.tsx
+++ b/gui/src/renderer/components/Marquee.tsx
@@ -9,6 +9,8 @@ const Container = styled.div({
 
 const Text = styled.span({}, (props: { overflow: number; alignRight: boolean }) => ({
   display: 'inline-block',
+  // Prevents Container from adding 2px below the text.
+  verticalAlign: 'middle',
   whiteSpace: 'nowrap',
   willChange: 'transform',
   transform: props.alignRight ? `translate(${-props.overflow}px)` : 'translate(0)',
diff --git a/gui/src/renderer/components/TunnelControl.tsx b/gui/src/renderer/components/TunnelControl.tsx
index 5adcdee4b1..c7617bfdda 100644
--- a/gui/src/renderer/components/TunnelControl.tsx
+++ b/gui/src/renderer/components/TunnelControl.tsx
@@ -31,7 +31,6 @@ const SwitchLocationButton = styled(AppButton.TransparentButton)({
 const Secured = styled(SecuredLabel)(normalText, {
   fontWeight: 700,
   lineHeight: '22px',
-  marginBottom: '2px',
 });
 
 const Footer = styled.div({
@@ -60,7 +59,6 @@ const Wrapper = styled.div({
 const Location = styled.div({
   display: 'flex',
   flexDirection: 'column',
-  marginBottom: 2,
 });
 
 const LocationRow = styled.div({