Merge branch 'update-android-logo'

4 files changed, 88 insertions, 47 deletions

diff --git a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/TopBar.kt b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/TopBar.kt
index d44a06b19c..7756479883 100644
--- a/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/TopBar.kt
+++ b/android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/TopBar.kt
@@ -16,12 +16,20 @@ import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import androidx.constraintlayout.compose.ConstraintLayout
 import net.mullvad.mullvadvpn.R
 
+@Preview
+@Composable
+fun PreviewTopBar() {
+    TopBar(
+        backgroundColor = colorResource(R.color.blue),
+        onSettingsClicked = {}
+    )
+}
+
 @Composable
 fun TopBar(
     backgroundColor: Color,
@@ -44,29 +52,26 @@ fun TopBar(
                 .width(44.dp)
                 .height(44.dp)
                 .constrainAs(logo) {
+                    centerVerticallyTo(parent)
                     start.linkTo(parent.start, margin = 16.dp)
-                    top.linkTo(parent.top, margin = 12.dp)
-                    bottom.linkTo(parent.bottom, margin = 12.dp)
                 }
         )
 
-        CapsText(
-            text = stringResource(id = R.string.app_name),
-            fontWeight = FontWeight.Bold,
-            fontSize = 24.sp,
-            color = colorResource(id = R.color.white80),
+        Icon(
+            painter = painterResource(id = R.drawable.logo_text),
+            tint = colorResource(id = R.color.white80),
+            contentDescription = null, // No meaningful user info or action.
             modifier = Modifier
+                .height(16.dp)
                 .constrainAs(appName) {
-                    start.linkTo(logo.end, margin = 9.dp)
-                    top.linkTo(parent.top, margin = 12.dp)
+                    centerVerticallyTo(parent)
+                    start.linkTo(logo.end, margin = 8.dp)
                 }
         )
 
-        Icon(
+        Image(
             painter = painterResource(R.drawable.icon_settings),
             contentDescription = stringResource(id = R.string.settings),
-            tint = Color.White,
-
             modifier = Modifier
                 .clickable { onSettingsClicked() }
                 .fillMaxHeight()
diff --git a/android/app/src/main/res/drawable/logo_text.xml b/android/app/src/main/res/drawable/logo_text.xml
new file mode 100644
index 0000000000..aacefa3579
--- /dev/null
+++ b/android/app/src/main/res/drawable/logo_text.xml
@@ -0,0 +1,26 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+        android:width="959.5dp"
+        android:height="103.7dp"
+        android:viewportWidth="959.5"
+        android:viewportHeight="103.7">
+    <path android:pathData="m0,1.6c0,-0.9 0.6,-1.5 1.5,-1.5h17.8c1.2,0 2,0.4 2.4,1.5l25.8,58.2h0.6l25.3,-58.2c0.4,-1 1.2,-1.5 2.4,-1.5h17.5c0.9,0 1.5,0.6 1.5,1.5v99c0,0.9 -0.6,1.5 -1.5,1.5h-17c-0.9,0 -1.5,-0.6 -1.5,-1.5v-57.4h-0.6l-18.9,43c-0.6,1.4 -1.5,2 -2.8,2h-10.3c-1.3,0 -2.2,-0.6 -2.8,-2l-18.9,-43h-0.6v57.4c0,0.9 -0.6,1.5 -1.5,1.5h-16.9c-0.9,0 -1.5,-0.6 -1.5,-1.5z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m117,64.6v-63c0,-0.9 0.6,-1.5 1.5,-1.5h19c0.9,0 1.5,0.6 1.5,1.5v63.6c0,12.1 6.8,19 17.1,19 10.2,0 16.9,-6.9 16.9,-19v-63.6c0,-0.9 0.6,-1.5 1.5,-1.5h19c0.9,0 1.5,0.6 1.5,1.5v63c0,25.3 -16.2,39.1 -39,39.1s-39,-13.8 -39,-39.1z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m217.2,1.6c0,-0.9 0.6,-1.5 1.5,-1.5h19c0.9,0 1.5,0.6 1.5,1.5v79.9c0,0.6 0.3,0.9 0.9,0.9h45c0.9,0 1.5,0.6 1.5,1.5v16.6c0,0.9 -0.6,1.5 -1.5,1.5h-66.4c-0.9,0 -1.5,-0.6 -1.5,-1.5z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m302.7,1.6c0,-0.9 0.6,-1.5 1.5,-1.5h19c0.9,0 1.5,0.6 1.5,1.5v79.9c0,0.6 0.3,0.9 0.9,0.9h45c0.9,0 1.5,0.6 1.5,1.5v16.6c0,0.9 -0.6,1.5 -1.5,1.5h-66.4c-0.9,0 -1.5,-0.6 -1.5,-1.5z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m403.7,102c-1,0 -1.6,-0.6 -1.9,-1.5l-32.4,-98.8c-0.3,-1.1 0.3,-1.6 1.3,-1.6h19.5c1,0 1.7,0.4 2,1.5l20.4,66.9h0.4l19.8,-66.9c0.3,-1 0.9,-1.5 1.9,-1.5h19.3c0.9,0 1.5,0.6 1.2,1.6l-32.4,98.8c-0.3,0.9 -0.9,1.5 -1.8,1.5z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m491.1,1.6c0.3,-0.9 0.9,-1.5 2,-1.5h18.9c1,0 1.6,0.6 1.9,1.5l34.5,99c0.3,0.9 0,1.5 -1,1.5h-19.5c-1,0 -1.7,-0.5 -2,-1.5l-5.8,-17.8h-35.7l-5.7,17.8c-0.3,1 -0.9,1.5 -2,1.5h-19.6c-1,0 -1.3,-0.6 -1,-1.5zM514.1,64 L502.6,28.3h-0.4l-11.5,35.7z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m563.3,1.6c0,-0.9 0.6,-1.5 1.5,-1.5h37.9c17.8,0 30.3,7.6 35.2,22.9 1.8,5.7 2.7,11.4 2.7,28s-0.9,22.3 -2.7,28c-4.9,15.3 -17.4,22.9 -35.2,22.9h-37.9c-0.9,0 -1.5,-0.6 -1.5,-1.5zM586.2,82.4h11.5c10.2,0 16.3,-3 18.9,-11.2 1,-3 1.7,-6.9 1.7,-20.1s-0.6,-17.1 -1.7,-20.1c-2.5,-8.2 -8.7,-11.2 -18.9,-11.2h-11.5c-0.6,0 -0.9,0.3 -0.9,0.9v60.9c0,0.5 0.3,0.8 0.9,0.8z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m721.1,102c-1.1,0 -1.7,-0.6 -2,-1.5l-32.4,-98.8c-0.3,-1.1 0.3,-1.6 1.3,-1.6h19.5c1,0 1.7,0.4 2,1.5l20.4,66.9h0.4l19.8,-66.9c0.3,-1 0.9,-1.5 1.9,-1.5h19.3c0.9,0 1.5,0.6 1.2,1.6l-32.4,98.8c-0.3,0.9 -0.9,1.5 -1.8,1.5z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m788.6,102c-0.9,0 -1.5,-0.6 -1.5,-1.5v-99c0,-0.9 0.6,-1.5 1.5,-1.5h39.6c22.2,0 35.5,13.3 35.5,32.8 0,19.2 -13.5,32.7 -35.5,32.7h-18.1c-0.6,0 -0.9,0.3 -0.9,0.9v34c0,0.9 -0.6,1.5 -1.5,1.5h-19.1zM841.7,32.9c0,-8.2 -5.5,-13.8 -14.8,-13.8h-16.8c-0.6,0 -0.9,0.3 -0.9,0.9v25.6c0,0.6 0.3,0.9 0.9,0.9h16.8c9.2,0.1 14.8,-5.3 14.8,-13.6z"
+          android:fillColor="#FFFFFF" />
+    <path android:pathData="m880.8,1.6c0,-0.9 0.6,-1.5 1.5,-1.5h18c1,0 2,0.4 2.5,1.5l36,64.2h0.8v-64.2c0,-0.9 0.6,-1.5 1.5,-1.5h16.9c0.9,0 1.5,0.6 1.5,1.5v99c0,0.9 -0.6,1.5 -1.5,1.5h-17.8c-1.2,0 -2,-0.5 -2.5,-1.5l-36.1,-64h-0.8v64c0,0.9 -0.6,1.5 -1.5,1.5h-16.9c-0.9,0 -1.5,-0.6 -1.5,-1.5v-99z"
+          android:fillColor="#FFFFFF" />
+</vector>
diff --git a/android/app/src/main/res/layout/header_bar.xml b/android/app/src/main/res/layout/header_bar.xml
index a5965596a3..9ca2756626 100644
--- a/android/app/src/main/res/layout/header_bar.xml
+++ b/android/app/src/main/res/layout/header_bar.xml
@@ -1,25 +1,35 @@
-<merge xmlns:android="http://schemas.android.com/apk/res/android">
-    <ImageView android:layout_width="44dp"
-               android:layout_height="44dp"
-               android:layout_marginLeft="16dp"
-               android:layout_marginVertical="12dp"
-               android:layout_weight="0"
-               android:src="@drawable/logo_icon" />
-    <TextView android:layout_width="wrap_content"
-              android:layout_height="wrap_content"
-              android:layout_marginHorizontal="9dp"
-              android:layout_marginVertical="12dp"
-              android:layout_weight="1"
-              android:textColor="@color/white80"
-              android:textSize="@dimen/text_big"
-              android:textStyle="bold"
-              android:text="@string/app_name"
-              android:textAllCaps="true" />
-    <ImageButton android:id="@+id/settings"
-                 android:layout_width="wrap_content"
-                 android:layout_height="match_parent"
-                 android:layout_weight="0"
-                 android:paddingHorizontal="16dp"
-                 android:background="?android:attr/selectableItemBackground"
-                 android:src="@drawable/icon_settings" />
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+       xmlns:app="http://schemas.android.com/apk/res-auto">
+    <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent"
+                                                       android:layout_height="@dimen/top_bar_height">
+
+        <ImageView android:id="@+id/appIcon"
+                   android:layout_width="44dp"
+                   android:layout_height="44dp"
+                   android:src="@drawable/logo_icon"
+                   android:layout_marginStart="16dp"
+                   app:layout_constraintStart_toStartOf="parent"
+                   app:layout_constraintTop_toTopOf="parent"
+                   app:layout_constraintBottom_toBottomOf="parent" />
+        <ImageView android:id="@+id/appLogo"
+                   android:layout_height="16dp"
+                   android:layout_width="wrap_content"
+                   android:adjustViewBounds="true"
+                   android:scaleType="fitCenter"
+                   android:src="@drawable/logo_text"
+                   android:layout_marginStart="8dp"
+                   android:alpha="0.8"
+                   app:layout_constraintStart_toEndOf="@id/appIcon"
+                   app:layout_constraintTop_toTopOf="parent"
+                   app:layout_constraintBottom_toBottomOf="parent" />
+        <ImageButton android:id="@+id/settings"
+                     android:layout_width="wrap_content"
+                     android:layout_height="match_parent"
+                     android:background="?android:attr/selectableItemBackground"
+                     android:paddingHorizontal="16dp"
+                     android:src="@drawable/icon_settings"
+                     app:layout_constraintEnd_toEndOf="parent"
+                     app:layout_constraintTop_toTopOf="parent"
+                     app:layout_constraintBottom_toBottomOf="parent" />
+    </androidx.constraintlayout.widget.ConstraintLayout>
 </merge>
diff --git a/android/app/src/main/res/layout/launch.xml b/android/app/src/main/res/layout/launch.xml
index a6ae06f1ca..24c2fa6350 100644
--- a/android/app/src/main/res/layout/launch.xml
+++ b/android/app/src/main/res/layout/launch.xml
@@ -1,4 +1,5 @@
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
+             xmlns:app="http://schemas.android.com/apk/res-auto"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
     <ImageButton android:id="@+id/settings"
@@ -17,16 +18,15 @@
                   android:gravity="center">
         <ImageView android:layout_width="120dp"
                    android:layout_height="120dp"
-                   android:layout_marginBottom="5dp"
                    android:src="@drawable/launch_logo" />
-        <TextView android:layout_width="wrap_content"
-                  android:layout_height="wrap_content"
-                  android:layout_marginBottom="4dp"
-                  android:textColor="@color/white60"
-                  android:textSize="@dimen/text_big"
-                  android:textStyle="bold"
-                  android:text="@string/app_name"
-                  android:textAllCaps="true" />
+        <ImageView android:layout_height="18dp"
+                   android:layout_width="wrap_content"
+                   android:layout_marginTop="12dp"
+                   android:layout_marginBottom="5dp"
+                   android:adjustViewBounds="true"
+                   android:scaleType="fitCenter"
+                   app:tint="@color/white60"
+                   android:src="@drawable/logo_text" />
         <TextView android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:textColor="@color/white40"