Fixes #4161: Modified style of bookmark_folders_sign_in button. (#4291)

To make this match the style of the other button I applied the same style to it
and also changed it to be a MaterialButton.
I also decided to extract the margin and padding values of the button.

app/src/main/java/org/mozilla/fenix/library/bookmarks/SignInUIView.kt

@@ -7,7 +7,7 @@ package org.mozilla.fenix.library.bookmarks
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.Button
+import com.google.android.material.button.MaterialButton
 import io.reactivex.Observable
 import io.reactivex.Observer
 import io.reactivex.functions.Consumer
@@ -20,7 +20,7 @@ class SignInUIView(
     changesObservable: Observable<SignInChange>
 ) : UIView<SignInState, SignInAction, SignInChange>(container, actionEmitter, changesObservable) {
 
-    override val view: Button = LayoutInflater.from(container.context)
+    override val view: MaterialButton = LayoutInflater.from(container.context)
         .inflate(R.layout.component_sign_in, container, true)
         .findViewById(R.id.bookmark_folders_sign_in)
 

app/src/main/res/layout/component_sign_in.xml

@@ -2,17 +2,21 @@
 <!-- This Source Code Form is subject to the terms of the Mozilla Public
    - License, v. 2.0. If a copy of the MPL was not distributed with this
    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-<Button
+<com.google.android.material.button.MaterialButton
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:id="@+id/bookmark_folders_sign_in"
+    style="@style/ThemeIndependentMaterialGreyButtonDestructive"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
+    android:layout_marginEnd="@dimen/sign_in_button_margin"
+    android:layout_marginStart="@dimen/sign_in_button_margin"
+    android:layout_marginTop="@dimen/sign_in_button_margin_top"
+    android:paddingBottom="@dimen/sign_in_button_padding"
+    android:paddingTop="@dimen/sign_in_button_padding"
     android:text="@string/bookmark_sign_in_button"
-    android:padding="10dp"
-    android:layout_marginTop="32dp"
-    android:textSize="14sp"
     android:visibility="gone"
     app:layout_constraintBottom_toBottomOf="parent"
+    app:layout_constraintEnd_toEndOf="parent"
     app:layout_constraintStart_toStartOf="parent"
-    app:layout_constraintEnd_toEndOf="parent" />
+    app:rippleColor="?secondaryText"/>

app/src/main/res/values/dimens.xml

@@ -43,4 +43,9 @@
     <!-- Browser Toolbar -->
     <dimen name="browser_toolbar_height">56dp</dimen>
     <dimen name="toolbar_and_qab_height">67dp</dimen>
+
+    <!-- SignIn Component -->
+    <dimen name="sign_in_button_padding">10dp</dimen>
+    <dimen name="sign_in_button_margin_top">32dp</dimen>
+    <dimen name="sign_in_button_margin">16dp</dimen>
 </resources>