DROID-3618 App | Design fixes (#2370)

2025-06-08 05:47:05 +09:00 · 2025-04-30 10:06:37 +02:00 · 2025-04-30 10:06:37 +02:00 · 5f65ad04ae
commit 5f65ad04ae
parent 781e758292
17 changed files with 235 additions and 299 deletions
--- a/app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreenToolbar.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreenToolbar.kt
@ -46,7 +46,7 @@ fun HomeScreenToolbar(
    ) {

        Image(
-            painter = painterResource(R.drawable.ic_home_top_toolbar_back),
+            painter = painterResource(R.drawable.ic_default_top_back),
            contentDescription = "Back button",
            modifier = Modifier
                .padding(start = 16.dp)
@ -122,7 +122,7 @@ fun HomeScreenToolbar(
            contentDescription = "Settings icon",
            modifier = Modifier
                .align(Alignment.CenterEnd)
-                .padding(end = 16.dp)
+                .padding(end = 17.dp)
                .noRippleClickable {
                    onSettingsClicked()
                }
--- a/app/src/main/java/com/anytypeio/anytype/ui/primitives/ObjectTypeFragment.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/primitives/ObjectTypeFragment.kt
@ -132,7 +132,6 @@ class ObjectTypeFragment : BaseComposeFragment() {
            composable(route = OBJ_TYPE_MAIN) {
                val showPropertiesScreen = vm.showPropertiesScreen.collectAsStateWithLifecycle().value
                WithSetScreen(
-                    uiEditButtonState = vm.uiEditButtonState.collectAsStateWithLifecycle().value,
                    uiSyncStatusBadgeState = vm.uiSyncStatusBadgeState.collectAsStateWithLifecycle().value,
                    uiIconState = vm.uiIconState.collectAsStateWithLifecycle().value,
                    uiTitleState = vm.uiTitleState.collectAsStateWithLifecycle().value,
--- a/app/src/main/java/com/anytypeio/anytype/ui/primitives/WithSetScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/primitives/WithSetScreen.kt
@ -52,7 +52,6 @@ import com.anytypeio.anytype.ui.sets.ObjectSetFragment
@Composable
 fun WithSetScreen(
    //top bar
-    uiEditButtonState: UiEditButton,
    uiSyncStatusBadgeState: UiSyncStatusBadgeState,
    uiSyncStatusState: SyncStatusWidgetState,
    //header
@ -84,9 +83,6 @@ fun WithSetScreen(
        topBar = {
            TopBarContent(
                uiSyncStatusBadgeState = uiSyncStatusBadgeState,
-                uiEditButtonState = uiEditButtonState,
-                uiTitleState = uiTitleState,
-                topBarScrollBehavior = topAppBarScrollBehavior,
                onTypeEvent = { typeEvent ->
                    if (typeEvent is TypeEvent.OnBackClick) {
                        objectSetFragment.value?.onCloseCurrentObject()
--- a/app/src/main/java/com/anytypeio/anytype/ui/sets/ObjectSetFragment.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/sets/ObjectSetFragment.kt
@ -184,9 +184,6 @@ open class ObjectSetFragment :
    private val topToolbarThreeDotsIcon: ImageView
        get() = binding.topToolbar.root.findViewById(R.id.ivThreeDots)

-    private val topToolbarStatusText: TextView
-        get() = binding.topToolbar.root.findViewById(R.id.tvStatus)
-
    private val addNewButton: TextView
        get() = binding.dataViewHeader.addNewButton

@ -1046,7 +1043,6 @@ open class ObjectSetFragment :
            setBackgroundResource(R.drawable.rect_object_menu_button_default)
        }
        if (binding.root.currentState == R.id.start) {
-            topToolbarStatusText.setTextColor(Color.WHITE)
            topToolbarThreeDotsIcon.apply {
                imageTintList = ColorStateList.valueOf(Color.WHITE)
            }
@ -1057,7 +1053,6 @@ open class ObjectSetFragment :
        topToolbarThreeDotsButton.background = null
        topToolbarThreeDotsIcon.imageTintList = null
        topToolbarStatusContainer.background = null
-        topToolbarStatusText.setTextColor(requireContext().getColor(R.color.default_status_text_color))
    }

    private fun observeCommands(command: ObjectSetCommand) {
@ -1327,7 +1322,6 @@ open class ObjectSetFragment :
        override fun onTransitionCompleted(motionLayout: MotionLayout?, id: Int) {
            if (id == R.id.start) {
                title.pauseTextWatchers { title.enableEditMode() }
-                topToolbarStatusText.animate().alpha(1f).setDuration(DEFAULT_ANIM_DURATION).start()
                topToolbarTitle.animate().alpha(0f).setDuration(DEFAULT_ANIM_DURATION).start()
                topToolbarThreeDotsButton.apply {
                    if (background != null) {
@ -1340,13 +1334,11 @@ open class ObjectSetFragment :
                topToolbarStatusContainer.apply {
                    if (background != null) {
                        background?.alpha = DRAWABLE_ALPHA_FULL
-                        topToolbarStatusText.setTextColor(Color.WHITE)
                    }
                }
            }
            if (id == R.id.end) {
                title.pauseTextWatchers { title.enableReadMode() }
-                topToolbarStatusText.animate().alpha(0f).setDuration(DEFAULT_ANIM_DURATION).start()
                topToolbarTitle.animate().alpha(1f).setDuration(DEFAULT_ANIM_DURATION).start()
                binding.topToolbar.root.findViewById<ImageView>(R.id.ivThreeDots).apply {
                    imageTintList = null
@ -1356,9 +1348,6 @@ open class ObjectSetFragment :
                }
                topToolbarStatusContainer.apply {
                    background?.alpha = DRAWABLE_ALPHA_ZERO
-                    topToolbarStatusText.setTextColor(
-                        context.getColor(R.color.default_status_text_color)
-                    )
                }
            }
        }
--- a/app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt
+++ b/app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt
@ -28,6 +28,7 @@ import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.absolutePadding
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@ -37,6 +38,7 @@ import androidx.compose.foundation.layout.systemBars
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.windowInsetsPadding
 import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.rememberLazyListState
@ -85,6 +87,7 @@ import com.anytypeio.anytype.R
 import com.anytypeio.anytype.core_ui.common.keyboardAsState
 import com.anytypeio.anytype.core_ui.foundation.components.BottomNavigationMenu
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.foundation.noRippleThrottledClickable
 import com.anytypeio.anytype.core_ui.views.Caption1Regular
 import com.anytypeio.anytype.core_ui.views.PreviewTitle2Medium
 import com.anytypeio.anytype.core_ui.views.Relations3
@ -172,19 +175,27 @@ fun TopBar(
 ) {
    Box(
        modifier = Modifier
-            .padding(16.dp, 0.dp)
            .fillMaxWidth()
            .height(48.dp)
    ) {
-        Image(
-            painter = painterResource(R.drawable.ic_default_top_back),
-            contentDescription = stringResource(R.string.content_desc_back_button),
+        Box(
            modifier = Modifier
-                .align(Alignment.CenterStart)
-                .noRippleClickable { vm.onPrevClicked() }
-        )
+                .width(56.dp)
+                .fillMaxHeight()
+                .noRippleThrottledClickable {
+                    vm.onPrevClicked()
+                },
+            contentAlignment = Alignment.Center
+        ) {
+            Image(
+                modifier = Modifier.wrapContentSize(),
+                painter = painterResource(R.drawable.ic_default_top_back),
+                contentDescription = stringResource(R.string.content_desc_back_button)
+            )
+        }
        Text(
-            modifier = Modifier.align(Alignment.Center),
+            modifier = Modifier
+                .align(Alignment.Center),
            text = uiState.collectionName,
            style = Title1,
            color = colorResource(id = R.color.text_primary)
@ -194,7 +205,7 @@ fun TopBar(
                modifier = Modifier
                    .align(CenterEnd)
                    .noRippleClickable { vm.onActionClicked() }
-                    .padding(start = 16.dp, top = 12.dp, bottom = 12.dp),
+                    .padding(start = 16.dp, top = 12.dp, bottom = 12.dp, end = 16.dp),
                text = uiState.actionName,
                style = UXBody,
                color = colorResource(id = R.color.glyph_active)
@ -396,7 +407,7 @@ fun SearchBar(

    AndroidView(
        modifier = Modifier
-            .padding(16.dp, 6.dp)
+            .padding(horizontal = 16.dp, vertical = 10.dp)
            .fillMaxWidth(),
        factory = { context ->
            val view = LayoutInflater.from(context)
--- a/core-ui/src/main/java/com/anytypeio/anytype/core_ui/widgets/objectIcon/TypeIconView.kt
+++ b/core-ui/src/main/java/com/anytypeio/anytype/core_ui/widgets/objectIcon/TypeIconView.kt
@ -67,8 +67,10 @@ fun TypeIconView(
            val emoji = Emojifier.safeUri(icon.unicode)
            if (emoji != Emojifier.Config.EMPTY_URI) {
                EmojiIconView(
+                    modifier = modifier,
                    icon = ObjectIcon.Basic.Emoji(unicode = icon.unicode),
-                    backgroundSize = backgroundSize
+                    backgroundSize = backgroundSize,
+                    iconWithoutBackgroundMaxSize = 120.dp,
                )
            } else {
                val (imageVector, tint) = getDefaultIconAndTint(icon)
--- a/core-ui/src/main/res/drawable/ic_home_top_toolbar_back.xml
+++ b/core-ui/src/main/res/drawable/ic_home_top_toolbar_back.xml
@ -1,12 +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="M15,20L7,12L15,4"
-      android:strokeWidth="2"
-      android:strokeColor="@color/transparent_active_full_alpha"
-      android:strokeAlpha="0.4"
-      android:strokeLineCap="round"/>
-</vector>
--- a/core-ui/src/main/res/layout/layout_object_set_top_toolbar.xml
+++ b/core-ui/src/main/res/layout/layout_object_set_top_toolbar.xml
@ -8,10 +8,9 @@

    <FrameLayout
        android:id="@+id/topBackButton"
-        android:layout_width="28dp"
-        android:layout_height="28dp"
-        android:layout_gravity="center_vertical"
-        android:layout_marginStart="16dp">
+        android:layout_width="56dp"
+        android:layout_height="48dp"
+        android:layout_gravity="center_vertical">

        <ImageView
            android:id="@+id/ivTopBackButton"
@ -25,37 +24,21 @@
    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/statusContainer"
        android:layout_gravity="center_vertical|end"
-        android:paddingStart="10dp"
-        android:paddingEnd="10dp"
        android:layout_marginEnd="54dp"
-        android:layout_width="wrap_content"
+        android:layout_width="28dp"
        android:layout_height="28dp">

        <com.anytypeio.anytype.core_ui.widgets.StatusBadgeWidget
            android:id="@+id/statusBadge"
            android:layout_width="10dp"
            android:layout_height="10dp"
-            android:layout_gravity="center_vertical"
            android:backgroundTint="@color/orange"
            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            tools:visibility="visible" />

-        <TextView
-            android:id="@+id/tvStatus"
-            style="@style/TextView.UXStyle.Captions.1.Regular"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="center_vertical"
-            android:layout_marginStart="6dp"
-            android:textColor="@color/text_secondary"
-            app:layout_constraintBottom_toBottomOf="parent"
-            app:layout_constraintStart_toEndOf="@+id/statusBadge"
-            app:layout_constraintTop_toTopOf="parent"
-            app:layout_goneMarginStart="0dp"
-            tools:text="Syncing" />
-
    </androidx.constraintlayout.widget.ConstraintLayout>

    <FrameLayout
@ -93,7 +76,7 @@
        android:layout_width="28dp"
        android:layout_height="28dp"
        android:layout_gravity="end|center_vertical"
-        android:layout_marginEnd="12dp">
+        android:layout_marginEnd="14dp">

        <ImageView
            android:id="@+id/ivThreeDots"
--- a/core-ui/src/main/res/layout/widget_object_top_toolbar.xml
+++ b/core-ui/src/main/res/layout/widget_object_top_toolbar.xml
@ -5,10 +5,9 @@

    <FrameLayout
        android:id="@+id/topBackButton"
-        android:layout_width="28dp"
-        android:layout_height="28dp"
-        android:layout_gravity="center_vertical"
-        android:layout_marginStart="16dp">
+        android:layout_width="56dp"
+        android:layout_height="48dp"
+        android:layout_gravity="center_vertical">

        <ImageView
            android:id="@+id/ivTopBackButton"
@ -90,7 +89,7 @@
        android:layout_width="28dp"
        android:layout_height="28dp"
        android:layout_gravity="end|center_vertical"
-        android:layout_marginEnd="12dp">
+        android:layout_marginEnd="14dp">

        <ImageView
            android:id="@+id/ivThreeDots"
--- a/feature-all-content/src/main/java/com/anytypeio/anytype/feature_allcontent/ui/AllContentTopToolbar.kt
+++ b/feature-all-content/src/main/java/com/anytypeio/anytype/feature_allcontent/ui/AllContentTopToolbar.kt
@ -5,6 +5,7 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.gestures.snapping.rememberSnapFlingBehavior
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
@ -15,11 +16,9 @@ import androidx.compose.foundation.layout.wrapContentWidth
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material3.CenterAlignedTopAppBar
 import androidx.compose.material3.DropdownMenu
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Text
-import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@ -35,7 +34,6 @@ import androidx.compose.ui.unit.dp
 import com.anytypeio.anytype.core_models.DVSortType
 import com.anytypeio.anytype.core_ui.common.DefaultPreviews
 import com.anytypeio.anytype.core_ui.extensions.bouncingClickable
-import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
 import com.anytypeio.anytype.core_ui.foundation.noRippleThrottledClickable
 import com.anytypeio.anytype.core_ui.views.Title1
 import com.anytypeio.anytype.core_ui.views.Title2
@ -59,54 +57,42 @@ fun AllContentTopBarContainer(
    onBinClick: () -> Unit,
    onBackClick: () -> Unit
 ) {
-    var isMenuExpanded by remember { mutableStateOf(false) }
-
-    CenterAlignedTopAppBar(
-        modifier = Modifier.fillMaxWidth(),
-        expandedHeight = 48.dp,
-        title = { AllContentTitle(state = titleState) },
-        navigationIcon = {
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .height(48.dp)
+    ) {
+        Box(
+            modifier = Modifier
+                .width(56.dp)
+                .fillMaxHeight()
+                .noRippleThrottledClickable {
+                    onBackClick()
+                },
+            contentAlignment = Alignment.Center
+        ) {
            Image(
-                modifier = Modifier
-                    .padding(start = 16.dp)
-                    .noRippleClickable {
-                        onBackClick()
-                    }
-                ,
+                modifier = Modifier.wrapContentSize(),
                painter = painterResource(R.drawable.ic_default_top_back),
                contentDescription = stringResource(R.string.content_desc_back_button)
            )
-        },
-        actions = {
-            AllContentMenuButton(
-                onClick = { isMenuExpanded = true }
-            )
-            if (uiMenuState is UiMenuState.Visible) {
-                DropdownMenu(
-                    modifier = Modifier.width(252.dp),
-                    expanded = isMenuExpanded,
-                    onDismissRequest = { isMenuExpanded = false },
-                    shape = RoundedCornerShape(size = 16.dp),
-                    containerColor = colorResource(id = R.color.background_primary),
-                    shadowElevation = 5.dp,
-                    border = BorderStroke(
-                        width = 0.5.dp,
-                        color = colorResource(id = R.color.background_secondary)
-                    )
-                ) {
-                    AllContentMenu(
-                        uiMenuState = uiMenuState,
-                        onModeClick = onModeClick,
-                        onSortClick = onSortClick,
-                        onBinClick = onBinClick
-                    )
-                }
-            }
-        },
-        colors = TopAppBarDefaults.centerAlignedTopAppBarColors(
-            containerColor = colorResource(id = R.color.background_primary)
-        ),
-    )
+        }
+
+        AllContentTitle(
+            modifier = Modifier
+                .wrapContentSize()
+                .align(Alignment.Center),
+            state = titleState
+        )
+
+        AllContentMenuButton(
+            modifier = Modifier.align(Alignment.CenterEnd),
+            onModeClick = onModeClick,
+            onSortClick = onSortClick,
+            onBinClick = onBinClick,
+            uiMenuState = uiMenuState,
+        )
+    }
 }

@DefaultPreviews
@ -150,11 +136,11 @@ private fun AllContentTopBarContainerPreview() {

 //region AllContentTitle
@Composable
-fun AllContentTitle(state: UiTitleState) {
+fun AllContentTitle(modifier: Modifier, state: UiTitleState) {
    when (state) {
        UiTitleState.AllContent -> {
            Text(
-                modifier = Modifier
+                modifier = modifier
                    .wrapContentSize(),
                text = stringResource(id = R.string.all_content_title_all_content),
                style = Title1,
@ -164,7 +150,7 @@ fun AllContentTitle(state: UiTitleState) {

        UiTitleState.OnlyUnlinked -> {
            Text(
-                modifier = Modifier
+                modifier = modifier
                    .wrapContentSize(),
                text = stringResource(id = R.string.all_content_title_only_unlinked),
                style = Title1,
@ -177,16 +163,46 @@ fun AllContentTitle(state: UiTitleState) {

 //region AllContentMenuButton
@Composable
-fun AllContentMenuButton(onClick: () -> Unit) {
+fun AllContentMenuButton(
+    modifier: Modifier,
+    uiMenuState: UiMenuState,
+    onModeClick: (AllContentMenuMode) -> Unit,
+    onSortClick: (ObjectsListSort) -> Unit,
+    onBinClick: () -> Unit,
+) {
+
+    var isMenuExpanded by remember { mutableStateOf(false) }
+
    Image(
-        modifier = Modifier
+        modifier = modifier
            .padding(end = 12.dp)
            .size(32.dp)
-            .bouncingClickable { onClick() },
+            .bouncingClickable { isMenuExpanded = true },
        painter = painterResource(id = R.drawable.ic_space_list_dots),
        contentDescription = "Menu icon",
        contentScale = ContentScale.Inside
    )
+    if (uiMenuState is UiMenuState.Visible) {
+        DropdownMenu(
+            modifier = Modifier.width(252.dp),
+            expanded = isMenuExpanded,
+            onDismissRequest = { isMenuExpanded = false },
+            shape = RoundedCornerShape(size = 16.dp),
+            containerColor = colorResource(id = R.color.background_primary),
+            shadowElevation = 5.dp,
+            border = BorderStroke(
+                width = 0.5.dp,
+                color = colorResource(id = R.color.background_secondary)
+            )
+        ) {
+            AllContentMenu(
+                uiMenuState = uiMenuState,
+                onModeClick = onModeClick,
+                onSortClick = onSortClick,
+                onBinClick = onBinClick
+            )
+        }
+    }
 }
 //endregion

--- a/feature-chats/src/main/java/com/anytypeio/anytype/feature_chats/ui/Toolbars.kt
+++ b/feature-chats/src/main/java/com/anytypeio/anytype/feature_chats/ui/Toolbars.kt
@ -59,7 +59,7 @@ fun ChatTopToolbar(
        ) {
            Image(
                modifier = Modifier.align(Alignment.Center),
-                painter = painterResource(R.drawable.ic_home_top_toolbar_back),
+                painter = painterResource(R.drawable.ic_default_top_back),
                contentDescription = stringResource(R.string.content_desc_back_button)
            )
        }
--- a/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/TypeScreen.kt
+++ b/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/TypeScreen.kt
@ -6,14 +6,12 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.navigationBars
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.layout.windowInsetsPadding
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.TopAppBarScrollBehavior
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@ -27,9 +25,6 @@ import com.anytypeio.anytype.presentation.sync.SyncStatusWidgetState
@Composable
 fun TopBarContent(
    uiSyncStatusBadgeState: UiSyncStatusBadgeState,
-    uiEditButtonState: UiEditButton,
-    uiTitleState: UiTitleState,
-    topBarScrollBehavior: TopAppBarScrollBehavior,
    onTypeEvent: (TypeEvent) -> Unit
 ) {
    // Use windowInsetsPadding if running on a recent SDK
@ -43,14 +38,8 @@ fun TopBarContent(

    Column(modifier = modifier) {
        TopToolbar(
-            modifier = Modifier
-                .fillMaxWidth()
-                .height(48.dp),
            uiSyncStatusBadgeState = uiSyncStatusBadgeState,
-            uiEditButtonState = uiEditButtonState,
-            uiTitleState = uiTitleState,
-            onTypeEvent = onTypeEvent,
-            topBarScrollBehavior = topBarScrollBehavior
+            onTypeEvent = onTypeEvent
        )
    }
 }
--- a/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/header/HeaderScreen.kt
+++ b/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/header/HeaderScreen.kt
@ -1,5 +1,6 @@
 package com.anytypeio.anytype.feature_object_type.ui.header

+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
@ -7,6 +8,7 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.stringResource
@ -20,6 +22,7 @@ import com.anytypeio.anytype.feature_object_type.ui.TypeEvent
 import com.anytypeio.anytype.feature_object_type.ui.UiIconState
 import com.anytypeio.anytype.feature_object_type.ui.UiTitleState
 import com.anytypeio.anytype.presentation.objects.ObjectIcon
+import timber.log.Timber


@Composable
@ -29,18 +32,25 @@ fun IconAndTitleWidget(
    uiTitleState: UiTitleState,
    onTypeEvent: (TypeEvent) -> Unit
 ) {
-    Row(modifier = modifier) {
-        ListWidgetObjectIcon(
-            modifier = Modifier
-                .size(32.dp)
-                .noRippleThrottledClickable {
-                    if (uiIconState.isEditable) {
-                        onTypeEvent.invoke(TypeEvent.OnObjectTypeIconClick)
-                    }
-                },
-            icon = uiIconState.icon,
-            backgroundColor = R.color.amp_transparent
-        )
+    Row(
+        modifier = modifier,
+        verticalAlignment = Alignment.CenterVertically
+    ) {
+        Box(
+            modifier = Modifier.noRippleThrottledClickable {
+                if (uiIconState.isEditable) {
+                    onTypeEvent.invoke(TypeEvent.OnObjectTypeIconClick)
+                } else {
+                    Timber.d("IconAndTitleWidget: Icon is not editable")
+                }
+            }
+        ) {
+            ListWidgetObjectIcon(
+                modifier = Modifier.size(32.dp),
+                icon = uiIconState.icon,
+                backgroundColor = R.color.amp_transparent
+            )
+        }
        NameField(
            modifier = Modifier
                .fillMaxWidth()
--- a/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/header/TopToolbar.kt
+++ b/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/header/TopToolbar.kt
@ -1,8 +1,8 @@
 package com.anytypeio.anytype.feature_object_type.ui.header

-import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@ -10,26 +10,12 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.wrapContentSize
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.IconButton
-import androidx.compose.material.Text
-import androidx.compose.material3.CenterAlignedTopAppBar
-import androidx.compose.material3.DropdownMenu
-import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.TopAppBarDefaults
-import androidx.compose.material3.TopAppBarScrollBehavior
-import androidx.compose.material3.rememberTopAppBarState
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.DpOffset
 import androidx.compose.ui.unit.dp
 import com.anytypeio.anytype.core_models.multiplayer.P2PStatusUpdate
 import com.anytypeio.anytype.core_models.multiplayer.SpaceSyncAndP2PStatusState
@ -40,78 +26,47 @@ import com.anytypeio.anytype.core_models.multiplayer.SpaceSyncUpdate
 import com.anytypeio.anytype.core_ui.common.DefaultPreviews
 import com.anytypeio.anytype.core_ui.foundation.noRippleThrottledClickable
 import com.anytypeio.anytype.core_ui.syncstatus.StatusBadge
-import com.anytypeio.anytype.core_ui.views.BodyRegular
-import com.anytypeio.anytype.core_ui.views.PreviewTitle2Regular
 import com.anytypeio.anytype.feature_object_type.R
 import com.anytypeio.anytype.feature_object_type.ui.TypeEvent
-import com.anytypeio.anytype.feature_object_type.ui.UiEditButton
 import com.anytypeio.anytype.feature_object_type.ui.UiSyncStatusBadgeState
-import com.anytypeio.anytype.feature_object_type.ui.UiTitleState


@OptIn(ExperimentalMaterial3Api::class)
@Composable
 fun TopToolbar(
-    modifier: Modifier,
-    uiEditButtonState: UiEditButton,
    uiSyncStatusBadgeState: UiSyncStatusBadgeState,
-    topBarScrollBehavior: TopAppBarScrollBehavior,
-    uiTitleState: UiTitleState,
    onTypeEvent: (TypeEvent) -> Unit
 ) {
-    val isIconMenuExpanded = remember {
-        mutableStateOf(false)
-    }

-    CenterAlignedTopAppBar(
-        modifier = modifier.fillMaxWidth()
-            .padding(horizontal = 0.dp),
-        expandedHeight = 48.dp,
-        scrollBehavior = topBarScrollBehavior,
-        colors = TopAppBarDefaults.centerAlignedTopAppBarColors(
-            containerColor = colorResource(id = R.color.background_primary),
-            scrolledContainerColor = colorResource(id = R.color.background_primary),
-            titleContentColor = colorResource(id = R.color.palette_system_red)
-        ),
-        title = {
-            if (topBarScrollBehavior.state.overlappedFraction > 0.7f) {
-                Box(
-                    modifier = Modifier.fillMaxHeight(),
-                    contentAlignment = Alignment.Center
-                ) {
-                    Text(
-                        text = uiTitleState.title,
-                        style = PreviewTitle2Regular,
-                        color = colorResource(R.color.text_primary),
-                        textAlign = TextAlign.Center
-                    )
-                }
-            }
-        },
-        navigationIcon = {
-            Box(
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .height(48.dp)
+    ) {
+        Box(
+            modifier = Modifier
+                .width(56.dp)
+                .fillMaxHeight()
+                .noRippleThrottledClickable {
+                    onTypeEvent(TypeEvent.OnBackClick)
+                },
+            contentAlignment = Alignment.Center
+        ) {
+            Image(
                modifier = Modifier
-                    .width(56.dp)
-                    .height(48.dp)
-                    .noRippleThrottledClickable {
-                        onTypeEvent(TypeEvent.OnBackClick)
-                    },
-                contentAlignment = Alignment.CenterStart
-            ) {
-                Image(
-                    modifier = Modifier
-                        .padding(start = 12.dp)
-                        .wrapContentSize(),
-                    painter = painterResource(R.drawable.ic_default_top_back),
-                    contentDescription = stringResource(R.string.content_desc_back_button)
-                )
-            }
-        },
-        actions = {
+                    .wrapContentSize(),
+                painter = painterResource(R.drawable.ic_default_top_back),
+                contentDescription = stringResource(R.string.content_desc_back_button)
+            )
+        }
+        Row(
+            modifier = Modifier.align(Alignment.CenterEnd)
+        ) {
            if (uiSyncStatusBadgeState is UiSyncStatusBadgeState.Visible) {
                Box(
                    modifier = Modifier
-                        .size(48.dp)
+                        .wrapContentSize()
+                        .padding(end = 14.dp)
                        .noRippleThrottledClickable {
                            onTypeEvent(
                                TypeEvent.OnSyncStatusClick(
@ -123,65 +78,63 @@ fun TopToolbar(
                    StatusBadge(
                        status = uiSyncStatusBadgeState.status,
                        modifier = Modifier
+                            .size(28.dp)
                            .align(Alignment.Center)
                    )
                }
            }
-            if (uiEditButtonState is UiEditButton.Visible) {
-                IconButton(
-                    modifier = Modifier
-                        .size(48.dp),
-                    onClick = {
-                        isIconMenuExpanded.value = !isIconMenuExpanded.value
-                    }
-                ) {
-                    Image(
-                        modifier = Modifier.size(24.dp),
-                        painter = painterResource(id = R.drawable.ic_space_list_dots),
-                        contentDescription = "More options"
-                    )
-                    DropdownMenu(
-                        modifier = Modifier
-                            .width(244.dp),
-                        expanded = isIconMenuExpanded.value,
-                        offset = DpOffset(x = 0.dp, y = 0.dp),
-                        onDismissRequest = {
-                            isIconMenuExpanded.value = false
-                        },
-                        shape = RoundedCornerShape(10.dp),
-                        containerColor = colorResource(id = R.color.background_secondary),
-                        border = BorderStroke(
-                            width = 0.5.dp,
-                            color = colorResource(id = R.color.background_secondary)
-                        )
-                    ) {
-                        DropdownMenuItem(
-                            text = {
-                                Text(
-                                    text = stringResource(R.string.object_type_settings_item_remove),
-                                    style = BodyRegular,
-                                    color = colorResource(id = R.color.palette_system_red)
-                                )
-                            },
-                            onClick = {
-                                onTypeEvent(TypeEvent.OnMenuItemDeleteClick)
-                                isIconMenuExpanded.value = false
-                            },
-                        )
-                    }
-                }
-            }
+//            if (uiEditButtonState is UiEditButton.Visible) {
+//                IconButton(
+//                    modifier = Modifier
+//                        .size(48.dp),
+//                    onClick = {
+//                        isIconMenuExpanded.value = !isIconMenuExpanded.value
+//                    }
+//                ) {
+//                    Image(
+//                        modifier = Modifier.size(24.dp),
+//                        painter = painterResource(id = R.drawable.ic_space_list_dots),
+//                        contentDescription = "More options"
+//                    )
+//                    DropdownMenu(
+//                        modifier = Modifier
+//                            .width(244.dp),
+//                        expanded = isIconMenuExpanded.value,
+//                        offset = DpOffset(x = 0.dp, y = 0.dp),
+//                        onDismissRequest = {
+//                            isIconMenuExpanded.value = false
+//                        },
+//                        shape = RoundedCornerShape(10.dp),
+//                        containerColor = colorResource(id = R.color.background_secondary),
+//                        border = BorderStroke(
+//                            width = 0.5.dp,
+//                            color = colorResource(id = R.color.background_secondary)
+//                        )
+//                    ) {
+//                        DropdownMenuItem(
+//                            text = {
+//                                Text(
+//                                    text = stringResource(R.string.object_type_settings_item_remove),
+//                                    style = BodyRegular,
+//                                    color = colorResource(id = R.color.palette_system_red)
+//                                )
+//                            },
+//                            onClick = {
+//                                onTypeEvent(TypeEvent.OnMenuItemDeleteClick)
+//                                isIconMenuExpanded.value = false
+//                            },
+//                        )
+//                    }
+//                }
+//            }
        }
-    )
+    }
 }

@OptIn(ExperimentalMaterial3Api::class)
@Composable
@DefaultPreviews
 fun TopToolbarPreview() {
-    val topAppBarScrollBehavior = TopAppBarDefaults.pinnedScrollBehavior(
-        state = rememberTopAppBarState()
-    )
    val spaceSyncUpdate = SpaceSyncUpdate.Update(
        id = "1",
        status = SpaceSyncStatus.SYNCING,
@ -190,16 +143,12 @@ fun TopToolbarPreview() {
        syncingObjectsCounter = 2
    )
    TopToolbar(
-        modifier = Modifier.fillMaxWidth(),
        uiSyncStatusBadgeState = UiSyncStatusBadgeState.Visible(
            status = SpaceSyncAndP2PStatusState.Success(
                spaceSyncUpdate = spaceSyncUpdate,
                p2PStatusUpdate = P2PStatusUpdate.Initial
            )
        ),
-        uiEditButtonState = UiEditButton.Visible,
        onTypeEvent = {},
-        topBarScrollBehavior = topAppBarScrollBehavior,
-        uiTitleState = UiTitleState(title = "Pages", originalName = "Page", isEditable = true)
    )
 }
--- a/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/space/SpaceTypesListScreen.kt
+++ b/feature-object-type/src/main/java/com/anytypeio/anytype/feature_object_type/ui/space/SpaceTypesListScreen.kt
@ -10,11 +10,13 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.safeDrawing
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.layout.width
@ -34,6 +36,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Alignment.Companion.CenterVertically
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
@ -255,16 +258,14 @@ private fun Topbar(
        Box(
            modifier = Modifier
                .width(56.dp)
-                .height(48.dp)
-                .align(Alignment.CenterStart)
+                .fillMaxHeight()
                .noRippleThrottledClickable {
                    onBackPressed()
                },
-            contentAlignment = Alignment.CenterStart
+            contentAlignment = Alignment.Center
        ) {
            Image(
                modifier = Modifier
-                    .padding(start = 12.dp)
                    .wrapContentSize(),
                painter = painterResource(R.drawable.ic_default_top_back),
                contentDescription = stringResource(R.string.content_desc_back_button)
@ -279,8 +280,9 @@ private fun Topbar(
        )
        Box(
            modifier = Modifier
-                .width(56.dp)
+                .wrapContentSize()
                .height(48.dp)
+                .padding(end = 12.dp)
                .align(Alignment.CenterEnd)
                .noRippleThrottledClickable {
                    onAddIconClicked()
@ -289,10 +291,10 @@ private fun Topbar(
        ) {
            Image(
                modifier = Modifier
-                    .padding(start = 12.dp)
-                    .wrapContentSize(),
+                    .size(32.dp),
                painter = painterResource(R.drawable.ic_default_plus),
-                contentDescription = "Add new type"
+                contentDescription = "Add new type",
+                contentScale = ContentScale.Inside
            )
        }
    }
--- a/feature-properties/src/main/java/com/anytypeio/anytype/feature_properties/space/ui/SpacePropertiesListScreen.kt
+++ b/feature-properties/src/main/java/com/anytypeio/anytype/feature_properties/space/ui/SpacePropertiesListScreen.kt
@ -274,11 +274,10 @@ private fun Topbar(
                .noRippleThrottledClickable {
                    onBackPressed()
                },
-            contentAlignment = Alignment.CenterStart
+            contentAlignment = Alignment.Center
        ) {
            Image(
                modifier = Modifier
-                    .padding(start = 12.dp)
                    .wrapContentSize(),
                painter = painterResource(R.drawable.ic_default_top_back),
                contentDescription = stringResource(R.string.content_desc_back_button)
@ -293,8 +292,9 @@ private fun Topbar(
        )
        Box(
            modifier = Modifier
-                .width(56.dp)
+                .wrapContentSize()
                .height(48.dp)
+                .padding(end = 12.dp)
                .align(Alignment.CenterEnd)
                .noRippleThrottledClickable {
                    onAddIconClicked()
@ -303,10 +303,10 @@ private fun Topbar(
        ) {
            Image(
                modifier = Modifier
-                    .padding(start = 12.dp)
-                    .wrapContentSize(),
+                    .size(32.dp),
                painter = painterResource(R.drawable.ic_default_plus),
-                contentDescription = "Add new type"
+                contentDescription = "Add new property",
+                contentScale = ContentScale.Inside
            )
        }
    }
--- a/feature-ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/space/new_settings/NewSettings.kt
+++ b/feature-ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/space/new_settings/NewSettings.kt
@ -7,14 +7,16 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.navigationBars
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBars
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.windowInsetsPadding
+import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.RoundedCornerShape
@ -31,22 +33,19 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
-import androidx.compose.ui.layout.ContentScale
-import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import com.anytypeio.anytype.core_ui.foundation.Dragger
 import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
+import com.anytypeio.anytype.core_ui.foundation.noRippleThrottledClickable
 import com.anytypeio.anytype.core_ui.views.PreviewTitle1Medium
-import com.anytypeio.anytype.core_utils.ext.toast
 import com.anytypeio.anytype.core_utils.insets.EDGE_TO_EDGE_MIN_SDK
 import com.anytypeio.anytype.presentation.spaces.UiEvent
 import com.anytypeio.anytype.presentation.spaces.UiSpaceSettingsItem
 import com.anytypeio.anytype.presentation.spaces.UiSpaceSettingsState
 import com.anytypeio.anytype.ui_settings.R
-import timber.log.Timber

@Composable
 fun SpaceSettingsContainer(
@ -89,18 +88,22 @@ fun NewSpaceSettingsScreen(
                        .fillMaxWidth()
                        .height(48.dp)
            ) {
-                Image(
-                    painter = painterResource(R.drawable.ic_home_top_toolbar_back),
-                    contentDescription = "Back button",
-                    contentScale = ContentScale.Inside,
+                Box(
                    modifier = Modifier
-                        .padding(start = 4.dp)
-                        .size(48.dp)
-                        .align(Alignment.CenterStart)
-                        .noRippleClickable {
+                        .width(56.dp)
+                        .fillMaxHeight()
+                        .noRippleThrottledClickable {
                            uiEvent(UiEvent.OnBackPressed)
-                        }
-                )
+                        },
+                    contentAlignment = Alignment.Center
+                ) {
+                    Image(
+                        modifier = Modifier
+                            .wrapContentSize(),
+                        painter = painterResource(R.drawable.ic_default_top_back),
+                        contentDescription = stringResource(R.string.content_desc_back_button)
+                    )
+                }
            }
        },
        content = { paddingValues ->