Merge branch 'main_ui_riseupvpn' into 'master'

new UI for RiseupVPN See merge request leap/bitmask_android!219
author: cyberta <cyberta@riseup.net> 2022-12-06 05:22:58 +0000
committer: cyberta <cyberta@riseup.net> 2022-12-06 05:22:58 +0000
commit: 64427ae7fa3b6ff14d484efd3dc513744a615945 (patch)
tree: 3ac508716ac0210603f32f80baf07881c80b3ab1 /app/src/main
parent: c0d1a28e5d737fbf24e13ade9fd6988a07ee2719 (diff)
parent: 4c6f49fe5ec695541be06322a1cf227e2d6d083d (diff)
83 files changed, 1565 insertions, 245 deletions
diff --git a/app/src/main/java/se/leap/bitmaskclient/base/MainActivity.java b/app/src/main/java/se/leap/bitmaskclient/base/MainActivity.java
index 28b981be..f56f2223 100644
--- a/app/src/main/java/se/leap/bitmaskclient/base/MainActivity.java
+++ b/app/src/main/java/se/leap/bitmaskclient/base/MainActivity.java
@@ -263,7 +263,7 @@ public class MainActivity extends AppCompatActivity implements EipSetupListener,
         }
 
         if (textColor == 0) {
-            actionBarTextColor = isBrightColor(color) ? R.color.actionbar_dark_color : R.color.actionbar_light_color;
+            actionBarTextColor = isBrightColor(color) ? R.color.actionbar_connectivity_state_text_color_dark : R.color.actionbar_connectivity_state_text_color_light;
         } else {
             actionBarTextColor = textColor;
         }
