tweak account card design
closes sk22#731
This commit is contained in:
21
mastodon/src/main/res/drawable/bg_filled_card.xml
Normal file
21
mastodon/src/main/res/drawable/bg_filled_card.xml
Normal file
@@ -0,0 +1,21 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<item>
|
||||
<color android:color="?colorM3Surface"/>
|
||||
</item>
|
||||
<item>
|
||||
<shape android:tint="?colorM3Primary">
|
||||
<solid android:color="?colorFilledCardAlpha"/>
|
||||
</shape>
|
||||
</item>
|
||||
<item>
|
||||
<ripple android:color="@color/m3_on_surface_variant_overlay">
|
||||
<item android:id="@android:id/mask">
|
||||
<shape>
|
||||
<solid android:color="#000"/>
|
||||
<corners android:radius="4dp"/>
|
||||
</shape>
|
||||
</item>
|
||||
</ripple>
|
||||
</item>
|
||||
</layer-list>
|
||||
@@ -1,5 +0,0 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<shape xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<corners android:radius="26dp"/>
|
||||
<stroke android:width="4dp" android:color="?colorM3Surface"/>
|
||||
</shape>
|
||||
@@ -3,74 +3,114 @@
|
||||
xmlns:tools="http://schemas.android.com/tools"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:background="?colorM3SurfaceVariant"
|
||||
android:elevation="2dp"
|
||||
android:paddingBottom="0dp">
|
||||
android:background="@drawable/bg_filled_card">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/cover"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="128dp"
|
||||
android:layout_marginTop="4dp"
|
||||
android:layout_marginLeft="4dp"
|
||||
android:layout_marginRight="4dp"
|
||||
android:layout_marginTop="6dp"
|
||||
android:layout_marginLeft="6dp"
|
||||
android:layout_marginRight="6dp"
|
||||
android:scaleType="centerCrop"
|
||||
tools:src="#0f0"/>
|
||||
|
||||
<View
|
||||
android:id="@+id/avatar_border"
|
||||
android:layout_width="60dp"
|
||||
android:layout_height="60dp"
|
||||
<FrameLayout
|
||||
android:id="@+id/avatar_wrap"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_below="@id/cover"
|
||||
android:layout_alignParentStart="true"
|
||||
android:layout_marginTop="-6dp"
|
||||
android:layout_marginStart="14dp"
|
||||
android:background="@drawable/discover_ava_bg"/>
|
||||
android:layout_marginTop="-12dp"
|
||||
android:layout_marginStart="13dp"
|
||||
android:layout_marginEnd="12dp">
|
||||
|
||||
<ImageView
|
||||
android:id="@+id/avatar"
|
||||
android:layout_width="56dp"
|
||||
android:layout_height="56dp"
|
||||
android:layout_below="@id/cover"
|
||||
android:layout_alignParentStart="true"
|
||||
android:layout_marginStart="16dp"
|
||||
android:layout_marginTop="-4dp"
|
||||
android:scaleType="centerCrop"
|
||||
tools:src="#f00" />
|
||||
<View
|
||||
android:id="@+id/avatar_border"
|
||||
android:layout_gravity="center"
|
||||
android:layout_width="66dp"
|
||||
android:layout_height="66dp"
|
||||
android:background="@drawable/bg_filled_card"/>
|
||||
|
||||
<TextView
|
||||
android:id="@+id/name"
|
||||
<ImageView
|
||||
android:id="@+id/avatar"
|
||||
android:layout_gravity="center"
|
||||
android:layout_width="60dp"
|
||||
android:layout_height="60dp"
|
||||
android:scaleType="centerCrop"
|
||||
tools:src="#f00" />
|
||||
|
||||
</FrameLayout>
|
||||
|
||||
|
||||
<org.joinmastodon.android.ui.views.HeaderSubtitleLinearLayout
|
||||
android:id="@+id/name_wrap"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="24dp"
|
||||
android:layout_toEndOf="@id/avatar"
|
||||
android:layout_below="@id/cover"
|
||||
android:layout_marginStart="16dp"
|
||||
android:layout_marginTop="8dp"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_toEndOf="@id/avatar_wrap"
|
||||
android:layout_marginEnd="16dp"
|
||||
android:singleLine="true"
|
||||
android:ellipsize="end"
|
||||
android:gravity="center_vertical"
|
||||
android:textAppearance="@style/m3_title_medium"
|
||||
tools:text="Eugen"/>
|
||||
android:layout_above="@+id/username">
|
||||
|
||||
<TextView
|
||||
android:id="@+id/name"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:ellipsize="end"
|
||||
android:singleLine="true"
|
||||
android:textAppearance="@style/m3_title_medium"
|
||||
android:textColor="?colorM3OnSurface"
|
||||
android:gravity="start|center_vertical"
|
||||
tools:text="Eugen" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/pronouns"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="8sp"
|
||||
android:maxWidth="161sp"
|
||||
android:ellipsize="end"
|
||||
android:singleLine="true"
|
||||
android:textAppearance="@style/m3_title_medium"
|
||||
android:fontFamily="sans-serif"
|
||||
android:textAlignment="viewStart"
|
||||
android:textColor="?colorM3OnSurface"
|
||||
tools:text="they/them" />
|
||||
|
||||
<TextView
|
||||
android:id="@+id/extra_text"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_marginStart="8sp"
|
||||
android:ellipsize="end"
|
||||
android:singleLine="true"
|
||||
android:textAppearance="@style/m3_title_medium"
|
||||
android:fontFamily="sans-serif"
|
||||
android:textAlignment="viewStart"
|
||||
android:textColor="?colorM3OnSurface"
|
||||
tools:text="boosted your cat picture" />
|
||||
|
||||
</org.joinmastodon.android.ui.views.HeaderSubtitleLinearLayout>
|
||||
|
||||
<TextView
|
||||
android:id="@+id/username"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_alignStart="@id/name"
|
||||
android:layout_alignEnd="@id/name"
|
||||
android:layout_below="@id/name"
|
||||
android:layout_alignBottom="@id/avatar_wrap"
|
||||
android:layout_marginEnd="16dp"
|
||||
android:layout_toEndOf="@id/avatar_wrap"
|
||||
android:layout_marginBottom="3sp"
|
||||
android:textAlignment="viewStart"
|
||||
android:singleLine="true"
|
||||
android:ellipsize="end"
|
||||
android:gravity="center_vertical"
|
||||
android:textAppearance="@style/m3_title_small"
|
||||
android:textAppearance="@style/m3_body_medium"
|
||||
android:textColor="?colorM3OnSurfaceVariant"
|
||||
tools:text="\@Gargron@mastodon.social"/>
|
||||
|
||||
<TextView
|
||||
android:id="@+id/bio"
|
||||
android:layout_width="match_parent"
|
||||
android:layout_height="wrap_content"
|
||||
android:layout_below="@id/avatar"
|
||||
android:layout_below="@id/avatar_wrap"
|
||||
android:layout_marginLeft="16dp"
|
||||
android:layout_marginRight="16dp"
|
||||
android:layout_marginTop="8dp"
|
||||
|
||||
@@ -40,7 +40,7 @@
|
||||
<color name="m3_neutral2_100">@android:color/system_neutral2_100</color>
|
||||
<color name="m3_neutral2_50t">@android:color/system_neutral2_50</color>
|
||||
<color name="m3_neutral2_50">@android:color/system_neutral2_50</color>
|
||||
<color name="m3_neutral2_25">@android:color/system_neutral2_10</color>
|
||||
<color name="m3_neutral2_10">@android:color/system_neutral2_10</color>
|
||||
|
||||
<color name="m3_accent2_25">@android:color/system_accent2_10</color>
|
||||
<color name="m3_accent2_50">@android:color/system_accent2_50</color>
|
||||
|
||||
@@ -35,6 +35,7 @@
|
||||
<attr name="colorProfileHeaderBackground" format="color"/>
|
||||
<attr name="colorM3DarkOnSurface" format="color" />
|
||||
<attr name="colorTabBarAlpha" format="color" />
|
||||
<attr name="colorFilledCardAlpha" format="color" />
|
||||
|
||||
<attr name="colorPrimary25" format="color" />
|
||||
<attr name="colorPrimary50" format="color" />
|
||||
|
||||
@@ -125,7 +125,7 @@
|
||||
<color name="m3_neutral2_100">@color/gray_100</color>
|
||||
<color name="m3_neutral2_50t">@color/gray_50t</color>
|
||||
<color name="m3_neutral2_50">@color/gray_50</color>
|
||||
<color name="m3_neutral2_25">@color/gray_25</color>
|
||||
<color name="m3_neutral2_10">@color/gray_25</color>
|
||||
|
||||
<color name="m3_accent1_25">@color/primary_25</color>
|
||||
<color name="m3_accent1_50">@color/primary_50</color>
|
||||
|
||||
@@ -28,6 +28,7 @@
|
||||
</style>
|
||||
|
||||
<style name="ColorPalette">
|
||||
<!-- https://m3.material.io/styles/color/the-color-system/tokens -->
|
||||
<item name="colorM3Primary">?colorPrimary600</item>
|
||||
<item name="colorM3OnPrimary">@color/white</item>
|
||||
<item name="colorM3PrimaryContainer">?colorPrimary100</item>
|
||||
@@ -56,6 +57,7 @@
|
||||
<item name="colorBoost">?colorM3Primary</item>
|
||||
<item name="colorPoll">@color/bookmark_selected</item>
|
||||
<item name="colorTabBarAlpha">#14000000</item>
|
||||
<item name="colorFilledCardAlpha">#30000000</item>
|
||||
|
||||
<item name="colorM3DisabledBackground">#1F1F1F1F</item>
|
||||
<item name="colorM3Error">#B3261E</item>
|
||||
@@ -151,6 +153,7 @@
|
||||
<item name="colorM3SurfaceVariant">?colorNeutral900</item>
|
||||
<item name="colorM3SecondaryContainer">?colorNeutral800</item>
|
||||
<item name="colorTabBarAlpha">#00000000</item>
|
||||
<item name="colorFilledCardAlpha">#00000000</item>
|
||||
</style>
|
||||
|
||||
<style name="ColorPalette.Material3">
|
||||
@@ -238,7 +241,7 @@
|
||||
<item name="colorNeutral100">@color/m3_neutral2_100</item>
|
||||
<item name="colorNeutral50t">@color/m3_neutral2_50t</item>
|
||||
<item name="colorNeutral50">@color/m3_neutral2_50</item>
|
||||
<item name="colorNeutral25">@color/m3_neutral2_25</item>
|
||||
<item name="colorNeutral25">@color/m3_neutral2_10</item>
|
||||
</style>
|
||||
|
||||
<style name="ColorPalette.Material3.Dark">
|
||||
|
||||
@@ -372,4 +372,8 @@
|
||||
<string name="sk_duration_days_3">3 days</string>
|
||||
<string name="sk_duration_days_7">7 days</string>
|
||||
<string name="sk_notification_mention">You were mentioned by %s</string>
|
||||
<plurals name="sk_posts_count_label">
|
||||
<item quantity="one">post</item>
|
||||
<item quantity="other">posts</item>
|
||||
</plurals>
|
||||
</resources>
|
||||
Reference in New Issue
Block a user