Implement Login screen

13 files changed, 171 insertions, 0 deletions

diff --git a/android/src/main/res/drawable-hdpi/logo_icon.png b/android/src/main/res/drawable-hdpi/logo_icon.png
new file mode 100644
index 0000000000..1701158506
--- /dev/null
+++ b/android/src/main/res/drawable-hdpi/logo_icon.png
diff --git a/android/src/main/res/drawable-mdpi/logo_icon.png b/android/src/main/res/drawable-mdpi/logo_icon.png
new file mode 100644
index 0000000000..4d7b2af4e0
--- /dev/null
+++ b/android/src/main/res/drawable-mdpi/logo_icon.png
diff --git a/android/src/main/res/drawable-xhdpi/logo_icon.png b/android/src/main/res/drawable-xhdpi/logo_icon.png
new file mode 100644
index 0000000000..975ba02b3c
--- /dev/null
+++ b/android/src/main/res/drawable-xhdpi/logo_icon.png
diff --git a/android/src/main/res/drawable-xxhdpi/logo_icon.png b/android/src/main/res/drawable-xxhdpi/logo_icon.png
new file mode 100644
index 0000000000..5a27e27631
--- /dev/null
+++ b/android/src/main/res/drawable-xxhdpi/logo_icon.png
diff --git a/android/src/main/res/drawable-xxxhdpi/logo_icon.png b/android/src/main/res/drawable-xxxhdpi/logo_icon.png
new file mode 100644
index 0000000000..5476db715c
--- /dev/null
+++ b/android/src/main/res/drawable-xxxhdpi/logo_icon.png
diff --git a/android/src/main/res/drawable/icon_arrow_blue20.xml b/android/src/main/res/drawable/icon_arrow_blue20.xml
new file mode 100644
index 0000000000..d6a4616deb
--- /dev/null
+++ b/android/src/main/res/drawable/icon_arrow_blue20.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<vector
+        xmlns:android="http://schemas.android.com/apk/res/android"
+        android:width="24dp"
+        android:height="16dp"
+        android:viewportWidth="24.0"
+        android:viewportHeight="16.0"
+        >
+    <group>
+        <path android:fillColor="#33294D73"
+                android:pathData="M18.7015867,9 L14.4331381,12.762659 C13.851665,13.2752305 13.8579999,14.1003943 14.4392669,14.612784 C15.0245863,15.1287461 15.9602099,15.1275926 16.5380921,14.6181865 L23.5668627,8.42228969 C23.8565791,8.16690324 24.000373,7.83391619 23.999837,7.50067932 L24,7.4966702 C23.999589,7.16348359 23.8547954,6.83138119 23.5668627,6.57756713 L16.5380921,0.381670278 C15.956619,-0.130901228 15.0205338,-0.125317014 14.4392669,0.387072772 C13.8539474,0.903034846 13.8552559,1.72779176 14.4331381,2.23719784 L18.7017491,6 L1.50909424,6 C0.66354084,6 0,6.67157288 0,7.5 C0,8.33420277 0.675644504,9 1.50909424,9 L18.7015867,9 Z"
+                />
+    </group>
+</vector>
diff --git a/android/src/main/res/drawable/icon_arrow_white.xml b/android/src/main/res/drawable/icon_arrow_white.xml
new file mode 100644
index 0000000000..b8497d5fe6
--- /dev/null
+++ b/android/src/main/res/drawable/icon_arrow_white.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<vector
+        xmlns:android="http://schemas.android.com/apk/res/android"
+        android:width="24dp"
+        android:height="16dp"
+        android:viewportWidth="24.0"
+        android:viewportHeight="16.0"
+        >
+    <group>
+        <path android:fillColor="#FFFFFF"
+                android:pathData="M18.7015867,9 L14.4331381,12.762659 C13.851665,13.2752305 13.8579999,14.1003943 14.4392669,14.612784 C15.0245863,15.1287461 15.9602099,15.1275926 16.5380921,14.6181865 L23.5668627,8.42228969 C23.8565791,8.16690324 24.000373,7.83391619 23.999837,7.50067932 L24,7.4966702 C23.999589,7.16348359 23.8547954,6.83138119 23.5668627,6.57756713 L16.5380921,0.381670278 C15.956619,-0.130901228 15.0205338,-0.125317014 14.4392669,0.387072772 C13.8539474,0.903034846 13.8552559,1.72779176 14.4331381,2.23719784 L18.7017491,6 L1.50909424,6 C0.66354084,6 0,6.67157288 0,7.5 C0,8.33420277 0.675644504,9 1.50909424,9 L18.7015867,9 Z"
+                />
+    </group>
+</vector>
diff --git a/android/src/main/res/drawable/login_button_arrow.xml b/android/src/main/res/drawable/login_button_arrow.xml
new file mode 100644
index 0000000000..4a51e51585
--- /dev/null
+++ b/android/src/main/res/drawable/login_button_arrow.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector
+        xmlns:android="http://schemas.android.com/apk/res/android"
+        android:shape="rectangle"
+        >
+    <item android:state_enabled="false" android:drawable="@drawable/icon_arrow_blue20"/>
+    <item android:state_enabled="true" android:drawable="@drawable/icon_arrow_white"/>
+</selector>
diff --git a/android/src/main/res/drawable/login_button_background.xml b/android/src/main/res/drawable/login_button_background.xml
new file mode 100644
index 0000000000..8622392653
--- /dev/null
+++ b/android/src/main/res/drawable/login_button_background.xml
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector
+        xmlns:android="http://schemas.android.com/apk/res/android"
+        android:shape="rectangle"
+        >
+    <item android:state_enabled="false">
+        <shape>
+            <solid android:color="@color/white"/>
+        </shape>
+    </item>
+
+    <item android:state_enabled="true">
+        <shape>
+            <solid android:color="@color/green"/>
+        </shape>
+    </item>
+</selector>
diff --git a/android/src/main/res/drawable/text_input_cursor.xml b/android/src/main/res/drawable/text_input_cursor.xml
new file mode 100644
index 0000000000..ffa98a486b
--- /dev/null
+++ b/android/src/main/res/drawable/text_input_cursor.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="@color/darkBlue"/>
+    <size android:width="2sp" android:height="24sp"/>
+</shape>
diff --git a/android/src/main/res/layout/login.xml b/android/src/main/res/layout/login.xml
new file mode 100644
index 0000000000..7ca6e173da
--- /dev/null
+++ b/android/src/main/res/layout/login.xml
@@ -0,0 +1,101 @@
+<LinearLayout
+        xmlns:android="http://schemas.android.com/apk/res/android"
+        android:id="@+id/main_fragment"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:orientation="vertical"
+        >
+    <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_weight="0"
+            android:orientation="horizontal"
+            android:gravity="center_vertical"
+            android:padding="12dp"
+            >
+        <ImageView
+                android:layout_width="49dp"
+                android:layout_height="50dp"
+                android:src="@drawable/logo_icon"
+                />
+        <TextView
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginHorizontal="8dp"
+                android:textColor="@color/white60"
+                android:textSize="24sp"
+                android:textStyle="bold"
+                android:text="@string/app_name"
+                android:textAllCaps="true"
+                />
+    </LinearLayout>
+    <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:orientation="vertical"
+            android:padding="24dp"
+            >
+        <Space
+                android:layout_width="match_parent"
+                android:layout_height="0dp"
+                android:layout_weight="1"
+                />
+        <TextView
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_weight="0"
+                android:layout_marginBottom="4dp"
+                android:gravity="start"
+                android:textColor="@color/white"
+                android:textSize="32sp"
+                android:textStyle="bold"
+                android:text="@string/login_title"
+                />
+        <TextView
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_weight="0"
+                android:layout_marginBottom="10dp"
+                android:gravity="start"
+                android:textColor="@color/white60"
+                android:textSize="13sp"
+                android:text="@string/login_description"
+                />
+        <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="48dp"
+                android:orientation="horizontal"
+                >
+            <EditText
+                    android:id="@+id/account_input"
+                    android:layout_width="match_parent"
+                    android:layout_height="match_parent"
+                    android:layout_weight="1"
+                    android:paddingHorizontal="12dp"
+                    android:background="@color/white"
+                    android:inputType="number"
+                    android:singleLine="true"
+                    android:imeOptions="flagNoPersonalizedLearning"
+                    android:textCursorDrawable="@drawable/text_input_cursor"
+                    android:hint="@string/login_hint"
+                    android:textColorHint="@color/blue40"
+                    android:textColor="@color/blue"
+                    android:textSize="20sp"
+                    android:textStyle="bold"
+                    />
+            <ImageButton android:id="@+id/login_button"
+                    android:layout_width="48dp"
+                    android:layout_height="match_parent"
+                    android:layout_weight="0"
+                    android:background="@drawable/login_button_background"
+                    android:src="@drawable/login_button_arrow"
+                    />
+        </LinearLayout>
+        <Space
+                android:layout_width="match_parent"
+                android:layout_height="0dp"
+                android:layout_weight="1"
+                />
+    </LinearLayout>
+</LinearLayout>
diff --git a/android/src/main/res/values/colors.xml b/android/src/main/res/values/colors.xml
index b0bf7bdb56..600e446ec3 100644
--- a/android/src/main/res/values/colors.xml
+++ b/android/src/main/res/values/colors.xml
@@ -1,4 +1,12 @@
 <resources>
     <color name="colorPrimary">#294D73</color>
     <color name="blue">#294D73</color>
+    <color name="blue40">#66294D73</color>
+    <color name="blue20">#33294D73</color>
+    <color name="darkBlue">#192E45</color>
+    <color name="white">#FFFFFF</color>
+    <color name="white60">#99FFFFFF</color>
+    <color name="green">#44AD4D</color>
+
+    <color name="textInputBorder">#234161</color>
 </resources>
diff --git a/android/src/main/res/values/strings.xml b/android/src/main/res/values/strings.xml
index e37acca63b..3988e5f2d5 100644
--- a/android/src/main/res/values/strings.xml
+++ b/android/src/main/res/values/strings.xml
@@ -1,3 +1,7 @@
 <resources>
     <string name="app_name">Mullvad VPN</string>
+
+    <string name="login_title">Login</string>
+    <string name="login_description">Enter your account number</string>
+    <string name="login_hint">0000 0000 0000 0000</string>
 </resources>