ui: pass 3 — skeleton loading, a11y, snackbars, dark mode

Skeleton loading state: * Wire item_skeleton_transaction (previously dormant in res) into AccountHistoryFragment and TransferHistoryFragment. When a load starts with no cached transactions, 8 skeleton rows appear under the search bar instead of a blank screen. Skeleton hides as soon as transactions arrive or the load completes. * Decision: ActivitiesFragment loads from local storage synchronously, so no skeleton there — would only flash for a frame. Accessibility: * Decorative icons in item_more_nav, item_nav_slot, item_picker_row, and item_account_dropdown now declare importantForAccessibility="no" so TalkBack skips them (the adjacent text label conveys meaning). * Also added tnum to item_picker_row.tvBalance and item_account_dropdown.tvDropdownBalance — missed amounts from Pass 2. Snackbar: * ContactsFragment.deleteContact's success/failure feedback is now a Snackbar instead of Toast — the fragment stays visible, so a bottom-anchored Snackbar fits better than a floating Toast. * Other Toasts are either followed by navigation away (Snackbar couldn't display), or purely informational ("copied", "press back to exit") where Toast is the right primitive. Left as-is. Dark mode: * Connectivity banner in activity_home no longer hardcodes #C62828 / #FFFFFF — uses colorErrorContainer / colorOnErrorContainer so it adapts to the user's theme. * Other hex literals (card-artwork text, receipt screens that intentionally emulate paper) are intentional and stay. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
ui: pass 2 — pill style, tabular figures, ripple feedback, empty strings
2026-05-28 18:02:50 +05:00 · 2026-05-28 17:48:23 +05:00 · 2026-05-28 17:32:18 +05:00 · 2026-05-28 17:20:16 +05:00
30 changed files with 191 additions and 84 deletions
@@ -142,6 +142,8 @@ class AccountHistoryFragment : Fragment() {
        }
        adapter.setTransactions(filtered)
        binding.emptyView.visibility = if (filtered.isEmpty() && !isLoading) View.VISIBLE else View.GONE
