[Site Creation] Tweak UI of Site Theme to match design specs

WordPress/src/main/java/org/wordpress/android/ui/layoutpicker/LayoutCategoryAdapter.kt

@@ -22,6 +22,7 @@ class LayoutCategoryAdapter(
     private val thumbDimensionProvider: ThumbDimensionProvider,
     private val recommendedDimensionProvider: ThumbDimensionProvider? = null,
     private val showRowDividers: Boolean = true,
+    private val useLargeCategoryHeading: Boolean = false,
     private val footerLayoutResId: Int? = null
 ) : Adapter<LayoutsRowViewHolder>() {
     private var items: List<LayoutCategoryUiState> = listOf()
@@ -66,7 +67,8 @@ class LayoutCategoryAdapter(
                             nestedScrollStates = nestedScrollStates,
                             thumbDimensionProvider = thumbDimensionProvider,
                             recommendedDimensionProvider = recommendedDimensionProvider,
-                            showRowDividers = showRowDividers
+                            showRowDividers = showRowDividers,
+                            useLargeCategoryHeading = useLargeCategoryHeading
                     )
             }
 

WordPress/src/main/java/org/wordpress/android/ui/layoutpicker/LayoutsRowViewHolder.kt

@@ -2,6 +2,7 @@ package org.wordpress.android.ui.layoutpicker
 
 import android.os.Bundle
 import android.os.Parcelable
+import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
@@ -12,6 +13,7 @@ import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
 import androidx.recyclerview.widget.RecyclerView.OnScrollListener
 import org.wordpress.android.R
+import org.wordpress.android.R.dimen
 import org.wordpress.android.util.extensions.setVisible
 
 sealed class LayoutsRowViewHolder(view: View) : RecyclerView.ViewHolder(view)
@@ -24,10 +26,12 @@ class LayoutsFooterViewHolder(parent: ViewGroup, footerLayoutResId: Int) :
 /**
  * Modal Layout Picker layouts view holder
  */
+@Suppress("LongParameterList")
 class LayoutsItemViewHolder(
     parent: ViewGroup,
     private val prefetchItemCount: Int = 4,
     private val showRowDividers: Boolean,
+    private val useLargeCategoryHeading: Boolean,
     private var nestedScrollStates: Bundle,
     private val thumbDimensionProvider: ThumbDimensionProvider,
     private val recommendedDimensionProvider: ThumbDimensionProvider?
@@ -36,6 +40,7 @@ class LayoutsItemViewHolder(
                 parent.context
         ).inflate(R.layout.modal_layout_picker_layouts_row, parent, false)
 ) {
+    private val rowDivider: View = itemView.findViewById(R.id.layouts_row_separator_line)
     private val title: TextView = itemView.findViewById(R.id.title)
     private val subtitle: TextView = itemView.findViewById(R.id.subtitle)
     private var currentItem: LayoutCategoryUiState? = null
@@ -49,7 +54,6 @@ class LayoutsItemViewHolder(
         itemView.updateLayoutParams {
             height = dimensionProvider.rowHeight
         }
-        itemView.findViewById<View>(R.id.layouts_row_separator_line).isVisible = showRowDividers
         itemView.findViewById<RecyclerView>(R.id.layouts_recycler_view).apply {
             layoutManager = LinearLayoutManager(
                     context,
@@ -71,7 +75,16 @@ class LayoutsItemViewHolder(
     fun bind(category: LayoutCategoryUiState) {
         currentItem = category
 
+        rowDivider.isVisible = showRowDividers
         title.text = category.description
+
+        title.setTextSize(
+                TypedValue.COMPLEX_UNIT_PX,
+                title.resources.getDimensionPixelSize(
+                        if (useLargeCategoryHeading) dimen.text_sz_extra_large else dimen.text_sz_large
+                ).toFloat()
+        )
+
         subtitle.setVisible(category.isRecommended)
         (recycler.adapter as LayoutsAdapter).setData(category.layouts)
         restoreScrollState(recycler, category.title)

WordPress/src/main/java/org/wordpress/android/ui/sitecreation/SiteCreationActivity.kt

@@ -178,11 +178,7 @@ class SiteCreationActivity : LocaleAwareActivity(),
             SITE_NAME -> SiteCreationSiteNameFragment.newInstance(target.wizardState.siteIntent)
             SITE_DESIGNS -> {
                 // Cancel preload job before displaying the theme picker.
-                if (target.wizardStep == SITE_DESIGNS) {
-                    mainViewModel.preloadingJob?.cancel(
-                            "Preload did not complete before theme picker was shown."
-                    )
-                }
+                mainViewModel.preloadingJob?.cancel("Preload did not complete before theme picker was shown.")
                 HomePagePickerFragment.newInstance(target.wizardState.siteIntent)
             }
             DOMAINS -> SiteCreationDomainsFragment.newInstance(

WordPress/src/main/java/org/wordpress/android/ui/sitecreation/SiteCreationMainVM.kt

@@ -65,7 +65,6 @@ class SiteCreationMainVM @Inject constructor(
     private val fetchHomePageLayoutsUseCase: FetchHomePageLayoutsUseCase
 ) : ViewModel() {
     init {
-        // TODO: Remove the duplicate {,un}registration in the picker view model
         dispatcher.register(fetchHomePageLayoutsUseCase)
     }
 

WordPress/src/main/java/org/wordpress/android/ui/sitecreation/theme/HomePagePickerFragment.kt

@@ -70,6 +70,7 @@ class HomePagePickerFragment : Fragment() {
                         thumbDimensionProvider,
                         recommendedDimensionProvider,
                         showRowDividers = false,
+                        useLargeCategoryHeading = true,
                         footerLayoutResId = R.layout.home_page_picker_footer
                 )
             }

WordPress/src/main/res/drawable/top_divider_background.xml

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item
+        android:left="-8dp"
+        android:right="-8dp"
+        android:bottom="-8dp">
+        <shape>
+            <solid android:color="@android:color/transparent" />
+            <stroke
+                android:width="@dimen/bottom_tabs_divider_size"
+                android:color="@color/material_on_surface_disabled" />
+        </shape>
+    </item>
+</layer-list>

WordPress/src/main/res/layout/home_page_picker_footer.xml

@@ -9,9 +9,10 @@
         style="@style/SiteCreationHeaderV2Subtitle"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:padding="@dimen/margin_large"
+        android:padding="@dimen/margin_extra_large"
         android:text="@string/hpp_bottom_helper_text"
         android:drawablePadding="@dimen/margin_large"
+        android:background="@drawable/top_divider_background"
         app:drawableStartCompat="@drawable/ic_info_outline_grey_dark_24dp"
         app:drawableTint="?attr/colorOnSurface"
         app:layout_constraintTop_toTopOf="parent"