diff --git a/app/src/main/java/se/leap/bitmaskclient/base/fragments/EipFragment.java b/app/src/main/java/se/leap/bitmaskclient/base/fragments/EipFragment.java
new file mode 100644
index 00000000..a5ccb81d
--- /dev/null
+++ b/app/src/main/java/se/leap/bitmaskclient/base/fragments/EipFragment.java
@@ -0,0 +1,707 @@
+/**
+ * Copyright (c) 2018 LEAP Encryption Access Project and contributers
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+package se.leap.bitmaskclient.base.fragments;
+
+import static de.blinkt.openvpn.core.ConnectionStatus.LEVEL_NONETWORK;
+import static se.leap.bitmaskclient.R.string.vpn_certificate_user_message;
+import static se.leap.bitmaskclient.base.models.Constants.ASK_TO_CANCEL_VPN;
+import static se.leap.bitmaskclient.base.models.Constants.EIP_ACTION_START;
+import static se.leap.bitmaskclient.base.models.Constants.EIP_EARLY_ROUTES;
+import static se.leap.bitmaskclient.base.models.Constants.EIP_RESTART_ON_BOOT;
+import static se.leap.bitmaskclient.base.models.Constants.PROVIDER_KEY;
+import static se.leap.bitmaskclient.base.models.Constants.REQUEST_CODE_CONFIGURE_LEAP;
+import static se.leap.bitmaskclient.base.models.Constants.REQUEST_CODE_LOG_IN;
+import static se.leap.bitmaskclient.base.models.Constants.REQUEST_CODE_SWITCH_PROVIDER;
+import static se.leap.bitmaskclient.base.models.Constants.SHARED_PREFERENCES;
+import static se.leap.bitmaskclient.base.utils.ConfigHelper.isDefaultBitmask;
+import static se.leap.bitmaskclient.base.utils.PreferenceHelper.getPreferredCity;
+import static se.leap.bitmaskclient.eip.EipSetupObserver.reconnectingWithDifferentGateway;
+import static se.leap.bitmaskclient.eip.GatewaysManager.Load.UNKNOWN;
+import static se.leap.bitmaskclient.providersetup.ProviderAPI.DOWNLOAD_GEOIP_JSON;
+import static se.leap.bitmaskclient.providersetup.ProviderAPI.UPDATE_INVALID_VPN_CERTIFICATE;
+import static se.leap.bitmaskclient.providersetup.ProviderAPI.USER_MESSAGE;
+
+import android.app.Activity;
+import android.content.ComponentName;
+import android.content.Context;
+import android.content.Intent;
+import android.content.ServiceConnection;
+import android.content.SharedPreferences;
+import android.graphics.drawable.Animatable;
+import android.graphics.drawable.Animatable2;
+import android.graphics.drawable.Drawable;
+import android.os.Bundle;
+import android.os.IBinder;
+import android.text.Spannable;
+import android.text.SpannableString;
+import android.text.TextUtils;
+import android.text.style.RelativeSizeSpan;
+import android.util.Log;
+import android.view.LayoutInflater;
+import android.view.View;
+import android.view.ViewGroup;
+
+import androidx.annotation.ColorRes;
+import androidx.annotation.DrawableRes;
+import androidx.annotation.NonNull;
+import androidx.appcompat.app.AlertDialog;
+import androidx.appcompat.widget.AppCompatImageView;
+import androidx.appcompat.widget.AppCompatTextView;
+import androidx.core.content.ContextCompat;
+import androidx.fragment.app.DialogFragment;
+import androidx.fragment.app.Fragment;
+import androidx.fragment.app.FragmentTransaction;
+import androidx.vectordrawable.graphics.drawable.Animatable2Compat;
+import androidx.vectordrawable.graphics.drawable.Animatable2Compat.AnimationCallback;
+import androidx.vectordrawable.graphics.drawable.AnimatedVectorDrawableCompat;
+
+import java.util.Observable;
+import java.util.Observer;
+import java.util.concurrent.atomic.AtomicBoolean;
+
+import de.blinkt.openvpn.core.ConnectionStatus;
+import de.blinkt.openvpn.core.IOpenVPNServiceInternal;
+import de.blinkt.openvpn.core.OpenVPNService;
+import de.blinkt.openvpn.core.VpnStatus;
+import de.blinkt.openvpn.core.connection.Connection;
+import se.leap.bitmaskclient.R;
+import se.leap.bitmaskclient.base.FragmentManagerEnhanced;
+import se.leap.bitmaskclient.base.MainActivity;
+import se.leap.bitmaskclient.base.models.Provider;
+import se.leap.bitmaskclient.base.models.ProviderObservable;
+import se.leap.bitmaskclient.base.utils.PreferenceHelper;
+import se.leap.bitmaskclient.base.views.LocationButton;
+import se.leap.bitmaskclient.base.views.MainButton;
+import se.leap.bitmaskclient.databinding.FEipBinding;
+import se.leap.bitmaskclient.eip.EipCommand;
+import se.leap.bitmaskclient.eip.EipStatus;
+import se.leap.bitmaskclient.eip.GatewaysManager;
+import se.leap.bitmaskclient.providersetup.ProviderAPICommand;
+import se.leap.bitmaskclient.providersetup.ProviderListActivity;
+import se.leap.bitmaskclient.providersetup.activities.CustomProviderSetupActivity;
+import se.leap.bitmaskclient.providersetup.activities.LoginActivity;
+import se.leap.bitmaskclient.providersetup.models.LeapSRPSession;
+import se.leap.bitmaskclient.tor.TorServiceCommand;
+import se.leap.bitmaskclient.tor.TorStatusObservable;
+
+public class EipFragment extends Fragment implements Observer {
+
+    public final static String TAG = EipFragment.class.getSimpleName();
+
+
+    private SharedPreferences preferences;
+    private Provider provider;
+
+    AppCompatImageView background;
+    AppCompatImageView stateView;
+    MainButton mainButton;
+    LocationButton locationButton;
+    AppCompatTextView mainDescription;
+    AppCompatTextView subDescription;
+
+    private EipStatus.EipLevel previousEipLevel = EipStatus.EipLevel.UNKNOWN;
+    private EipStatus eipStatus;
+    private ProviderObservable providerObservable;
+    private TorStatusObservable torStatusObservable;
+
+    private @DrawableRes int pendingAnimationState;
+    private GatewaysManager gatewaysManager;
+
+    //---saved Instance -------
+    private final String KEY_SHOW_PENDING_START_CANCELLATION = "KEY_SHOW_PENDING_START_CANCELLATION";
+    private final String KEY_SHOW_ASK_TO_STOP_EIP = "KEY_SHOW_ASK_TO_STOP_EIP";
+    private boolean showPendingStartCancellation = false;
+    private boolean showAskToStopEip = false;
+    //------------------------
+    AlertDialog alertDialog;
+
+    private IOpenVPNServiceInternal mService;
+    // We use this service connection to detect if openvpn is running without network
+    private EipFragmentServiceConnection openVpnConnection;
+
+    @Override
+    public void onAttach(Context context) {
+        super.onAttach(context);
+        Bundle arguments = getArguments();
+        Activity activity = getActivity();
+        if (activity != null) {
+            if (arguments != null) {
+                provider = arguments.getParcelable(PROVIDER_KEY);
+                if (provider == null) {
+                    handleNoProvider(activity);
+                } else {
+                    Log.d(TAG, provider.getName() + " configured as provider");
+                }
+            } else {
+                handleNoProvider(activity);
+            }
+        }
+    }
+
+    private void handleNoProvider(Activity activity) {
+        if (isDefaultBitmask()) {
+            activity.startActivityForResult(new Intent(activity, ProviderListActivity.class), REQUEST_CODE_SWITCH_PROVIDER);
+        } else {
+            Log.e(TAG, "no provider given - try to reconfigure custom provider");
+            startActivityForResult(new Intent(activity, CustomProviderSetupActivity.class), REQUEST_CODE_CONFIGURE_LEAP);
+
+        }
+
+    }
+
+    @Override
+    public void onCreate(Bundle savedInstanceState) {
+        super.onCreate(savedInstanceState);
+        openVpnConnection = new EipFragmentServiceConnection();
+        eipStatus = EipStatus.getInstance();
+        providerObservable = ProviderObservable.getInstance();
+        torStatusObservable = TorStatusObservable.getInstance();
+        Activity activity = getActivity();
+        if (activity != null) {
+            preferences = getActivity().getSharedPreferences(SHARED_PREFERENCES, Context.MODE_PRIVATE);
+        } else {
+            Log.e(TAG, "activity is null in onCreate - no preferences set!");
+        }
+
+        gatewaysManager = new GatewaysManager(getContext());
+
+
+    }
+
+    @Override
+    public View onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
+        FEipBinding binding = FEipBinding.inflate(LayoutInflater.from(getContext()), container, false);
+        background = binding.background;
+        mainButton = binding.mainButton;
+        locationButton = binding.gatewayLocationButton;
+        locationButton.setTextColor(R.color.black800);
+        mainDescription = binding.mainDescription;
+        subDescription = binding.subDescription;
+        stateView = binding.stateView;
+
+        eipStatus.addObserver(this);
+        torStatusObservable.addObserver(this);
+        providerObservable.addObserver(this);
+
+        try {
+            Bundle arguments = getArguments();
+            if (arguments != null && arguments.containsKey(ASK_TO_CANCEL_VPN) && arguments.getBoolean(ASK_TO_CANCEL_VPN)) {
+                arguments.remove(ASK_TO_CANCEL_VPN);
+                setArguments(arguments);
+                askToStopEIP();
+            }
+        } catch (IllegalStateException e) {
+            // probably setArguments failed because the fragments state is already saved
+            e.printStackTrace();
+        }
+
+        restoreFromSavedInstance(savedInstanceState);
+        locationButton.setOnClickListener(v -> {
+                FragmentManagerEnhanced fragmentManager = new FragmentManagerEnhanced(getActivity().getSupportFragmentManager());
+                Fragment fragment = new GatewaySelectionFragment();
+                fragmentManager.replace(R.id.main_container, fragment, MainActivity.TAG);
+        });
+
+        mainButton.setOnClickListener(v -> {
+            handleIcon();
+        });
+        return binding.getRoot();
+    }
+
+    @Override
+    public void onStart() {
+        super.onStart();
+        if (DonationReminderDialog.isCallable(getContext())) {
+            showDonationReminderDialog();
+        }
+    }
+
+    @Override
+    public void onResume() {
+        super.onResume();
+        if (!eipStatus.isDisconnected()) {
+            openVpnConnection.bindService();
+        }
+        handleNewState();
+    }
+
+    @Override
+    public void onPause() {
+        super.onPause();
+        openVpnConnection.unbindService();
+    }
+
+    @Override
+    public void onSaveInstanceState(@NonNull Bundle outState) {
+        super.onSaveInstanceState(outState);
+        if (showAskToStopEip) {
+            outState.putBoolean(KEY_SHOW_ASK_TO_STOP_EIP, true);
+            alertDialog.dismiss();
+        } else if (showPendingStartCancellation) {
+            outState.putBoolean(KEY_SHOW_PENDING_START_CANCELLATION, true);
+            alertDialog.dismiss();
+        }
+    }
+
+    private void restoreFromSavedInstance(Bundle savedInstanceState) {
+        if (savedInstanceState != null && savedInstanceState.containsKey(KEY_SHOW_PENDING_START_CANCELLATION)) {
+            showPendingStartCancellation = true;
+            askPendingStartCancellation();
+        } else if (savedInstanceState != null && savedInstanceState.containsKey(KEY_SHOW_ASK_TO_STOP_EIP)) {
+            showAskToStopEip = true;
+            askToStopEIP();
+        }
+    }
+
+    @Override
+    public void onDestroyView() {
+        super.onDestroyView();
+        Activity activity = getActivity();
+        if (activity != null) {
+            ((MainActivity) activity).setDefaultActivityBarColor();
+        }
+        eipStatus.deleteObserver(this);
+        providerObservable.deleteObserver(this);
+        torStatusObservable.deleteObserver(this);
+        background = null;
+        mainButton = null;
+        locationButton = null;
+        mainDescription = null;
+        subDescription = null;
+        stateView = null;
+    }
+
+    private void saveStatus(boolean restartOnBoot) {
+        preferences.edit().putBoolean(EIP_RESTART_ON_BOOT, restartOnBoot).apply();
+    }
+
+    void handleIcon() {
+        if (isOpenVpnRunningWithoutNetwork() || eipStatus.isConnected() || eipStatus.isConnecting() || eipStatus.isUpdatingVpnCert())
+            handleSwitchOff();
+        else
+            handleSwitchOn();
+    }
+
+    private void handleSwitchOn() {
+        Context context = getContext();
+        if (context == null) {
+            Log.e(TAG, "context is null when switch turning on");
+            return;
+        }
+
+        if (canStartEIP()) {
+            startEipFromScratch();
+        } else if (canLogInToStartEIP()) {
+            askUserToLogIn(getString(vpn_certificate_user_message));
+        } else {
+            // provider has no VpnCertificate but user is logged in
+            updateInvalidVpnCertificate();
+        }
+    }
+
+    private boolean canStartEIP() {
+        boolean certificateExists = provider.hasVpnCertificate();
+        boolean isAllowedAnon = provider.allowsAnonymous();
+        return (isAllowedAnon || certificateExists) && !eipStatus.isConnected() && !eipStatus.isConnecting();
+    }
+
+    private boolean canLogInToStartEIP() {
+        boolean isAllowedRegistered = provider.allowsRegistered();
+        boolean isLoggedIn = LeapSRPSession.loggedIn();
+        return isAllowedRegistered && !isLoggedIn && !eipStatus.isConnecting() && !eipStatus.isConnected();
+    }
+
+    private void handleSwitchOff() {
+        if (isOpenVpnRunningWithoutNetwork() || eipStatus.isConnecting() || eipStatus.isUpdatingVpnCert()) {
+            askPendingStartCancellation();
+        } else if (eipStatus.isConnected()) {
+            askToStopEIP();
+        }
+    }
+
+    private void setMainButtonEnabled(boolean enabled) {
+        locationButton.setEnabled(enabled);
+        mainButton.setEnabled(enabled);
+    }
+
+    public void startEipFromScratch() {
+        saveStatus(true);
+        Context context = getContext();
+        if (context == null) {
+            Log.e(TAG, "context is null when trying to start VPN");
+            return;
+        }
+        if (!provider.getGeoipUrl().isDefault() && provider.shouldUpdateGeoIpJson()) {
+            Bundle bundle = new Bundle();
+            bundle.putBoolean(EIP_ACTION_START, true);
+            bundle.putBoolean(EIP_EARLY_ROUTES, false);
+            ProviderAPICommand.execute(context, DOWNLOAD_GEOIP_JSON, bundle, provider);
+        } else {
+            EipCommand.startVPN(context, false);
+        }
+        EipStatus.getInstance().updateState("UI_CONNECTING", "", 0, ConnectionStatus.LEVEL_START);
+    }
+
+    protected void stopEipIfPossible() {
+        Context context = getContext();
+        if (context == null) {
+            Log.e(TAG, "context is null when trying to stop EIP");
+            return;
+        }
+        EipCommand.stopVPN(context);
+    }
+
+    private void askPendingStartCancellation() {
+        Activity activity = getActivity();
+        if (activity == null) {
+            Log.e(TAG, "activity is null when asking to cancel");
+            return;
+        }
+
+        try {
+            AlertDialog.Builder alertBuilder = new AlertDialog.Builder(getActivity());
+            showPendingStartCancellation = true;
+            alertDialog = alertBuilder.setTitle(activity.getString(R.string.eip_cancel_connect_title))
+                    .setMessage(activity.getString(R.string.eip_cancel_connect_text))
+                    .setPositiveButton((android.R.string.yes), (dialog, which) -> {
+                        Context context = getContext();
+                        if (context != null && eipStatus.isUpdatingVpnCert() &&
+                                TorStatusObservable.isRunning()) {
+                            TorServiceCommand.stopTorServiceAsync(context.getApplicationContext());
+                        }
+                        stopEipIfPossible();
+                    })
+                    .setNegativeButton(activity.getString(android.R.string.no), (dialog, which) -> {
+                    }).setOnDismissListener(dialog -> showPendingStartCancellation = false).show();
+        } catch (IllegalStateException e) {
+            e.printStackTrace();
+        }
+
+    }
+
+    protected void askToStopEIP() {
+        Activity activity = getActivity();
+        if (activity == null) {
+            Log.e(TAG, "activity is null when asking to stop EIP");
+            return;
+        }
+        try {
+            AlertDialog.Builder alertBuilder = new AlertDialog.Builder(activity);
+            showAskToStopEip = true;
+            alertDialog = alertBuilder.setTitle(activity.getString(R.string.eip_cancel_connect_title))
+                    .setMessage(activity.getString(R.string.eip_warning_browser_inconsistency))
+                    .setPositiveButton((android.R.string.yes), (dialog, which) -> stopEipIfPossible())
+                    .setNegativeButton(activity.getString(android.R.string.no), (dialog, which) -> {
+                    }).setOnDismissListener(dialog -> showAskToStopEip = false).show();
+        } catch (IllegalStateException e) {
+            e.printStackTrace();
+        }
+
+    }
+
+    @Override
+    public void update(Observable observable, Object data) {
+        if (observable instanceof EipStatus) {
+            previousEipLevel = eipStatus.getEipLevel();
+            eipStatus = (EipStatus) observable;
+            handleNewStateOnMain();
+
+            if (eipStatus.isConnecting()) {
+                openVpnConnection.bindService();
+            }
+            if ("NOPROCESS".equals(EipStatus.getInstance().getState())) {
+                //assure that the Service is shutdown completely if openvpn was stopped
+                openVpnConnection.unbindService();
+            }
+        } else if (observable instanceof ProviderObservable) {
+            provider = ((ProviderObservable) observable).getCurrentProvider();
+        } else if (observable instanceof TorStatusObservable && EipStatus.getInstance().isUpdatingVpnCert()) {
+            handleNewStateOnMain();
+        }
+    }
+
+    private void handleNewStateOnMain() {
+        Activity activity = getActivity();
+        if (activity != null) {
+            activity.runOnUiThread(this::handleNewState);
+        } else {
+            Log.e("EipFragment", "activity is null");
+        }
+    }
+
+    private void setActivityBarColor(@ColorRes int primaryColor, @ColorRes int secondaryColor) {
+        Activity activity = getActivity();
+        if (activity == null) {
+            return;
+        }
+        ((MainActivity) getActivity()).setActivityBarColor(primaryColor, secondaryColor, R.color.actionbar_connectivity_state_text_color_dark);
+    }
+
+    private void handleNewState() {
+        Activity activity = getActivity();
+        if (activity == null) {
+            Log.e(TAG, "activity is null while trying to handle new state");
+            return;
+        }
+
+        Log.d(TAG, "eip fragment eipStatus state: " + eipStatus.getState() + " - level: " + eipStatus.getLevel() + " - is reconnecting: " + eipStatus.isReconnecting());
+        if (eipStatus.isUpdatingVpnCert()) {
+            setMainButtonEnabled(true);
+            String city = getPreferredCity(getContext());
+            String locationName = VpnStatus.getCurrentlyConnectingVpnName() != null ?
+                    VpnStatus.getCurrentlyConnectingVpnName() :
+                    city == null ? getString(R.string.gateway_selection_recommended_location) : city;
+            locationButton.setText(locationName);
+            locationButton.setLocationLoad(UNKNOWN);
+            locationButton.showBridgeIndicator(false);
+            locationButton.showRecommendedIndicator(false);
+            mainDescription.setText(R.string.eip_status_connecting);
+            String torStatus = TorStatusObservable.getStringForCurrentStatus(getContext());
+            if (!TextUtils.isEmpty(torStatus)) {
+                Spannable spannable = new SpannableString(torStatus);
+                spannable.setSpan(new RelativeSizeSpan(0.75f), 0, spannable.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
+                subDescription.setText(TextUtils.concat(getString(R.string.updating_certificate_message) + "\n", spannable));
+            } else {
+                subDescription.setText(getString(R.string.updating_certificate_message));
+            }
+            background.setImageResource(R.drawable.bg_connecting);
+            animateState(R.drawable.state_connecting);
+            mainButton.updateState(false, true, false);
+            setActivityBarColor(R.color.bg_connecting_top, R.color.bg_connecting_top_light_transparent);
+        } else if (eipStatus.isConnecting()) {
+            setMainButtonEnabled(true);
+            String city = getPreferredCity(getContext());
+            String locationName = VpnStatus.getCurrentlyConnectingVpnName() != null ?
+                    VpnStatus.getCurrentlyConnectingVpnName() :
+                    city == null ? getString(R.string.gateway_selection_recommended_location) : city;
+            locationButton.setText(locationName);
+            locationButton.setLocationLoad(UNKNOWN);
+            locationButton.showBridgeIndicator(false);
+            locationButton.showRecommendedIndicator(false);
+            mainDescription.setText(R.string.eip_status_connecting);
+            subDescription.setText(null);
+            background.setImageResource(R.drawable.bg_connecting);
+            animateState(R.drawable.state_connecting);
+            mainButton.updateState(false, true, false);
+            setActivityBarColor(R.color.bg_connecting_top, R.color.bg_connecting_top_light_transparent);
+        } else if (eipStatus.isConnected()) {
+            setMainButtonEnabled(true);
+            mainButton.updateState(true, false, false);
+            Connection.TransportType transportType = PreferenceHelper.getUseBridges(getContext()) ? Connection.TransportType.OBFS4 : Connection.TransportType.OPENVPN;
+            locationButton.setLocationLoad(PreferenceHelper.useObfuscationPinning(getContext()) ? GatewaysManager.Load.UNKNOWN : gatewaysManager.getLoadForLocation(VpnStatus.getLastConnectedVpnName(), transportType));
+            locationButton.setText(VpnStatus.getLastConnectedVpnName());
+            locationButton.showBridgeIndicator(VpnStatus.isUsingBridges());
+            locationButton.showRecommendedIndicator(getPreferredCity(getContext()) == null);
+            mainDescription.setText(R.string.eip_status_secured);
+            subDescription.setText(null);
+            background.setImageResource(R.drawable.bg_connected);
+            animateState(R.drawable.state_connected);
+            setActivityBarColor(R.color.bg_running_top, R.color.bg_running_top_light_transparent);
+        } else if(isOpenVpnRunningWithoutNetwork()) {
+            Log.d(TAG, "eip fragment eipStatus - isOpenVpnRunningWithoutNetwork");
+            setMainButtonEnabled(true);
+            mainButton.updateState(true, false, true);
+            locationButton.setText(VpnStatus.getCurrentlyConnectingVpnName());
+            locationButton.showBridgeIndicator(VpnStatus.isUsingBridges());
+            locationButton.showBridgeIndicator(VpnStatus.isUsingBridges());
+            locationButton.showRecommendedIndicator(getPreferredCity(getContext())== null);
+            mainDescription.setText(R.string.eip_state_connected);
+            subDescription.setText(R.string.eip_state_no_network);
+            background.setImageResource(R.drawable.bg_connecting);
+            animateState(R.drawable.state_connecting);
+            setActivityBarColor(R.color.bg_connecting_top, R.color.bg_connecting_top_light_transparent);
+        } else if (eipStatus.isDisconnected() && reconnectingWithDifferentGateway()) {
+            locationButton.setText(VpnStatus.getCurrentlyConnectingVpnName());
+            locationButton.setLocationLoad(UNKNOWN);
+            locationButton.showBridgeIndicator(false);
+            locationButton.showRecommendedIndicator(false);
+            mainDescription.setText(R.string.eip_status_connecting);
+            subDescription.setText(R.string.reconnecting);
+            background.setImageResource(R.drawable.bg_connecting);
+            animateState(R.drawable.state_connecting);
+            setActivityBarColor(R.color.bg_connecting_top, R.color.bg_connecting_top_light_transparent);
+        } else if (eipStatus.isDisconnecting()) {
+            setMainButtonEnabled(false);
+            mainButton.updateState(false, false, false);
+            mainDescription.setText(R.string.eip_status_unsecured);
+            background.setImageResource(R.drawable.bg_disconnected);
+            if (previousEipLevel == EipStatus.EipLevel.CONNECTED) {
+                animateState(R.drawable.state_transition_connected_disconnected);
+            } else {
+                animateState(R.drawable.state_disconnected);
+            }
+            setActivityBarColor(R.color.bg_disconnected_top, R.color.bg_disconnected_top_light_transparent);
+        } else if (eipStatus.isBlocking()) {
+            setMainButtonEnabled(true);
+            mainButton.updateState(true, false, true);
+            locationButton.setText(R.string.no_location);
+            locationButton.setLocationLoad(UNKNOWN);
+            locationButton.showBridgeIndicator(false);
+            locationButton.showRecommendedIndicator(false);
+            mainDescription.setText(R.string.eip_state_connected);
+            subDescription.setText(getString(R.string.eip_state_blocking, getString(R.string.app_name)));
+            background.setImageResource(R.drawable.bg_disconnected);
+            animateState(R.drawable.state_disconnected);
+            setActivityBarColor(R.color.bg_disconnected_top, R.color.bg_disconnected_top_light_transparent);
+        } else {
+            locationButton.setText(R.string.vpn_button_turn_on);
+            setMainButtonEnabled(true);
+            mainButton.updateState(false, false, false);
+            locationButton.setLocationLoad(UNKNOWN);
+            locationButton.showBridgeIndicator(false);
+            String city = getPreferredCity(getContext());
+            locationButton.setText(city == null ? getString(R.string.gateway_selection_recommended_location) : city);
+            locationButton.showRecommendedIndicator(false);
+            mainDescription.setText(R.string.eip_status_unsecured);
+            subDescription.setText(null);
+            background.setImageResource(R.drawable.bg_disconnected);
+
+            animateState(R.drawable.state_disconnected);
+            setActivityBarColor(R.color.bg_disconnected_top, R.color.bg_disconnected_top_light_transparent);
+        }
+    }
+
+    private void animateState(@DrawableRes int drawableRes) {
+        @DrawableRes int lastDrawableId;
+        try {
+            lastDrawableId = (int) stateView.getTag();
+            if (lastDrawableId == drawableRes) {
+                return;
+            }
+
+            Drawable lastDrawable = ContextCompat.getDrawable(getContext(), lastDrawableId);
+            if (lastDrawable instanceof  Animatable && ((Animatable) lastDrawable).isRunning()) {
+                pendingAnimationState = drawableRes;
+            }
+
+        } catch (NullPointerException | ClassCastException e) {
+            // eat me
+        }
+
+
+        stateView.setImageResource(drawableRes);
+        stateView.setTag(drawableRes);
+        if (stateView.getDrawable() instanceof Animatable) {
+            Animatable animatedDrawable = (Animatable) stateView.getDrawable();
+            AnimatedVectorDrawableCompat.registerAnimationCallback(stateView.getDrawable(), new AnimationCallback() {
+                @Override
+                public void onAnimationEnd(Drawable drawable) {
+                    super.onAnimationEnd(drawable);
+                    if (pendingAnimationState != 0) {
+                        int newAnimationRes = pendingAnimationState;
+                        pendingAnimationState = 0;
+                        animateState(newAnimationRes);
+                    } else if (drawable instanceof Animatable){
+                        ((Animatable) drawable).start();
+                    }
+                }
+            });
+            animatedDrawable.start();
+        }
+    }
+
+    private boolean isOpenVpnRunningWithoutNetwork() {
+        boolean isRunning = false;
+        try {
+            isRunning = eipStatus.getLevel() == LEVEL_NONETWORK &&
+                    mService.isVpnRunning();
+        } catch (Exception e) {
+            //eat me
+            e.printStackTrace();
+        }
+
+        return isRunning;
+    }
+
+    private void updateInvalidVpnCertificate() {
+        eipStatus.setUpdatingVpnCert(true);
+        ProviderAPICommand.execute(getContext(), UPDATE_INVALID_VPN_CERTIFICATE, provider);
+    }
+
+    private void askUserToLogIn(String userMessage) {
+        Intent intent = new Intent(getContext(), LoginActivity.class);
+        intent.putExtra(PROVIDER_KEY, provider);
+
+        if(userMessage != null) {
+            intent.putExtra(USER_MESSAGE, userMessage);
+        }
+
+        Activity activity = getActivity();
+        if (activity != null) {
+            activity.startActivityForResult(intent, REQUEST_CODE_LOG_IN);
+        }
+    }
+
+    private class EipFragmentServiceConnection implements ServiceConnection {
+        private final AtomicBoolean bind = new AtomicBoolean(false);
+
+        void bindService() {
+            Activity activity = getActivity();
+            if (activity == null) {
+                Log.e(TAG, "activity is null when binding OpenVpn");
+                return;
+            }
+            if (!bind.get()) {
+                activity.runOnUiThread(() -> {
+                        Intent intent = new Intent(activity, OpenVPNService.class);
+                        intent.setAction(OpenVPNService.START_SERVICE);
+
+                        activity.bindService(intent, EipFragmentServiceConnection.this, Context.BIND_AUTO_CREATE);
+                        bind.set(true);
+                });
+            }
+        }
+
+        void unbindService() {
+            Activity activity = getActivity();
+            if (activity == null) {
+                return;
+            }
+            if (bind.get()) {
+                activity.runOnUiThread(() -> {
+                    activity.unbindService(EipFragmentServiceConnection.this);
+                    bind.set(false);
+                });
+            }
+        }
+
+        @Override
+        public void onServiceConnected(ComponentName className,
+                                       IBinder service) {
+            mService = IOpenVPNServiceInternal.Stub.asInterface(service);
+            handleNewState();
+        }
+
+        @Override
+        public void onServiceDisconnected(ComponentName arg0) {
+            mService = null;
+        }
+    }
+
+    public void showDonationReminderDialog() {
+        try {
+            FragmentTransaction fragmentTransaction = new FragmentManagerEnhanced(
+                    getActivity().getSupportFragmentManager()).removePreviousFragment(
+                    DonationReminderDialog.TAG);
+            DialogFragment newFragment = new DonationReminderDialog();
+            newFragment.setCancelable(false);
+            newFragment.show(fragmentTransaction, DonationReminderDialog.TAG);
+        } catch (IllegalStateException | NullPointerException e) {
+            e.printStackTrace();
+        }
+    }
+}
diff --git a/app/src/main/java/se/leap/bitmaskclient/base/views/LocationButton.java b/app/src/main/java/se/leap/bitmaskclient/base/views/LocationButton.java
index 7ad044bd..ae77d60e 100644
--- a/app/src/main/java/se/leap/bitmaskclient/base/views/LocationButton.java
+++ b/app/src/main/java/se/leap/bitmaskclient/base/views/LocationButton.java
@@ -8,6 +8,7 @@ import android.widget.RelativeLayout;
 import androidx.annotation.ColorRes;
 import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
+import androidx.annotation.StringRes;
 import androidx.appcompat.widget.AppCompatImageView;
 import androidx.appcompat.widget.AppCompatTextView;
 import androidx.core.content.ContextCompat;
@@ -52,6 +53,10 @@ public class LocationButton extends RelativeLayout {
         textView.setText(text);
     }
 
+    public void setText(@StringRes int resId) {
+        textView.setText(resId);
+    }
+
     public void showBridgeIndicator(boolean show) {
         bridgeView.setVisibility(show ? VISIBLE : GONE);
     }
diff --git a/app/src/main/java/se/leap/bitmaskclient/base/views/MainButton.java b/app/src/main/java/se/leap/bitmaskclient/base/views/MainButton.java
new file mode 100644
index 00000000..715063b5
--- /dev/null
+++ b/app/src/main/java/se/leap/bitmaskclient/base/views/MainButton.java
@@ -0,0 +1,57 @@
+package se.leap.bitmaskclient.base.views;
+
+import android.annotation.TargetApi;
+import android.content.Context;
+import android.util.AttributeSet;
+import android.view.LayoutInflater;
+import android.widget.RelativeLayout;
+
+import androidx.appcompat.widget.AppCompatImageView;
+import androidx.core.content.ContextCompat;
+
+import se.leap.bitmaskclient.R;
+import se.leap.bitmaskclient.databinding.VMainButtonBinding;
+
+public class MainButton extends RelativeLayout {
+
+    private static final String TAG = MainButton.class.getSimpleName();
+
+    AppCompatImageView button;
+
+    public MainButton(Context context) {
+        super(context);
+        initLayout(context);
+    }
+
+    public MainButton(Context context, AttributeSet attrs) {
+        super(context, attrs);
+        initLayout(context);
+    }
+
+    public MainButton(Context context, AttributeSet attrs, int defStyleAttr) {
+        super(context, attrs, defStyleAttr);
+        initLayout(context);
+    }
+
+
+    @TargetApi(21)
+    public MainButton(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
+        super(context, attrs, defStyleAttr, defStyleRes);
+        initLayout(context);
+    }
+
+    private void initLayout(Context context) {
+        VMainButtonBinding binding = VMainButtonBinding.inflate(LayoutInflater.from(context), this, true);
+        button = binding.button;
+    }
+
+    public void updateState(boolean isOn, boolean isProcessing, boolean isError) {
+        if (isProcessing) {
+            button.setImageDrawable(ContextCompat.getDrawable(getContext(), R.drawable.button_circle_cancel));
+        } else {
+            button.setImageDrawable(
+                    ContextCompat.getDrawable(getContext(),
+                    isOn ? R.drawable.button_circle_stop : R.drawable.button_circle_start));
+        }
+    }
+}
diff --git a/app/src/main/java/se/leap/bitmaskclient/eip/EipStatus.java b/app/src/main/java/se/leap/bitmaskclient/eip/EipStatus.java
index 003e396f..c9cf6041 100644
--- a/app/src/main/java/se/leap/bitmaskclient/eip/EipStatus.java
+++ b/app/src/main/java/se/leap/bitmaskclient/eip/EipStatus.java
@@ -129,8 +129,7 @@ public class EipStatus extends Observable implements VpnStatus.StateListener {
         }
     }
 
-    @VisibleForTesting
-    EipLevel getEipLevel() {
+    public EipLevel getEipLevel() {
         return currentEipLevel;
     }
 
diff --git a/app/src/main/res/color/main_button_state_color.xml b/app/src/main/res/color/main_button_state_color.xml
deleted file mode 100644
index 9650b033..00000000
--- a/app/src/main/res/color/main_button_state_color.xml
+++ /dev/null
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:color="@color/colorPrimaryDark" android:state_pressed="true"/>
-    <item android:color="@color/colorPrimary"/>
-</selector>
-\ No newline at end of file
diff --git a/app/src/main/res/drawable-anydpi-v24/ic_btn_cancel.xml b/app/src/main/res/drawable-anydpi-v24/ic_btn_cancel.xml
new file mode 100644
index 00000000..9870cd4f
--- /dev/null
+++ b/app/src/main/res/drawable-anydpi-v24/ic_btn_cancel.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"
+    android:viewportWidth="35"
+    android:viewportHeight="35"
+    android:width="35dp"
+    android:height="35dp">
+    <path
+        android:pathData="M4.9 35L17.5 22.4L30.1 35L35 30.1L22.4 17.5L35 4.9L30.1 0L17.5 12.6L4.9 0L0 4.9L12.6 17.5L0 30.1L4.9 35Z"
+        android:fillColor="#FFFFFF" />
+</vector>
+\ No newline at end of file
diff --git a/app/src/main/res/drawable-anydpi-v24/ic_btn_on.xml b/app/src/main/res/drawable-anydpi-v24/ic_btn_on.xml
new file mode 100644
index 00000000..0f3fc0f4
--- /dev/null
+++ b/app/src/main/res/drawable-anydpi-v24/ic_btn_on.xml
@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:viewportWidth="40"
+    android:viewportHeight="43"
+    android:width="40dp"
+    android:height="43dp">
+    <path
+        android:pathData="M33.0178 7.38594C32.1199 6.61398 30.7913 6.74461 29.9562 7.58411C28.8438 8.70244 29.0811 10.5681 30.2333 11.6454C33.1633 14.3851 35 18.2798 35 22.6203C35 26.6198 33.4196 30.4556 30.6066 33.2836C27.7936 36.1117 23.9782 37.7005 20 37.7005C16.0218 37.7005 12.2064 36.1117 9.3934 33.2836C6.58035 30.4556 5 26.6198 5 22.6203C5 18.2699 6.84513 14.3673 9.77413 11.6139C10.9153 10.5411 11.1444 8.69064 10.0399 7.58018C9.20708 6.74295 7.88204 6.6127 6.98641 7.38232C2.70788 11.0589 0 16.5193 0 22.6203C0 27.953 2.10714 33.0673 5.85786 36.8381C9.60859 40.6089 14.6957 42.7273 20 42.7273C25.3043 42.7273 30.3914 40.6089 34.1421 36.8381C37.8929 33.0673 40 27.953 40 22.6203C40 16.5213 37.2939 11.0625 33.0178 7.38594ZM22.5 0C19.7386 0 17.5 2.23858 17.5 5V20.1337C17.5 22.8951 19.7386 25.1337 22.5 25.1337"
+        android:fillColor="#FFFFFF" />
+</vector>
+\ No newline at end of file
diff --git a/app/src/main/res/drawable-hdpi/bg_connected.png b/app/src/main/res/drawable-hdpi/bg_connected.png
deleted file mode 100644
index 0e98f705..00000000
--- a/app/src/main/res/drawable-hdpi/bg_connected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/bg_connecting.png b/app/src/main/res/drawable-hdpi/bg_connecting.png
deleted file mode 100644
index 24632712..00000000
--- a/app/src/main/res/drawable-hdpi/bg_connecting.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/bg_disconnected.png b/app/src/main/res/drawable-hdpi/bg_disconnected.png
deleted file mode 100644
index de96be57..00000000
--- a/app/src/main/res/drawable-hdpi/bg_disconnected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/green_mask.png b/app/src/main/res/drawable-hdpi/green_mask.png
deleted file mode 100644
index fccc060a..00000000
--- a/app/src/main/res/drawable-hdpi/green_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/ic_btn_cancel.png b/app/src/main/res/drawable-hdpi/ic_btn_cancel.png
deleted file mode 100644
index 00feedcd..00000000
--- a/app/src/main/res/drawable-hdpi/ic_btn_cancel.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/ic_btn_on.png b/app/src/main/res/drawable-hdpi/ic_btn_on.png
deleted file mode 100644
index 2b37d25e..00000000
--- a/app/src/main/res/drawable-hdpi/ic_btn_on.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/red_mask.png b/app/src/main/res/drawable-hdpi/red_mask.png
deleted file mode 100644
index d2ef7d99..00000000
--- a/app/src/main/res/drawable-hdpi/red_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-hdpi/yellow_mask.png b/app/src/main/res/drawable-hdpi/yellow_mask.png
deleted file mode 100644
index 72e3ae45..00000000
--- a/app/src/main/res/drawable-hdpi/yellow_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/bg_connected.png b/app/src/main/res/drawable-xhdpi/bg_connected.png
deleted file mode 100644
index 915dff95..00000000
--- a/app/src/main/res/drawable-xhdpi/bg_connected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/bg_connecting.png b/app/src/main/res/drawable-xhdpi/bg_connecting.png
deleted file mode 100644
index be4469df..00000000
--- a/app/src/main/res/drawable-xhdpi/bg_connecting.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/bg_disconnected.png b/app/src/main/res/drawable-xhdpi/bg_disconnected.png
deleted file mode 100644
index 433c776f..00000000
--- a/app/src/main/res/drawable-xhdpi/bg_disconnected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/green_mask.png b/app/src/main/res/drawable-xhdpi/green_mask.png
deleted file mode 100644
index c852459d..00000000
--- a/app/src/main/res/drawable-xhdpi/green_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/ic_btn_cancel.png b/app/src/main/res/drawable-xhdpi/ic_btn_cancel.png
deleted file mode 100644
index d623f8f5..00000000
--- a/app/src/main/res/drawable-xhdpi/ic_btn_cancel.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/ic_btn_on.png b/app/src/main/res/drawable-xhdpi/ic_btn_on.png
deleted file mode 100644
index 4fdc9464..00000000
--- a/app/src/main/res/drawable-xhdpi/ic_btn_on.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/red_mask.png b/app/src/main/res/drawable-xhdpi/red_mask.png
deleted file mode 100644
index c0d57a03..00000000
--- a/app/src/main/res/drawable-xhdpi/red_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xhdpi/yellow_mask.png b/app/src/main/res/drawable-xhdpi/yellow_mask.png
deleted file mode 100644
index d81190fe..00000000
--- a/app/src/main/res/drawable-xhdpi/yellow_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/bg_connected.png b/app/src/main/res/drawable-xxhdpi/bg_connected.png
deleted file mode 100644
index cd78d865..00000000
--- a/app/src/main/res/drawable-xxhdpi/bg_connected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/bg_connecting.png b/app/src/main/res/drawable-xxhdpi/bg_connecting.png
deleted file mode 100644
index 718e102f..00000000
--- a/app/src/main/res/drawable-xxhdpi/bg_connecting.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/bg_disconnected.png b/app/src/main/res/drawable-xxhdpi/bg_disconnected.png
deleted file mode 100644
index ffbcdb79..00000000
--- a/app/src/main/res/drawable-xxhdpi/bg_disconnected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/bg_switchbar.xml b/app/src/main/res/drawable-xxhdpi/bg_switchbar.xml
deleted file mode 100644
index 7af57ad3..00000000
--- a/app/src/main/res/drawable-xxhdpi/bg_switchbar.xml
+++ /dev/null
@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!--
-  ~ Copyright (c) 2012-2016 Arne Schwabe
-  ~ Distributed under the GNU GPL v2 with additional terms. For full terms see the file doc/LICENSE.txt
-  -->
-
-<shape xmlns:android="http://schemas.android.com/apk/res/android">
-    <solid android:color="@color/switchbar" />
-</shape>
-\ No newline at end of file
diff --git a/app/src/main/res/drawable-xxhdpi/green_mask.png b/app/src/main/res/drawable-xxhdpi/green_mask.png
deleted file mode 100644
index 32286177..00000000
--- a/app/src/main/res/drawable-xxhdpi/green_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/ic_btn_cancel.png b/app/src/main/res/drawable-xxhdpi/ic_btn_cancel.png
deleted file mode 100644
index af604d9b..00000000
--- a/app/src/main/res/drawable-xxhdpi/ic_btn_cancel.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/ic_btn_on.png b/app/src/main/res/drawable-xxhdpi/ic_btn_on.png
deleted file mode 100644
index d6cfc10b..00000000
--- a/app/src/main/res/drawable-xxhdpi/ic_btn_on.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/red_mask.png b/app/src/main/res/drawable-xxhdpi/red_mask.png
deleted file mode 100644
index ac560317..00000000
--- a/app/src/main/res/drawable-xxhdpi/red_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxhdpi/yellow_mask.png b/app/src/main/res/drawable-xxhdpi/yellow_mask.png
deleted file mode 100644
index 75cf3782..00000000
--- a/app/src/main/res/drawable-xxhdpi/yellow_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/bg_connected.png b/app/src/main/res/drawable-xxxhdpi/bg_connected.png
deleted file mode 100644
index 3c9d97b4..00000000
--- a/app/src/main/res/drawable-xxxhdpi/bg_connected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/bg_connecting.png b/app/src/main/res/drawable-xxxhdpi/bg_connecting.png
deleted file mode 100644
index bff2004c..00000000
--- a/app/src/main/res/drawable-xxxhdpi/bg_connecting.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/bg_disconnected.png b/app/src/main/res/drawable-xxxhdpi/bg_disconnected.png
deleted file mode 100644
index 2503f135..00000000
--- a/app/src/main/res/drawable-xxxhdpi/bg_disconnected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/green_mask.png b/app/src/main/res/drawable-xxxhdpi/green_mask.png
deleted file mode 100644
index f5a5adaf..00000000
--- a/app/src/main/res/drawable-xxxhdpi/green_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/ic_btn_cancel.png b/app/src/main/res/drawable-xxxhdpi/ic_btn_cancel.png
deleted file mode 100644
index 6c17bd78..00000000
--- a/app/src/main/res/drawable-xxxhdpi/ic_btn_cancel.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/ic_btn_on.png b/app/src/main/res/drawable-xxxhdpi/ic_btn_on.png
deleted file mode 100644
index b0e54b8c..00000000
--- a/app/src/main/res/drawable-xxxhdpi/ic_btn_on.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/red_mask.png b/app/src/main/res/drawable-xxxhdpi/red_mask.png
deleted file mode 100644
index 9e216955..00000000
--- a/app/src/main/res/drawable-xxxhdpi/red_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable-xxxhdpi/yellow_mask.png b/app/src/main/res/drawable-xxxhdpi/yellow_mask.png
deleted file mode 100644
index 806dcbf4..00000000
--- a/app/src/main/res/drawable-xxxhdpi/yellow_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/bg_connected.png b/app/src/main/res/drawable/bg_connected.png
deleted file mode 100644
index 6da7878d..00000000
--- a/app/src/main/res/drawable/bg_connected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/bg_connecting.png b/app/src/main/res/drawable/bg_connecting.png
deleted file mode 100644
index c371f3f0..00000000
--- a/app/src/main/res/drawable/bg_connecting.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/bg_disconnected.png b/app/src/main/res/drawable/bg_disconnected.png
deleted file mode 100644
index de96be57..00000000
--- a/app/src/main/res/drawable/bg_disconnected.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/button_circle_cancel_pressed.xml b/app/src/main/res/drawable/button_circle_cancel_pressed.xml
index 690baa0c..b2efa78b 100644
--- a/app/src/main/res/drawable/button_circle_cancel_pressed.xml
+++ b/app/src/main/res/drawable/button_circle_cancel_pressed.xml
@@ -55,10 +55,6 @@
         android:bottom="62dp"
         android:left="50dp"
         android:right="50dp"
-        >
-        <bitmap android:src="@drawable/ic_btn_cancel"
-            />
-    </item>
-
+        android:drawable="@drawable/ic_btn_cancel" />
 
 </layer-list>
 \ No newline at end of file
diff --git a/app/src/main/res/drawable/button_circle_cancel_released.xml b/app/src/main/res/drawable/button_circle_cancel_released.xml
index 833a9076..70d47257 100644
--- a/app/src/main/res/drawable/button_circle_cancel_released.xml
+++ b/app/src/main/res/drawable/button_circle_cancel_released.xml
@@ -8,10 +8,10 @@
     </item>-->
 
     <item
-        android:left="-23dp"
-        android:right="-23dp"
-        android:top="-8dp"
-        android:bottom="-8dp"
+        android:left="-25dp"
+        android:right="-25dp"
+        android:top="-10dp"
+        android:bottom="-10dp"
         >
         <animated-rotate
             android:drawable="@drawable/rotate_progress_image"
@@ -37,14 +37,14 @@
         >
         <shape
             android:shape="ring"
-            android:innerRadius="125dp"
+            android:innerRadius="123dp"
             android:useLevel="false"
-            android:thickness="10dp">
+            android:thickness="15dp">
             <gradient
                 android:type="radial"
                 android:gradientRadius="125dp"
                 android:centerX="0.51"
-                android:centerY="0.54"
+                android:centerY="0.58"
                 android:startColor="#000000"
                 android:centerColor="#000000"
                 android:endColor="@color/transparent" />
@@ -56,7 +56,6 @@
         android:bottom="65dp"
         android:left="50dp"
         android:right="50dp"
-        >
-        <bitmap android:src="@drawable/ic_btn_cancel" />
-    </item>
+        android:drawable="@drawable/ic_btn_cancel"
+        />
 </layer-list>
 \ No newline at end of file
diff --git a/app/src/main/res/drawable/button_circle_start_pressed.xml b/app/src/main/res/drawable/button_circle_start_pressed.xml
index 4157ffe0..dd8496c3 100644
--- a/app/src/main/res/drawable/button_circle_start_pressed.xml
+++ b/app/src/main/res/drawable/button_circle_start_pressed.xml
@@ -40,8 +40,5 @@
         android:bottom="62dp"
         android:left="50dp"
         android:right="50dp"
-        >
-        <bitmap android:src="@drawable/ic_btn_on"
-            />
-    </item>
+        android:drawable="@drawable/ic_btn_on" />
 </layer-list>
 \ No newline at end of file
diff --git a/app/src/main/res/drawable/button_circle_start_released.xml b/app/src/main/res/drawable/button_circle_start_released.xml
index 671d06dc..ad748e9c 100644
--- a/app/src/main/res/drawable/button_circle_start_released.xml
+++ b/app/src/main/res/drawable/button_circle_start_released.xml
@@ -21,14 +21,14 @@
         >
         <shape
             android:shape="ring"
-            android:innerRadius="125dp"
+            android:innerRadius="122dp"
             android:useLevel="false"
-            android:thickness="10dp">
+            android:thickness="15dp">
             <gradient
                 android:type="radial"
                 android:gradientRadius="125dp"
                 android:centerX="0.51"
-                android:centerY="0.54"
+                android:centerY="0.58"
                 android:startColor="#000000"
                 android:centerColor="#000000"
                 android:endColor="@color/transparent" />
@@ -40,7 +40,5 @@
         android:bottom="65dp"
         android:left="50dp"
         android:right="50dp"
-        >
-        <bitmap android:src="@drawable/ic_btn_on" />
-    </item>
+        android:drawable="@drawable/ic_btn_on" />
 </layer-list>
 \ No newline at end of file
diff --git a/app/src/main/res/drawable/button_circle_stop_pressed.xml b/app/src/main/res/drawable/button_circle_stop_pressed.xml
index ce7583f1..79f794b2 100644
--- a/app/src/main/res/drawable/button_circle_stop_pressed.xml
+++ b/app/src/main/res/drawable/button_circle_stop_pressed.xml
@@ -40,8 +40,5 @@
         android:bottom="62dp"
         android:left="50dp"
         android:right="50dp"
-        >
-        <bitmap android:src="@drawable/ic_btn_cancel"
-            />
-    </item>
+        android:drawable="@drawable/ic_btn_cancel" />
 </layer-list>
 \ No newline at end of file
diff --git a/app/src/main/res/drawable/button_circle_stop_released.xml b/app/src/main/res/drawable/button_circle_stop_released.xml
index ed786ee0..62827b66 100644
--- a/app/src/main/res/drawable/button_circle_stop_released.xml
+++ b/app/src/main/res/drawable/button_circle_stop_released.xml
@@ -21,14 +21,14 @@
         >
         <shape
             android:shape="ring"
-            android:innerRadius="125dp"
+            android:innerRadius="122dp"
             android:useLevel="false"
-            android:thickness="10dp">
+            android:thickness="15dp">
             <gradient
                 android:type="radial"
                 android:gradientRadius="125dp"
                 android:centerX="0.51"
-                android:centerY="0.54"
+                android:centerY="0.58"
                 android:startColor="#000000"
                 android:centerColor="#000000"
                 android:endColor="@color/transparent" />
@@ -40,7 +40,6 @@
         android:bottom="65dp"
         android:left="50dp"
         android:right="50dp"
-        >
-        <bitmap android:src="@drawable/ic_btn_cancel" />
-    </item>
+        android:drawable="@drawable/ic_btn_cancel"
+        />
 </layer-list>
 \ No newline at end of file
diff --git a/app/src/main/res/drawable/footer_text_drawable.xml b/app/src/main/res/drawable/footer_text_drawable.xml
index 801746df..e3ec5005 100644
--- a/app/src/main/res/drawable/footer_text_drawable.xml
+++ b/app/src/main/res/drawable/footer_text_drawable.xml
@@ -13,6 +13,8 @@
         android:gravity="center"
         android:top="@dimen/footer_text_padding"
         android:bottom="@dimen/footer_text_padding"
+        android:left="20dp"
+        android:right="20dp"
         >
         <bitmap android:src="@drawable/leap_footer_en"/>
     </item>
diff --git a/app/src/main/res/drawable/green_mask.png b/app/src/main/res/drawable/green_mask.png
deleted file mode 100644
index e515f3f5..00000000
--- a/app/src/main/res/drawable/green_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/ic_btn_cancel.png b/app/src/main/res/drawable/ic_btn_cancel.png
index 0b55460a..af604d9b 100644
--- a/app/src/main/res/drawable/ic_btn_cancel.png
+++ b/app/src/main/res/drawable/ic_btn_cancel.png
diff --git a/app/src/main/res/drawable/ic_btn_on.png b/app/src/main/res/drawable/ic_btn_on.png
index be160a33..d6cfc10b 100644
--- a/app/src/main/res/drawable/ic_btn_on.png
+++ b/app/src/main/res/drawable/ic_btn_on.png
diff --git a/app/src/main/res/drawable/ic_btn_on_connecting.xml b/app/src/main/res/drawable/ic_btn_on_connecting.xml
deleted file mode 100644
index 4b3d1384..00000000
--- a/app/src/main/res/drawable/ic_btn_on_connecting.xml
+++ /dev/null
@@ -1,22 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-  <path
-      android:pathData="M13,4.0089C13.0002,3.4567 12.5527,3.0088 12.0004,3.0085C11.4481,3.0083 11.0002,3.4559 11,4.0082L10.9968,12.0116C10.9966,12.5639 11.4442,13.0118 11.9965,13.012C12.5487,13.0122 12.9966,12.5647 12.9968,12.0124L13,4.0089Z"
-      android:strokeColor="@color/colorPrimary_transparent"
-      android:strokeLineCap="round"
-      android:strokeWidth="0.3"
-      android:strokeLineJoin="round"
-      android:fillAlpha="0.5"
-      android:fillColor="@color/colorPrimary"/>
-  <path
-      android:pathData="M4,12.9917C4,10.7826 4.8954,8.7826 6.3431,7.3349L7.7573,8.7491C6.6715,9.8349 6,11.3349 6,12.9917C6,16.3054 8.6863,18.9917 12,18.9917C15.3137,18.9917 18,16.3054 18,12.9917C18,11.3348 17.3284,9.8348 16.2426,8.749L17.6568,7.3348C19.1046,8.7825 20,10.7825 20,12.9917C20,17.41 16.4183,20.9917 12,20.9917C7.5817,20.9917 4,17.41 4,12.9917Z"
-      android:strokeColor="@color/colorPrimary_transparent"
-      android:strokeLineCap="round"
-      android:strokeWidth="0.3"
-      android:strokeLineJoin="round"
-      android:fillAlpha="0.5"
-      android:fillColor="@color/colorPrimary"/>
-</vector>
diff --git a/app/src/main/res/drawable/ic_btn_on_disabled.xml b/app/src/main/res/drawable/ic_btn_on_disabled.xml
deleted file mode 100644
index 9c83422d..00000000
--- a/app/src/main/res/drawable/ic_btn_on_disabled.xml
+++ /dev/null
@@ -1,20 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-  <path
-      android:pathData="M13,4.0089C13.0002,3.4567 12.5527,3.0088 12.0004,3.0085C11.4481,3.0083 11.0002,3.4559 11,4.0082L10.9968,12.0116C10.9966,12.5639 11.4442,13.0118 11.9965,13.012C12.5487,13.0122 12.9966,12.5647 12.9968,12.0124L13,4.0089Z"
-      android:strokeColor="@color/colorPrimary_transparent"
-      android:strokeWidth="0.3"
-      android:fillAlpha="0.5"
-      android:strokeLineJoin="round"
-      android:fillColor="@color/white"/>
-  <path
-      android:pathData="M4,12.9917C4,10.7826 4.8954,8.7826 6.3431,7.3349L7.7573,8.7491C6.6715,9.8349 6,11.3349 6,12.9917C6,16.3054 8.6863,18.9917 12,18.9917C15.3137,18.9917 18,16.3054 18,12.9917C18,11.3348 17.3284,9.8348 16.2426,8.749L17.6568,7.3348C19.1046,8.7825 20,10.7825 20,12.9917C20,17.41 16.4183,20.9917 12,20.9917C7.5817,20.9917 4,17.41 4,12.9917Z"
-      android:strokeColor="@color/colorPrimary_transparent"
-      android:fillAlpha="0.5"
-      android:strokeWidth="0.3"
-      android:strokeLineJoin="round"
-      android:fillColor="@color/white"/>
-</vector>
diff --git a/app/src/main/res/drawable/ic_btn_on_primary_color.xml b/app/src/main/res/drawable/ic_btn_on_primary_color.xml
deleted file mode 100644
index 9f449299..00000000
--- a/app/src/main/res/drawable/ic_btn_on_primary_color.xml
+++ /dev/null
@@ -1,22 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-  <path
-      android:pathData="M13,4.0089C13.0002,3.4567 12.5527,3.0088 12.0004,3.0085C11.4481,3.0083 11.0002,3.4559 11,4.0082L10.9968,12.0116C10.9966,12.5639 11.4442,13.0118 11.9965,13.012C12.5487,13.0122 12.9966,12.5647 12.9968,12.0124L13,4.0089Z"
-      android:strokeColor="@color/colorPrimary_transparent"
-      android:strokeLineCap="round"
-      android:strokeAlpha="0.8"
-      android:strokeWidth="0.3"
-      android:strokeLineJoin="round"
-      android:fillColor="@color/colorPrimary"/>
-  <path
-      android:pathData="M4,12.9917C4,10.7826 4.8954,8.7826 6.3431,7.3349L7.7573,8.7491C6.6715,9.8349 6,11.3349 6,12.9917C6,16.3054 8.6863,18.9917 12,18.9917C15.3137,18.9917 18,16.3054 18,12.9917C18,11.3348 17.3284,9.8348 16.2426,8.749L17.6568,7.3348C19.1046,8.7825 20,10.7825 20,12.9917C20,17.41 16.4183,20.9917 12,20.9917C7.5817,20.9917 4,17.41 4,12.9917Z"
-      android:strokeColor="@color/colorPrimary_transparent"
-      android:strokeLineCap="round"
-      android:strokeAlpha="0.8"
-      android:strokeWidth="0.3"
-      android:strokeLineJoin="round"
-      android:fillColor="@color/colorPrimary"/>
-</vector>
diff --git a/app/src/main/res/drawable/logo.png b/app/src/main/res/drawable/logo.png
new file mode 100644
index 00000000..773937ff
--- /dev/null
+++ b/app/src/main/res/drawable/logo.png
diff --git a/app/src/main/res/drawable/main_btn_glow.xml b/app/src/main/res/drawable/main_btn_glow.xml
deleted file mode 100644
index 5ed57dd5..00000000
--- a/app/src/main/res/drawable/main_btn_glow.xml
+++ /dev/null
@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-
-<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">
-    <item android:drawable="@drawable/on_off_btn_start_2_enabled" android:duration="150" />
-    <item android:drawable="@drawable/on_off_btn_an4" android:duration="75" />
-    <item android:drawable="@drawable/on_off_btn_an3" android:duration="100" />
-    <item android:drawable="@drawable/on_off_btn_an2" android:duration="125" />
-    <item android:drawable="@drawable/on_off_btn_an1" android:duration="400" />
-    <item android:drawable="@drawable/on_off_btn_an2" android:duration="125" />
-    <item android:drawable="@drawable/on_off_btn_an3" android:duration="100" />
-    <item android:drawable="@drawable/on_off_btn_an4" android:duration="75" />
-</animation-list>
-\ No newline at end of file
diff --git a/app/src/main/res/drawable/main_btn_shadow.xml b/app/src/main/res/drawable/main_btn_shadow.xml
deleted file mode 100644
index 94cf379f..00000000
--- a/app/src/main/res/drawable/main_btn_shadow.xml
+++ /dev/null
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:drawable="@drawable/on_off_btn_start_2_pressed" android:state_pressed="true"/>
-    <item android:drawable="@drawable/on_off_btn_start_2_enabled"/>
-</selector>
-\ No newline at end of file
diff --git a/app/src/main/res/drawable/on_off_btn_an1.png b/app/src/main/res/drawable/on_off_btn_an1.png
deleted file mode 100644
index c80feeb7..00000000
--- a/app/src/main/res/drawable/on_off_btn_an1.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_an2.png b/app/src/main/res/drawable/on_off_btn_an2.png
deleted file mode 100644
index 73f4cb7e..00000000
--- a/app/src/main/res/drawable/on_off_btn_an2.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_an3.png b/app/src/main/res/drawable/on_off_btn_an3.png
deleted file mode 100644
index 98ad0220..00000000
--- a/app/src/main/res/drawable/on_off_btn_an3.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_an4.png b/app/src/main/res/drawable/on_off_btn_an4.png
deleted file mode 100644
index 49070e5f..00000000
--- a/app/src/main/res/drawable/on_off_btn_an4.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_fill.png b/app/src/main/res/drawable/on_off_btn_fill.png
deleted file mode 100644
index 8394ccfb..00000000
--- a/app/src/main/res/drawable/on_off_btn_fill.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_start_2_disabled.png b/app/src/main/res/drawable/on_off_btn_start_2_disabled.png
deleted file mode 100644
index 4675e48d..00000000
--- a/app/src/main/res/drawable/on_off_btn_start_2_disabled.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_start_2_enabled.png b/app/src/main/res/drawable/on_off_btn_start_2_enabled.png
deleted file mode 100644
index 383e1076..00000000
--- a/app/src/main/res/drawable/on_off_btn_start_2_enabled.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_start_2_no_shadow.png b/app/src/main/res/drawable/on_off_btn_start_2_no_shadow.png
deleted file mode 100644
index 941bdef1..00000000
--- a/app/src/main/res/drawable/on_off_btn_start_2_no_shadow.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/on_off_btn_start_2_pressed.png b/app/src/main/res/drawable/on_off_btn_start_2_pressed.png
deleted file mode 100644
index 7ff60cdb..00000000
--- a/app/src/main/res/drawable/on_off_btn_start_2_pressed.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/progressbar_circle.xml b/app/src/main/res/drawable/progressbar_circle.xml
deleted file mode 100644
index 3d5f6026..00000000
--- a/app/src/main/res/drawable/progressbar_circle.xml
+++ /dev/null
@@ -1,24 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-
-<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
-    <item>
-        <scale
-            android:scaleHeight="125%"
-            android:scaleWidth="125%"
-            android:scaleGravity="center"
-            >
-            <shape
-                android:shape="oval"
-                android:useLevel="true"
-                >
-                <gradient
-                    android:startColor="@color/colorPrimaryDark"
-                    android:centerColor="@color/colorPrimary"
-                    android:endColor="@color/black800_high_transparent"
-                    android:gradientRadius="100dp"
-                    android:type="radial"
-                    />
-            </shape>
-        </scale>
-    </item>
-</layer-list>
-\ No newline at end of file
diff --git a/app/src/main/res/drawable/red_mask.png b/app/src/main/res/drawable/red_mask.png
deleted file mode 100644
index a4bd4a78..00000000
--- a/app/src/main/res/drawable/red_mask.png
+++ /dev/null
diff --git a/app/src/main/res/drawable/rotate_progress_image.xml b/app/src/main/res/drawable/rotate_progress_image.xml
deleted file mode 100644
index 7b539720..00000000
--- a/app/src/main/res/drawable/rotate_progress_image.xml
+++ /dev/null
@@ -1,12 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"
-    android:name="circle"
-    android:viewportWidth="91"
-    android:viewportHeight="91"
-    android:width="91dp"
-    android:height="91dp">
-
-<!--
-    // implement your rotation animation vector image here
--->
-
-</vector>
-\ No newline at end of file
diff --git a/app/src/main/res/drawable/yellow_mask.png b/app/src/main/res/drawable/yellow_mask.png
deleted file mode 100644
index 98dd7978..00000000
--- a/app/src/main/res/drawable/yellow_mask.png
+++ /dev/null
diff --git a/app/src/main/res/layout-port/f_eip.xml b/app/src/main/res/layout-port/f_eip.xml
new file mode 100644
index 00000000..83aabcde
--- /dev/null
+++ b/app/src/main/res/layout-port/f_eip.xml
@@ -0,0 +1,148 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout 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"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/eipServiceFragment"
+    >
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_left"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.3"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_center"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.25" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_outer_left"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintGuide_percent="0.125"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_outer_right"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.875"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.6"
+        />
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_right"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.7"
+        />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/background"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        app:srcCompat="@drawable/bg_disconnected"
+        android:scaleType="fitXY"
+        />
+
+
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/main_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/sub_description"
+        android:padding="@dimen/activity_margin"
+        android:layout_marginTop="@dimen/activity_margin"
+        android:textAppearance="@android:style/TextAppearance.Large"
+        android:textStyle="bold"
+        android:textSize="34sp"
+        android:autoSizeMinTextSize="28sp"
+        android:autoSizeTextType="uniform"
+        android:textColor="@color/colorEipFragmentFont"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Connection secure"
+        android:gravity="center"
+        android:maxLines="1"
+        />
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/sub_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toBottomOf="@id/main_description"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        android:padding="@dimen/activity_margin"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Medium"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="A LONG TEXT WITH SEVERAL THINGS BLABLkk \n kdjfkj \n kjdfkjdf"
+        android:gravity="center"
+        android:maxLines="3"
+        android:ellipsize="end"
+        />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/state_view"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintTop_toTopOf="@id/guideline_horizontal_center"
+        app:layout_constraintLeft_toLeftOf="@id/guideline_vertical_outer_left"
+        app:layout_constraintRight_toRightOf="@id/guideline_vertical_outer_right"
+        app:layout_constraintVertical_bias="1"
+        app:srcCompat="@drawable/state_disconnected"
+        />
+    <se.leap.bitmaskclient.base.views.MainButton
+        android:id="@+id/main_button"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:layout_margin="@dimen/stdpadding"
+        app:layout_constraintTop_toBottomOf="@+id/guideline_horizontal_bottom"
+        app:layout_constraintBottom_toTopOf="@id/gateway_location_button"
+        app:layout_constraintDimensionRatio="1:1"
+        app:layout_constraintEnd_toStartOf="@+id/guideline_vertical_right"
+        app:layout_constraintStart_toStartOf="@+id/guideline_vertical_left"
+        />
+
+    <se.leap.bitmaskclient.base.views.LocationButton
+        android:id="@+id/gateway_location_button"
+        android:layout_width="match_parent"
+        android:layout_height="64dp"
+        android:layout_marginBottom="@dimen/stdpadding"
+        android:layout_marginEnd="@dimen/stdpadding"
+        android:layout_marginStart="@dimen/stdpadding"
+        android:layout_marginTop="@dimen/stdpadding"
+        android:layout_marginLeft="@dimen/stdpadding"
+        android:layout_marginRight="@dimen/stdpadding"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        tools:text="SEATTLE"
+        android:gravity="center_vertical" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/app/src/main/res/layout-xlarge-port/f_eip.xml b/app/src/main/res/layout-xlarge-port/f_eip.xml
new file mode 100644
index 00000000..ee0fbac9
--- /dev/null
+++ b/app/src/main/res/layout-xlarge-port/f_eip.xml
@@ -0,0 +1,151 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    This is the layout for extra large landscape, extra large portrait
+    can be found in layout-xlarge-port
+-->
+<androidx.constraintlayout.widget.ConstraintLayout 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"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/eipServiceFragment"
+    >
+
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_center"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.25"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_left"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.3" />
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.65" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_button_top"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.875"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_button_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.98"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_right"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintGuide_percent="0.7" />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/background"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:scaleType="fitXY"
+        app:srcCompat="@drawable/bg_disconnected" />
+
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/main_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/sub_description"
+        android:padding="@dimen/stdpadding"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Large"
+        android:textSize="45sp"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Connection secure"
+        />
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/sub_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toBottomOf="@id/main_description"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal_center"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Large"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        android:paddingLeft="@dimen/stdpadding"
+        android:paddingStart="@dimen/stdpadding"
+        android:paddingRight="@dimen/stdpadding"
+        android:paddingEnd="@dimen/stdpadding"
+        android:paddingBottom="@dimen/stdpadding"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Your traffic is securly routed through \n another"
+        android:maxLines="2"
+        android:gravity="center"
+        />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/state_view"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_center"
+        app:layout_constraintLeft_toLeftOf="@id/guideline_vertical_left"
+        app:layout_constraintRight_toRightOf="@id/guideline_vertical_right"
+        app:layout_constraintVertical_bias="1"
+        app:srcCompat="@drawable/state_disconnected"
+        />
+
+    <se.leap.bitmaskclient.base.views.MainButton
+        android:id="@+id/main_button"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:layout_margin="@dimen/stdpadding"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal_button_top"
+        app:layout_constraintEnd_toStartOf="@+id/guideline_vertical_right"
+        app:layout_constraintStart_toStartOf="@+id/guideline_vertical_left"
+        app:layout_constraintDimensionRatio="1:1"
+        />
+
+
+    <se.leap.bitmaskclient.base.views.LocationButton
+        android:id="@+id/gateway_location_button"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_marginEnd="@dimen/stdpadding"
+        android:layout_marginStart="@dimen/stdpadding"
+
+        android:layout_marginLeft="@dimen/stdpadding"
+        android:layout_marginRight="@dimen/stdpadding"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_button_top"
+        app:layout_constraintBottom_toBottomOf="@+id/guideline_horizontal_button_bottom"
+        tools:text="SEATTLE"
+        android:gravity="center_vertical" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/app/src/main/res/layout-xlarge/f_eip.xml b/app/src/main/res/layout-xlarge/f_eip.xml
new file mode 100644
index 00000000..e413319a
--- /dev/null
+++ b/app/src/main/res/layout-xlarge/f_eip.xml
@@ -0,0 +1,150 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    This is the layout for extra large landscape, extra large portrait
+    can be found in layout-xlarge-port
+-->
+<androidx.constraintlayout.widget.ConstraintLayout 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"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/eipServiceFragment"
+    >
+
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_center"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.25"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_left"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.3" />
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.6" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_button_top"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.875"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_button_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.98"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_right"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintGuide_percent="0.7" />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/background"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:scaleType="fitXY"
+        app:srcCompat="@drawable/bg_disconnected" />
+
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/main_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/sub_description"
+        android:padding="@dimen/stdpadding"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Large"
+        android:textSize="45sp"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Connection secure"
+        />
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/sub_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toBottomOf="@id/main_description"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal_center"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Large"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        android:paddingLeft="@dimen/stdpadding"
+        android:paddingStart="@dimen/stdpadding"
+        android:paddingRight="@dimen/stdpadding"
+        android:paddingEnd="@dimen/stdpadding"
+        android:paddingBottom="@dimen/stdpadding"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Your traffic is securly routed through \n another"
+        android:maxLines="2"
+        android:gravity="center"
+        />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/state_view"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_center"
+        app:layout_constraintLeft_toLeftOf="@id/guideline_vertical_left"
+        app:layout_constraintRight_toRightOf="@id/guideline_vertical_right"
+        app:layout_constraintVertical_bias="1"
+        app:srcCompat="@drawable/state_disconnected"
+        />
+
+    <se.leap.bitmaskclient.base.views.MainButton
+        android:id="@+id/main_button"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal_button_top"
+        app:layout_constraintEnd_toStartOf="@+id/guideline_vertical_right"
+        app:layout_constraintStart_toStartOf="@+id/guideline_vertical_left"
+        app:layout_constraintDimensionRatio="1:1"
+        />
+
+
+    <se.leap.bitmaskclient.base.views.LocationButton
+        android:id="@+id/gateway_location_button"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_marginEnd="@dimen/stdpadding"
+        android:layout_marginStart="@dimen/stdpadding"
+
+        android:layout_marginLeft="@dimen/stdpadding"
+        android:layout_marginRight="@dimen/stdpadding"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_button_top"
+        app:layout_constraintBottom_toBottomOf="@+id/guideline_horizontal_button_bottom"
+        tools:text="SEATTLE"
+        android:gravity="center_vertical" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/app/src/main/res/layout/allowed_application_layout.xml b/app/src/main/res/layout/allowed_application_layout.xml
index 671a54fc..bb8e4e5d 100644
--- a/app/src/main/res/layout/allowed_application_layout.xml
+++ b/app/src/main/res/layout/allowed_application_layout.xml
@@ -25,7 +25,6 @@
         android:layout_rowSpan="1"
         android:layout_marginEnd="8dip"
         android:scaleType="centerInside"
-        tools:background="@drawable/ic_btn_on_connecting"
         android:contentDescription="@null" />
 
     <androidx.appcompat.widget.AppCompatTextView
diff --git a/app/src/main/res/layout/f_eip.xml b/app/src/main/res/layout/f_eip.xml
new file mode 100644
index 00000000..1e1f8e41
--- /dev/null
+++ b/app/src/main/res/layout/f_eip.xml
@@ -0,0 +1,159 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+    This is the default layout for landscape, portrait can be found
+    in layout-port
+-->
+<androidx.constraintlayout.widget.ConstraintLayout 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"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/eipServiceFragment"
+    >
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_top"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.1"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_center"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.25"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_left"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.3" />
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.50" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_button_top"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.8"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_horizontal_button_bottom"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.98"
+        />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/guideline_vertical_right"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:orientation="vertical"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintGuide_percent="0.7" />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/background"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:scaleType="fitXY"
+        app:srcCompat="@drawable/bg_disconnected" />
+
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/main_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/sub_description"
+        android:paddingLeft="@dimen/stdpadding"
+        android:paddingStart="@dimen/stdpadding"
+        android:paddingRight="@dimen/stdpadding"
+        android:paddingEnd="@dimen/stdpadding"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Large"
+        android:textSize="26sp"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Connection secure"
+        />
+
+    <androidx.appcompat.widget.AppCompatTextView
+        android:id="@+id/sub_description"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toBottomOf="@id/main_description"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal_center"
+        android:textAppearance="@android:style/TextAppearance.DeviceDefault.Medium"
+        android:textStyle="bold"
+        android:textColor="@color/colorEipFragmentFont"
+        android:paddingLeft="@dimen/stdpadding"
+        android:paddingStart="@dimen/stdpadding"
+        android:paddingRight="@dimen/stdpadding"
+        android:paddingEnd="@dimen/stdpadding"
+        android:paddingBottom="@dimen/stdpadding"
+        app:layout_constraintDimensionRatio="1:1"
+        tools:text="Your traffic is securly routed through \n another"
+        android:maxLines="2"
+        android:gravity="center"
+        />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/state_view"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toTopOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_center"
+        app:layout_constraintLeft_toLeftOf="@id/guideline_vertical_left"
+        app:layout_constraintRight_toRightOf="@id/guideline_vertical_right"
+        app:layout_constraintVertical_bias="1"
+        app:srcCompat="@drawable/state_disconnected"
+        />
+
+    <se.leap.bitmaskclient.base.views.MainButton
+        android:id="@+id/main_button"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_bottom"
+        app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal_button_top"
+        app:layout_constraintEnd_toStartOf="@+id/guideline_vertical_right"
+        app:layout_constraintStart_toStartOf="@+id/guideline_vertical_left"
+        app:layout_constraintDimensionRatio="1:1"
+        />
+
+
+    <se.leap.bitmaskclient.base.views.LocationButton
+        android:id="@+id/gateway_location_button"
+        android:layout_width="match_parent"
+        android:layout_height="0dp"
+        android:layout_marginEnd="@dimen/stdpadding"
+        android:layout_marginStart="@dimen/stdpadding"
+
+        android:layout_marginLeft="@dimen/stdpadding"
+        android:layout_marginRight="@dimen/stdpadding"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/guideline_horizontal_button_top"
+        app:layout_constraintBottom_toBottomOf="@+id/guideline_horizontal_button_bottom"
+        tools:text="SEATTLE"
+        android:gravity="center_vertical" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/app/src/main/res/layout/v_location_button.xml b/app/src/main/res/layout/v_location_button.xml
index aa4af10c..8aaf4978 100644
--- a/app/src/main/res/layout/v_location_button.xml
+++ b/app/src/main/res/layout/v_location_button.xml
@@ -5,9 +5,9 @@
     android:orientation="horizontal"
     android:layout_width="match_parent"
     android:layout_gravity="center_vertical"
+    android:layout_height="match_parent"
     android:padding="@dimen/stdpadding"
     android:background="@drawable/cust_button_light_rect"
-    android:layout_height="match_parent"
     >
 
     <androidx.appcompat.widget.AppCompatImageView
@@ -38,30 +38,31 @@
         android:visibility="gone"
         tools:visibility="visible"
         />
-
     <androidx.appcompat.widget.AppCompatTextView
         android:id="@+id/text_location"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:layout_centerInParent="true"
-        android:layout_gravity="center_vertical"
-        android:layout_toStartOf="@+id/bridge_icn"
-        android:layout_toLeftOf="@+id/bridge_icn"
-        android:layout_toEndOf="@id/recommended_icn"
-        android:layout_toRightOf="@+id/recommended_icn"
-        android:ellipsize="end"
-        android:gravity="center_vertical"
-        android:maxLines="1"
         android:paddingStart="@dimen/stdpadding"
         android:paddingLeft="@dimen/stdpadding"
         android:paddingEnd="@dimen/stdpadding"
         android:paddingRight="@dimen/stdpadding"
+        android:maxLines="1"
+        android:ellipsize="end"
+        android:layout_height="match_parent"
+        android:layout_width="match_parent"
+        app:autoSizeTextType="uniform"
+        android:gravity="center_vertical"
+        app:autoSizeMinTextSize="15sp"
+        app:autoSizeMaxTextSize="24sp"
+        android:layout_toEndOf="@id/recommended_icn"
+        android:layout_toRightOf="@+id/recommended_icn"
+        android:layout_toLeftOf="@+id/bridge_icn"
+        android:layout_toStartOf="@+id/bridge_icn"
+        android:layout_gravity="center_vertical"
+        android:layout_centerInParent="true"
         android:textAppearance="@style/TextAppearance.AppCompat.Large"
         android:textStyle="bold"
-        app:autoSizeMaxTextSize="24sp"
-        app:autoSizeMinTextSize="15sp"
-        app:autoSizeTextType="uniform"
-        tools:text="Seattle along message" />
+        android:textColor="@color/white"
+        tools:text="Seattle along message"
+        />
 
     <androidx.appcompat.widget.AppCompatImageView
         android:id="@+id/bridge_icn"
diff --git a/app/src/main/res/layout/v_main_btn.xml b/app/src/main/res/layout/v_main_btn.xml
deleted file mode 100644
index 3ab62e5a..00000000
--- a/app/src/main/res/layout/v_main_btn.xml
+++ /dev/null
@@ -1,55 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:id="@+id/vpn_btn_container"
-    xmlns:app="http://schemas.android.com/apk/res-auto"
-    xmlns:tools="http://schemas.android.com/tools"
-    tools:viewBindingIgnore="true"
-    >
-
-    <androidx.appcompat.widget.AppCompatImageView
-        android:id="@+id/vpn_btn_glow"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:background="@drawable/main_btn_glow"
-        tools:visibility="visible"
-        android:visibility="gone"
-        app:backgroundTint="@color/colorMainBtnHighlight"
-        />
-
-
-    <androidx.appcompat.widget.AppCompatImageView
-        android:id="@+id/vpn_btn_shadow_dark"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:srcCompat="@drawable/main_btn_shadow"
-        android:visibility="visible"
-        />
-
-    <androidx.appcompat.widget.AppCompatImageView
-        android:id="@+id/vpn_btn_shadow_light"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        tools:visibility="visible"
-        tools:tint="@color/colorMainBtnHighlight"
-        android:visibility="gone"
-        />
-
-    <androidx.appcompat.widget.AppCompatImageView
-        android:id="@+id/vpn_btn_fill"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:srcCompat="@drawable/on_off_btn_start_2_no_shadow"
-        android:visibility="visible"
-        app:tint="@color/main_button_state_color"
-        />
-
-    <androidx.appcompat.widget.AppCompatImageView
-        android:id="@+id/vpn_btn_fill_overlay"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:srcCompat="@drawable/on_off_btn_fill"
-        tools:visibility="visible"
-        />
-</RelativeLayout>
-\ No newline at end of file
diff --git a/app/src/main/res/layout/v_main_button.xml b/app/src/main/res/layout/v_main_button.xml
new file mode 100644
index 00000000..72981238
--- /dev/null
+++ b/app/src/main/res/layout/v_main_button.xml
@@ -0,0 +1,110 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/vpn_btn_guideline_left"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.125" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/vpn_btn_guideline_right"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.875" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/vpn_btn_guideline_top"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.125" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/vpn_btn_guideline_bottom"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.875" />
+
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/icn_guideline_left"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.2" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/icn_guideline_right"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.8" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/icn_guideline_top"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.2" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/icn_guideline_bottom"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.8" />
+
+   <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/border_guideline_left"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.025" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/border_guideline_right"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="vertical"
+        app:layout_constraintGuide_percent="0.975" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/border_guideline_top"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.025" />
+
+    <androidx.constraintlayout.widget.Guideline
+        android:id="@+id/border_guideline_bottom"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:orientation="horizontal"
+        app:layout_constraintGuide_percent="0.975" />
+
+    <androidx.appcompat.widget.AppCompatImageView
+        android:id="@+id/button"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toTopOf="@+id/vpn_btn_guideline_bottom"
+        app:layout_constraintEnd_toStartOf="@+id/vpn_btn_guideline_right"
+        app:layout_constraintStart_toStartOf="@+id/vpn_btn_guideline_left"
+        app:layout_constraintTop_toTopOf="@+id/vpn_btn_guideline_top"
+        app:layout_constraintDimensionRatio="1:1"
+        app:srcCompat="@drawable/button_circle_start"
+        />
+
+
+
+
+
+</androidx.constraintlayout.widget.ConstraintLayout>
+\ No newline at end of file
diff --git a/app/src/main/res/values-v31/themes.xml b/app/src/main/res/values-v31/themes.xml
new file mode 100644
index 00000000..81d6c19e
--- /dev/null
+++ b/app/src/main/res/values-v31/themes.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <style name="SplashTheme" parent="Theme.AppCompat.NoActionBar">
+        <item name="android:windowSplashScreenBackground">@color/colorPrimary</item>
+        <item name="android:windowSplashScreenAnimatedIcon">@drawable/splash_icon</item>
+        <item name="android:windowSplashScreenBrandingImage">@drawable/splash_branding</item>
+    </style>
+</resources>
+\ No newline at end of file
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index c3a519cf..35e49370 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -10,6 +10,7 @@
     <color name="colorMainBtnHighlight">#03DAC6</color>
     <color name="colorMainBtnError">#eF2222</color>
 
+    <color name="black800_dark">#1b1b1b</color>
     <color name="black800">#424242</color>
     <color name="black800_secondary">#3b3b3b</color>
     <color name="black800_transparent">#AA424242</color>
@@ -37,7 +38,6 @@
     <color name="black_transparent">#20000000</color>
     <color name="black_high_transparent">#05000000</color>
 
-
     <color name="colorEipFragmentFont">@color/black800</color>
     <color name="colorFontBtn">@color/black800</color>
     <color name="colorFontBtnEnabled">@color/white</color>
@@ -57,6 +57,11 @@
     <color name="btn_light_transparent">#CCFFFEFE</color>
     <color name="btn_light_transparent_dark">#CCCCCBCB</color>
 
+    <!-- main UI background colors -->
+    <color name="bg_disconnected">#DC6F6B</color>
+    <color name="bg_connecting">#FADD85</color>
+    <color name="bg_running">#CCDCB8</color>
+
     <!-- actionbar and status bar colors for different connection states -->
     <color name="bg_disconnected_top">#EC6767</color>
     <color name="bg_disconnected_top_light_transparent">#CCff9895</color>
@@ -66,8 +71,8 @@
     <color name="bg_running_top_light_transparent">#ffffea</color>
 
     <!-- action bar text colors for per state colored action bar -->
-    <color name="actionbar_dark_color">@color/black800</color>
-    <color name="actionbar_light_color">@color/white</color>
+    <color name="actionbar_connectivity_state_text_color_dark">@color/black800</color>
+    <color name="actionbar_connectivity_state_text_color_light">@color/white</color>
     <!-- default action bar colors used in other fragments than EipFragment -->
     <color name="colorActionBarTitleFont">@color/white</color>
     <color name="colorActionBarSubtitleFont">@color/black800</color>
author	cyberta <cyberta@riseup.net>	2022-12-06 05:22:58 +0000
committer	cyberta <cyberta@riseup.net>	2022-12-06 05:22:58 +0000
commit	64427ae7fa3b6ff14d484efd3dc513744a615945 (patch)
tree	3ac508716ac0210603f32f80baf07881c80b3ab1 /app/src/main
parent	c0d1a28e5d737fbf24e13ade9fd6988a07ee2719 (diff)
parent	4c6f49fe5ec695541be06322a1cf227e2d6d083d (diff)