+        binding.skeletonContainer.visibility =
+            if (allTransactions.isEmpty() && isLoading) View.VISIBLE else View.GONE
    }

    private fun resetAndReload() {
@@ -168,6 +170,9 @@ class AccountHistoryFragment : Fragment() {

        if (firstPageDone && allTransactions.isNotEmpty()) {
            adapter.showLoadingFooter = true
+        } else if (allTransactions.isEmpty()) {
+            binding.skeletonContainer.visibility = View.VISIBLE
+            binding.emptyView.visibility = View.GONE
        }

        val app = requireActivity().application as BasedBankApp
@@ -187,6 +192,7 @@ class AccountHistoryFragment : Fragment() {

            isLoading = false
            if (_binding == null) return@launch
+            binding.skeletonContainer.visibility = View.GONE

            if (!firstPageDone) {
                firstPageDone = true
@@ -9,6 +9,7 @@ import android.view.View
 import android.view.ViewGroup
 import android.widget.Toast
 import com.google.android.material.dialog.MaterialAlertDialogBuilder
+import com.google.android.material.snackbar.Snackbar
 import androidx.core.view.ViewCompat
 import androidx.core.view.WindowInsetsCompat
 import androidx.core.widget.addTextChangedListener
@@ -194,10 +195,10 @@ class ContactsFragment : Fragment() {
        viewLifecycleOwner.lifecycleScope.launch {
            val success = withContext(Dispatchers.IO) { ContactManager.delete(contact, app) }
            if (success) {
-                Toast.makeText(requireContext(), R.string.contact_deleted, Toast.LENGTH_SHORT).show()
                removeFromViewModel(contact)
+                Snackbar.make(binding.root, R.string.contact_deleted, Snackbar.LENGTH_SHORT).show()
            } else {
-                Toast.makeText(requireContext(), R.string.contact_delete_failed, Toast.LENGTH_SHORT).show()
+                Snackbar.make(binding.root, R.string.contact_delete_failed, Snackbar.LENGTH_LONG).show()
            }
        }
    }
@@ -305,12 +305,7 @@ ViewCompat.setOnApplyWindowInsetsListener(binding.contentLayout) { v, insets ->
            if (statusLabel == null) { tv.visibility = View.GONE; return }
            tv.visibility = View.VISIBLE
            tv.text = statusLabel
-            val dp = tv.context.resources.displayMetrics.density
-            tv.background = GradientDrawable().apply {
-                shape = GradientDrawable.RECTANGLE
-                cornerRadius = 12 * dp
-                setColor(0xCC212121.toInt())
-            }
+            tv.setBackgroundResource(R.drawable.card_overlay_pill_bg)
        }

        fun formatMasked(masked: String): String {
@@ -181,6 +181,9 @@ class TransferHistoryFragment : Fragment() {

        if (firstBatchDone && allTransactions.isNotEmpty()) {
            adapter.showLoadingFooter = true
+        } else if (allTransactions.isEmpty()) {
+            binding.skeletonContainer.visibility = View.VISIBLE
+            binding.emptyView.visibility = View.GONE
        }

        val app = requireActivity().application as BasedBankApp
@@ -286,6 +289,7 @@ class TransferHistoryFragment : Fragment() {

            isLoading = false
            if (_binding == null) return@launch
+            binding.skeletonContainer.visibility = View.GONE

            val raw = bannerMsg.get()
            when {
@@ -329,6 +333,8 @@ class TransferHistoryFragment : Fragment() {
        }
        adapter.setTransactions(filtered)
        binding.emptyView.visibility = if (filtered.isEmpty() && !isLoading) View.VISIBLE else View.GONE
+        binding.skeletonContainer.visibility =
+            if (allTransactions.isEmpty() && isLoading) View.VISIBLE else View.GONE
    }

    private fun loadContactImage(name: String) {
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Translucent dark pill used as a status overlay on card-visual surfaces
+     (item_card_dashboard / _stack / _wallet / _settings_entry). Theme-independent
+     by design: it sits on top of card artwork, not the surface color. -->
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="rectangle">
+    <corners android:radius="12dp" />
+    <solid android:color="#CC212121" />
+</shape>
@@ -44,8 +44,8 @@
                android:id="@+id/connectivityBanner"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
-                android:background="#C62828"
-                android:textColor="#FFFFFF"
+                android:background="?attr/colorErrorContainer"
+                android:textColor="?attr/colorOnErrorContainer"
                android:gravity="center"
                android:paddingTop="6dp"
                android:paddingBottom="6dp"
@@ -48,12 +48,28 @@
                android:paddingBottom="16dp"
                android:clipToPadding="false" />

+            <LinearLayout
+                android:id="@+id/skeletonContainer"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:orientation="vertical"
+                android:visibility="gone">
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+            </LinearLayout>
+
            <TextView
                android:id="@+id/emptyView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
-                android:text="No transactions found"
+                android:text="@string/transactions_empty"
                android:textAppearance="?attr/textAppearanceBodyMedium"
                android:textColor="?attr/colorOnSurfaceVariant"
                android:visibility="gone" />
@@ -49,7 +49,7 @@
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
-            android:text="No recent transfers"
+            android:text="@string/activities_empty"
            android:textAppearance="?attr/textAppearanceBodyMedium"
            android:textColor="?attr/colorOnSurfaceVariant"
            android:visibility="gone" />
@@ -38,7 +38,7 @@
            android:layout_marginBottom="16dp"
            android:clickable="true"
            android:focusable="true"
-            app:cardCornerRadius="16dp"
+            app:cardCornerRadius="@dimen/card_radius_lg"
            app:strokeWidth="1dp"
            app:strokeColor="?attr/colorOutline">

@@ -81,7 +81,7 @@
            android:layout_marginBottom="16dp"
            android:clickable="true"
            android:focusable="true"
-            app:cardCornerRadius="16dp"
+            app:cardCornerRadius="@dimen/card_radius_lg"
            app:strokeWidth="1dp"
            app:strokeColor="?attr/colorOutline">

@@ -125,7 +125,7 @@
            android:layout_marginBottom="16dp"
            android:clickable="true"
            android:focusable="true"
-            app:cardCornerRadius="16dp"
+            app:cardCornerRadius="@dimen/card_radius_lg"
            app:strokeWidth="1dp"
            app:strokeColor="?attr/colorOutline">

@@ -117,8 +117,8 @@
            android:layout_marginBottom="8dp"
            android:visibility="invisible"
            app:cardBackgroundColor="?attr/colorSecondaryContainer"
-            app:cardCornerRadius="12dp"
-            app:cardElevation="0dp">
+            app:cardCornerRadius="@dimen/card_radius_md"
+            app:cardElevation="@dimen/card_elevation_flat">

            <LinearLayout
                android:layout_width="match_parent"
@@ -21,7 +21,7 @@
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
-        android:padding="16dp">
+        android:padding="@dimen/screen_margin">

        <!-- Balance cards row -->
        <LinearLayout
@@ -34,8 +34,8 @@
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginEnd="8dp"
-                app:cardElevation="1dp"
-                app:cardCornerRadius="12dp">
+                app:cardElevation="@dimen/card_elevation_raised"
+                app:cardCornerRadius="@dimen/card_radius_md">

                <LinearLayout
                    android:layout_width="match_parent"
@@ -56,7 +56,8 @@
                        android:layout_height="wrap_content"
                        android:layout_marginTop="4dp"
                        android:text="MVR —"
-                        android:textAppearance="?attr/textAppearanceTitleMedium" />
+                        android:textAppearance="?attr/textAppearanceTitleMedium"
+                        android:fontFeatureSettings="tnum" />

                </LinearLayout>

@@ -67,8 +68,8 @@
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginStart="8dp"
-                app:cardElevation="1dp"
-                app:cardCornerRadius="12dp">
+                app:cardElevation="@dimen/card_elevation_raised"
+                app:cardCornerRadius="@dimen/card_radius_md">

                <LinearLayout
                    android:layout_width="match_parent"
@@ -89,7 +90,8 @@
                        android:layout_height="wrap_content"
                        android:layout_marginTop="4dp"
                        android:text="USD —"
-                        android:textAppearance="?attr/textAppearanceTitleMedium" />
+                        android:textAppearance="?attr/textAppearanceTitleMedium"
+                        android:fontFeatureSettings="tnum" />

                </LinearLayout>

@@ -112,8 +114,8 @@
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginEnd="8dp"
-                app:cardElevation="1dp"
-                app:cardCornerRadius="12dp">
+                app:cardElevation="@dimen/card_elevation_raised"
+                app:cardCornerRadius="@dimen/card_radius_md">

                <LinearLayout
                    android:layout_width="match_parent"
@@ -134,7 +136,8 @@
                        android:layout_height="wrap_content"
                        android:layout_marginTop="4dp"
                        android:text="MVR —"
-                        android:textAppearance="?attr/textAppearanceTitleMedium" />
+                        android:textAppearance="?attr/textAppearanceTitleMedium"
+                        android:fontFeatureSettings="tnum" />

                </LinearLayout>

@@ -146,8 +149,8 @@
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginStart="8dp"
-                app:cardElevation="1dp"
-                app:cardCornerRadius="12dp">
+                app:cardElevation="@dimen/card_elevation_raised"
+                app:cardCornerRadius="@dimen/card_radius_md">

                <LinearLayout
                    android:layout_width="match_parent"
@@ -168,7 +171,8 @@
                        android:layout_height="wrap_content"
                        android:layout_marginTop="4dp"
                        android:text="USD —"
-                        android:textAppearance="?attr/textAppearanceTitleMedium" />
+                        android:textAppearance="?attr/textAppearanceTitleMedium"
+                        android:fontFeatureSettings="tnum" />

                </LinearLayout>

@@ -191,8 +195,8 @@
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginEnd="8dp"
-                app:cardElevation="1dp"
-                app:cardCornerRadius="12dp"
+                app:cardElevation="@dimen/card_elevation_raised"
+                app:cardCornerRadius="@dimen/card_radius_md"
                app:cardBackgroundColor="?attr/colorErrorContainer"
                android:visibility="gone">

@@ -216,7 +220,8 @@
                        android:layout_marginTop="4dp"
                        android:text="MVR —"
                        android:textAppearance="?attr/textAppearanceTitleMedium"
-                        android:textColor="?attr/colorOnErrorContainer" />
+                        android:textColor="?attr/colorOnErrorContainer"
+                        android:fontFeatureSettings="tnum" />

                    <TextView
                        android:id="@+id/tvBlockedSecondary"
@@ -225,6 +230,7 @@
                        android:layout_marginTop="2dp"
                        android:textAppearance="?attr/textAppearanceLabelSmall"
                        android:textColor="?attr/colorOnErrorContainer"
+                        android:fontFeatureSettings="tnum"
                        android:alpha="0.75"
                        android:visibility="gone" />

@@ -238,8 +244,8 @@
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginStart="8dp"
-                app:cardElevation="1dp"
-                app:cardCornerRadius="12dp"
+                app:cardElevation="@dimen/card_elevation_raised"
+                app:cardCornerRadius="@dimen/card_radius_md"
                app:cardBackgroundColor="?attr/colorErrorContainer"
                android:clickable="true"
                android:focusable="true"
@@ -265,7 +271,8 @@
                        android:layout_marginTop="4dp"
                        android:text="MVR —"
                        android:textAppearance="?attr/textAppearanceTitleMedium"
-                        android:textColor="?attr/colorOnErrorContainer" />
+                        android:textColor="?attr/colorOnErrorContainer"
+                        android:fontFeatureSettings="tnum" />

                </LinearLayout>

@@ -279,8 +286,8 @@
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
-            app:cardElevation="1dp"
-            app:cardCornerRadius="12dp"
+            app:cardElevation="@dimen/card_elevation_raised"
+            app:cardCornerRadius="@dimen/card_radius_md"
            android:clickable="true"
            android:focusable="true">

@@ -303,7 +310,8 @@
                    android:layout_height="wrap_content"
                    android:layout_marginTop="4dp"
                    android:text="MVR —"
-                    android:textAppearance="?attr/textAppearanceTitleMedium" />
+                    android:textAppearance="?attr/textAppearanceTitleMedium"
+                    android:fontFeatureSettings="tnum" />

            </LinearLayout>

@@ -52,7 +52,7 @@
                android:layout_marginBottom="12dp"
                android:clickable="true"
                android:focusable="true"
-                app:cardCornerRadius="16dp"
+                app:cardCornerRadius="@dimen/card_radius_lg"
                app:strokeWidth="1dp"
                app:strokeColor="?attr/colorOutline">
                <LinearLayout
@@ -94,7 +94,7 @@
                android:layout_height="wrap_content"
                android:clickable="true"
                android:focusable="true"
-                app:cardCornerRadius="16dp"
+                app:cardCornerRadius="@dimen/card_radius_lg"
                app:strokeWidth="1dp"
                app:strokeColor="?attr/colorOutline">
                <LinearLayout
@@ -49,12 +49,28 @@
                android:paddingBottom="16dp"
                android:clipToPadding="false" />

+            <LinearLayout
+                android:id="@+id/skeletonContainer"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:orientation="vertical"
+                android:visibility="gone">
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+                <include layout="@layout/item_skeleton_transaction" />
+            </LinearLayout>
+
            <TextView
                android:id="@+id/emptyView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
-                android:text="No transactions found"
+                android:text="@string/transactions_empty"
                android:textAppearance="?attr/textAppearanceBodyMedium"
                android:textColor="?attr/colorOnSurfaceVariant"
                android:visibility="gone" />
@@ -9,8 +9,8 @@
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
-        android:paddingHorizontal="16dp"
-        android:paddingVertical="14dp"
+        android:paddingHorizontal="@dimen/list_item_padding_h"
+        android:paddingVertical="@dimen/list_item_padding_v"
        android:gravity="center_vertical"
        android:foreground="?attr/selectableItemBackground">

@@ -70,7 +70,8 @@
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?attr/textAppearanceTitleSmall"
-                android:textColor="?attr/colorOnSurface" />
+                android:textColor="?attr/colorOnSurface"
+                android:fontFeatureSettings="tnum" />

            <TextView
                android:id="@+id/tvBlocked"
@@ -79,6 +80,7 @@
                android:layout_marginTop="2dp"
                android:textAppearance="?attr/textAppearanceLabelSmall"
                android:textColor="?attr/colorError"
+                android:fontFeatureSettings="tnum"
                android:visibility="gone" />

            <ImageButton
@@ -15,6 +15,7 @@
        android:scaleType="fitCenter"
        android:layout_marginEnd="10dp"
        android:visibility="gone"
+        android:importantForAccessibility="no"
        app:shapeAppearanceOverlay="@style/ShapeAppearance.Circle"
        xmlns:app="http://schemas.android.com/apk/res-auto" />

@@ -49,7 +50,8 @@
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?attr/textAppearanceBodySmall"
-                android:textColor="?attr/colorOnSurface" />
+                android:textColor="?attr/colorOnSurface"
+                android:fontFeatureSettings="tnum" />

        </LinearLayout>

@@ -7,8 +7,8 @@
    android:layout_marginHorizontal="16dp"
    android:layout_marginTop="12dp"
    android:layout_marginBottom="8dp"
-    app:cardCornerRadius="16dp"
-    app:cardElevation="0dp"
+    app:cardCornerRadius="@dimen/card_radius_lg"
+    app:cardElevation="@dimen/card_elevation_flat"
    app:strokeWidth="1dp"
    app:strokeColor="?attr/colorOutlineVariant">

@@ -114,7 +114,8 @@
                    android:layout_height="wrap_content"
                    android:textAppearance="?attr/textAppearanceTitleMedium"
                    android:textColor="?attr/colorOnSurface"
-                    android:layout_marginTop="2dp" />
+                    android:layout_marginTop="2dp"
+                    android:fontFeatureSettings="tnum" />

            </LinearLayout>

@@ -137,7 +138,8 @@
                    android:layout_height="wrap_content"
                    android:textAppearance="?attr/textAppearanceTitleMedium"
                    android:textColor="?attr/colorOnSurface"
-                    android:layout_marginTop="2dp" />
+                    android:layout_marginTop="2dp"
+                    android:fontFeatureSettings="tnum" />

            </LinearLayout>

@@ -162,7 +164,8 @@
                    android:layout_height="wrap_content"
                    android:textAppearance="?attr/textAppearanceTitleMedium"
                    android:textColor="?attr/colorError"
-                    android:layout_marginTop="2dp" />
+                    android:layout_marginTop="2dp"
+                    android:fontFeatureSettings="tnum" />

            </LinearLayout>

@@ -5,8 +5,10 @@
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="12dp"
-    app:cardCornerRadius="16dp"
-    app:cardElevation="0dp"
+    android:clickable="true"
+    android:focusable="true"
+    app:cardCornerRadius="@dimen/card_radius_lg"
+    app:cardElevation="@dimen/card_elevation_flat"
    app:strokeWidth="1dp"
    app:strokeColor="?attr/colorOutlineVariant">

@@ -51,11 +53,7 @@
                android:id="@+id/tvLoanStatus"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
-                android:paddingHorizontal="10dp"
-                android:paddingVertical="4dp"
-                android:background="@drawable/chip_background"
-                android:textAppearance="?attr/textAppearanceLabelSmall"
-                android:textColor="?attr/colorOnSecondaryContainer" />
+                style="@style/Widget.App.StatusChip" />

        </LinearLayout>

@@ -9,8 +9,8 @@
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
-        android:paddingHorizontal="16dp"
-        android:paddingVertical="14dp"
+        android:paddingHorizontal="@dimen/list_item_padding_h"
+        android:paddingVertical="@dimen/list_item_padding_v"
        android:gravity="center_vertical"
        android:foreground="?attr/selectableItemBackground">

@@ -83,7 +83,8 @@
                android:layout_height="wrap_content"
                android:textAppearance="?attr/textAppearanceTitleSmall"
                android:textColor="?attr/colorOnSurface"
-                android:layout_marginTop="6dp" />
+                android:layout_marginTop="6dp"
+                android:fontFeatureSettings="tnum" />

            <ImageButton
                android:id="@+id/btnTransfer"
@@ -5,8 +5,10 @@
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="12dp"
-    app:cardCornerRadius="16dp"
-    app:cardElevation="0dp"
+    android:clickable="true"
+    android:focusable="true"
+    app:cardCornerRadius="@dimen/card_radius_lg"
+    app:cardElevation="@dimen/card_elevation_flat"
    app:strokeWidth="1dp"
    app:strokeColor="?attr/colorOutlineVariant">

@@ -51,11 +53,7 @@
                android:id="@+id/tvStatus"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
-                android:paddingHorizontal="10dp"
-                android:paddingVertical="4dp"
-                android:background="@drawable/chip_background"
-                android:textAppearance="?attr/textAppearanceLabelSmall"
-                android:textColor="?attr/colorOnSecondaryContainer" />
+                style="@style/Widget.App.StatusChip" />

        </LinearLayout>

@@ -5,8 +5,10 @@
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
-    app:cardElevation="1dp"
-    app:cardCornerRadius="12dp">
+    android:clickable="true"
+    android:focusable="true"
+    app:cardElevation="@dimen/card_elevation_raised"
+    app:cardCornerRadius="@dimen/card_radius_md">

    <LinearLayout
        android:layout_width="match_parent"
@@ -5,15 +5,16 @@
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:gravity="center_vertical"
-    android:paddingHorizontal="16dp"
-    android:paddingVertical="14dp"
+    android:paddingHorizontal="@dimen/list_item_padding_h"
+    android:paddingVertical="@dimen/list_item_padding_v"
    android:background="?attr/selectableItemBackground">

    <ImageView
        android:id="@+id/ivIcon"
        android:layout_width="24dp"
        android:layout_height="24dp"
-        android:layout_marginEnd="16dp" />
+        android:layout_marginEnd="16dp"
+        android:importantForAccessibility="no" />

    <LinearLayout
        android:layout_width="0dp"
@@ -13,7 +13,8 @@
        android:id="@+id/ivNavIcon"
        android:layout_width="28dp"
        android:layout_height="28dp"
-        android:layout_marginBottom="6dp" />
+        android:layout_marginBottom="6dp"
+        android:importantForAccessibility="no" />

    <TextView
        android:id="@+id/tvNavLabel"
@@ -6,8 +6,8 @@
    android:layout_height="wrap_content"
    android:layout_marginHorizontal="16dp"
    android:layout_marginBottom="12dp"
-    app:cardCornerRadius="16dp"
-    app:cardElevation="2dp">
+    app:cardCornerRadius="@dimen/card_radius_lg"
+    app:cardElevation="@dimen/card_elevation_raised">

    <LinearLayout
        android:layout_width="match_parent"
@@ -16,6 +16,7 @@
        android:layout_width="44dp"
        android:layout_height="44dp"
        android:scaleType="centerCrop"
+        android:importantForAccessibility="no"
        app:shapeAppearanceOverlay="@style/ShapeAppearance.Circle" />

    <LinearLayout
@@ -53,6 +54,7 @@
        android:layout_height="wrap_content"
        android:textAppearance="?attr/textAppearanceTitleMedium"
        android:textColor="?attr/colorOnSurface"
+        android:fontFeatureSettings="tnum"
        android:paddingHorizontal="8dp"
        android:visibility="gone" />

@@ -20,10 +20,6 @@
        android:id="@+id/tvProfileType"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
-        android:paddingHorizontal="10dp"
-        android:paddingVertical="4dp"
-        android:background="@drawable/chip_background"
-        android:textAppearance="?attr/textAppearanceLabelSmall"
-        android:textColor="?attr/colorOnSecondaryContainer" />
+        style="@style/Widget.App.StatusChip" />

 </LinearLayout>
@@ -86,6 +86,7 @@
        android:layout_height="wrap_content"
        android:textAppearance="?attr/textAppearanceTitleSmall"
        android:textStyle="bold"
+        android:fontFeatureSettings="tnum"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="@id/fvAvatar"
        app:layout_constraintBottom_toBottomOf="@id/fvAvatar" />
@@ -65,8 +65,8 @@
            android:layout_height="wrap_content"
            android:layout_marginBottom="12dp"
            android:visibility="gone"
-            app:cardCornerRadius="12dp"
-            app:cardElevation="2dp">
+            app:cardCornerRadius="@dimen/card_radius_md"
+            app:cardElevation="@dimen/card_elevation_raised">

            <LinearLayout
                android:layout_width="match_parent"
@@ -5,4 +5,36 @@
    <dimen name="nav_header_vertical_spacing">8dp</dimen>
    <dimen name="nav_header_height">176dp</dimen>
    <dimen name="fab_margin">16dp</dimen>
-</resources>
+
+    <!-- ====== Design tokens ======================================== -->
+
+    <!-- Card surfaces.
+         Two-tier radius:
+           lg → hero/standalone cards (bank tiles, history header, finance deals, OTP cards)
+           md → repeating row/summary cards (dashboard cards, foreign limit, bottom sheets)
+         Card-visual representations (item_card_*) keep their own larger radius/elevation
+         to read as real credit cards — they are not tokenized. -->
+    <dimen name="card_radius_lg">16dp</dimen>
+    <dimen name="card_radius_md">12dp</dimen>
+
+    <!-- Card elevation. Two tiers:
+           flat   → outlined cards (paired with a colorOutlineVariant stroke)
+           raised → subtle Material 3 default raise
+         Larger elevations belong to specific card-visual surfaces only. -->
+    <dimen name="card_elevation_flat">0dp</dimen>
+    <dimen name="card_elevation_raised">1dp</dimen>
+
+    <!-- Screen-level spacing -->
+    <dimen name="screen_margin">16dp</dimen>
+    <dimen name="section_gap">16dp</dimen>
+
+    <!-- Standard list/row padding -->
+    <dimen name="list_item_padding_h">16dp</dimen>
+    <dimen name="list_item_padding_v">14dp</dimen>
+
+    <!-- Gutters: small inline spacing units -->
+    <dimen name="gutter_xs">2dp</dimen>
+    <dimen name="gutter_sm">4dp</dimen>
+    <dimen name="gutter_md">8dp</dimen>
+    <dimen name="gutter_lg">12dp</dimen>
+</resources>
@@ -255,6 +255,8 @@

    <!-- Accounts -->
    <string name="accounts_empty">No accounts found</string>
+    <string name="activities_empty">No recent transfers</string>
+    <string name="transactions_empty">No transactions found</string>

    <!-- Contacts -->
    <string name="contacts_empty">No contacts found</string>
@@ -1,6 +1,15 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
    <style name="ShapeAppearance.Circle" parent="ShapeAppearance.Material3.Corner.Full" />

+    <!-- Reusable status chip (filled, secondary container). Apply to a TextView via style. -->
+    <style name="Widget.App.StatusChip" parent="">
+        <item name="android:paddingHorizontal">10dp</item>
+        <item name="android:paddingVertical">4dp</item>
+        <item name="android:background">@drawable/chip_background</item>
+        <item name="android:textAppearance">?attr/textAppearanceLabelSmall</item>
+        <item name="android:textColor">?attr/colorOnSecondaryContainer</item>
+    </style>
+
    <style name="Theme.BasedBank" parent="Theme.Material3.DayNight.NoActionBar">
        <item name="colorPrimary">@color/seed_primary</item>
        <item name="colorSecondary">@color/seed_secondary</item>
Author	SHA1	Message	Date
ahusan	045eb1b1a2	ui: pass 3 — skeleton loading, a11y, snackbars, dark mode Skeleton loading state: * Wire item_skeleton_transaction (previously dormant in res) into AccountHistoryFragment and TransferHistoryFragment. When a load starts with no cached transactions, 8 skeleton rows appear under the search bar instead of a blank screen. Skeleton hides as soon as transactions arrive or the load completes. * Decision: ActivitiesFragment loads from local storage synchronously, so no skeleton there — would only flash for a frame. Accessibility: * Decorative icons in item_more_nav, item_nav_slot, item_picker_row, and item_account_dropdown now declare importantForAccessibility="no" so TalkBack skips them (the adjacent text label conveys meaning). * Also added tnum to item_picker_row.tvBalance and item_account_dropdown.tvDropdownBalance — missed amounts from Pass 2. Snackbar: * ContactsFragment.deleteContact's success/failure feedback is now a Snackbar instead of Toast — the fragment stays visible, so a bottom-anchored Snackbar fits better than a floating Toast. * Other Toasts are either followed by navigation away (Snackbar couldn't display), or purely informational ("copied", "press back to exit") where Toast is the right primitive. Left as-is. Dark mode: * Connectivity banner in activity_home no longer hardcodes #C62828 / #FFFFFF — uses colorErrorContainer / colorOnErrorContainer so it adapts to the user's theme. * Other hex literals (card-artwork text, receipt screens that intentionally emulate paper) are intentional and stay. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	2026-05-28 18:02:50 +05:00
ahusan	22806da1b3	ui: pass 2 — pill style, tabular figures, ripple feedback, empty strings Status pills: * New Widget.App.StatusChip style bundling the 10dp/4dp padding + chip_background + label-small text used in 3 places (item_bml_loan, item_finance_deal, item_profile_header). The 3 layouts now apply the style instead of repeating 4 attributes each. * Extract the bindCardStatus card-overlay pill background from inline GradientDrawable code into a real drawable resource (card_overlay_pill_bg.xml). PayWithCardFragment.bindCardStatus just sets a background resource now. Tabular figures (android:fontFeatureSettings="tnum"): * Applied to amount TextViews on the highest-traffic surfaces — transactions list, accounts list, card list, dashboard balance / credit / blocked / overdue / pending finances totals, and the account history header (available / balance / blocked). * Digits become same-width, so right-aligned amounts in a column line up. Ripple feedback: * item_finance_deal, item_bml_loan, item_foreign_limit get android:clickable="true" android:focusable="true" so their MaterialCardView roots show the M3 ripple when the adapter attaches a click listener. All three are clickable from code but were missing the ripple cue. Empty-state strings: * Hardcoded "No recent transfers" / "No transactions found" in fragment_activities, fragment_transfer_history, and fragment_account_history moved to strings.xml as activities_empty / transactions_empty, matching the existing accounts_empty / contacts_empty / financing_empty pattern. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	2026-05-28 17:48:23 +05:00
ahusan	29ac4352ff	ui: swap list-item and screen-margin paddings onto tokens Replaces hardcoded paddings in the three layouts that share the standard 16dp/14dp list-row pattern (item_account, item_card, item_more_nav) with @dimen/list_item_padding_h / list_item_padding_v. Dashboard root content padding becomes @dimen/screen_margin. Card content paddings inside the dashboard are left as raw 16dp — they're a separate semantic (card-interior padding, not screen edge) and will be addressed once we either need a distinct token or have a reason to change them. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	2026-05-28 17:32:18 +05:00
ahusan	df892ec8d5	ui: tokenize card surfaces in dimens.xml and sweep layouts Introduces a small set of design tokens for card surfaces so the same look is enforced everywhere instead of being hand-tuned per layout: card_radius_lg / card_radius_md — 16dp / 12dp two-tier radius card_elevation_flat / *_raised — 0dp outlined / 1dp subtle raise Sweeps the existing layouts onto these tokens. Two-tier policy: lg → hero/standalone cards (account history header, bml loan, finance deal, otp card, bank selection tiles, security setup options) md → repeating row/summary cards (dashboard summary cards, credentials inset, foreign limit, add-contact sheet) Card-visual representations (item_card_dashboard / _stack / _wallet / _settings_entry) deliberately keep their bespoke radius/elevation so they continue to read as credit cards — the tokens are for content cards only. Tight inset frames inside fragment_bml_qr_pay and fragment_transfer also remain on 4dp/0dp as form details. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	2026-05-28 17:20:16 +05:00