1 files changed, 33 insertions, 36 deletions
diff --git a/gui/src/renderer/components/Launch.tsx b/gui/src/renderer/components/Launch.tsx
index 62c561c7b8..9cb7a23d44 100644
--- a/gui/src/renderer/components/Launch.tsx
+++ b/gui/src/renderer/components/Launch.tsx
@@ -1,5 +1,4 @@
-import * as React from 'react';
-import { Styles, Text, View } from 'reactxp';
+import React from 'react';
 import styled from 'styled-components';
 import { colors } from '../../config.json';
 import { messages } from '../../shared/gettext';
@@ -7,31 +6,31 @@ import { HeaderBarSettingsButton } from './HeaderBar';
 import ImageView from './ImageView';
 import { Container, Header, Layout } from './Layout';
 
-const styles = {
-  container: Styles.createViewStyle({
-    flex: 1,
-    flexDirection: 'column',
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginTop: -150,
-  }),
-  title: Styles.createTextStyle({
-    fontFamily: 'DINPro',
-    fontSize: 24,
-    fontWeight: '900',
-    lineHeight: 30,
-    color: colors.white60,
-    marginBottom: 4,
-  }),
-  subtitle: Styles.createTextStyle({
-    fontFamily: 'Open Sans',
-    fontSize: 14,
-    lineHeight: 20,
-    marginHorizontal: 22,
-    color: colors.white40,
-    textAlign: 'center',
-  }),
-};
+const StyledContainer = styled(Container)({
+  flex: 1,
+  flexDirection: 'column',
+  alignItems: 'center',
+  justifyContent: 'center',
+  marginTop: '-150px',
+});
+
+const Title = styled.span({
+  fontFamily: 'DINPro',
+  fontSize: '24px',
+  fontWeight: 900,
+  lineHeight: '30px',
+  color: colors.white60,
+  marginBottom: '4px',
+});
+
+const Subtitle = styled.span({
+  fontFamily: 'Open Sans',
+  fontSize: '14px',
+  lineHeight: '20px',
+  marginHorizontal: '22px',
+  color: colors.white40,
+  textAlign: 'center',
+});
 
 const Logo = styled(ImageView)({
   marginBottom: '5px',
@@ -43,15 +42,13 @@ export default function Launch() {
       <Header>
         <HeaderBarSettingsButton />
       </Header>
-      <Container>
-        <View style={styles.container}>
-          <Logo height={106} width={106} source="logo-icon" />
-          <Text style={styles.title}>{messages.pgettext('generic', 'MULLVAD VPN')}</Text>
-          <Text style={styles.subtitle}>
-            {messages.pgettext('launch-view', 'Connecting to Mullvad system service...')}
-          </Text>
-        </View>
-      </Container>
+      <StyledContainer>
+        <Logo height={106} width={106} source="logo-icon" />
+        <Title>{messages.pgettext('generic', 'MULLVAD VPN')}</Title>
+        <Subtitle>
+          {messages.pgettext('launch-view', 'Connecting to Mullvad system service...')}
+        </Subtitle>
+      </StyledContainer>
     </Layout>
   );
 }