anyproto/anytype-kotlin
1
0
Fork 0
mirror of https://github.com/anyproto/anytype-kotlin.git synced 2025-06-08 05:47:05 +09:00
Code Activity

DROID-1086 Design | Typography, compose (#3105)

Browse source 
* DROID-1086 compose screens

* DROID-1086 design fix

* DROID-1086 account and data screen

* DROID-1086 typo fixes

* DROID-1086 typo, compose
This commit is contained in:
Konstantin Ivanov 2023-04-19 15:33:25 +02:00 • committed by GitHub
parent db19c8da20
commit 06665ecda9
Signed by: github
GPG key ID: 4AEE18F83AFDEB23
26 changed files with 227 additions and 273 deletions
Download patch file Download diff file Expand all files Collapse all files

8
app/src/main/java/com/anytypeio/anytype/ui/auth/account/DeletedAccountFragment.kt
View file

@ -38,6 +38,8 @@ import androidx.lifecycle.repeatOnLifecycle
import androidx.navigation.fragment.findNavController
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_ui.foundation.Divider
import com.anytypeio.anytype.core_ui.views.BodyCalloutRegular
import com.anytypeio.anytype.core_ui.views.HeadlineHeading
import com.anytypeio.anytype.core_utils.ext.arg
import com.anytypeio.anytype.core_utils.ext.toast
import com.anytypeio.anytype.core_utils.ui.BaseComposeFragment
@ -183,7 +185,7 @@ fun DeletedAccountScreen(
}
},
color = colorResource(R.color.text_primary),
style = MaterialTheme.typography.h2,
style = HeadlineHeading,
modifier = Modifier.padding(
start = 20.dp,
end = 20.dp
@ -192,13 +194,13 @@ fun DeletedAccountScreen(
Text(
text = stringResource(R.string.deleted_account_msg),
color = colorResource(R.color.text_primary),
style = BodyCalloutRegular,
modifier = Modifier.padding(
top = 12.dp,
start = 20.dp,
end = 20.dp,
bottom = 14.dp
),
fontSize = 15.sp
)
)
if (date != DeletionDate.Deleted) {
Action(

9
app/src/main/java/com/anytypeio/anytype/ui/home/HomeScreen.kt
View file

@ -41,15 +41,14 @@ import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.IntOffset
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.rememberAsyncImagePainter
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_models.ObjectWrapper
import com.anytypeio.anytype.core_ui.extensions.throttledClick
import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
import com.anytypeio.anytype.core_ui.views.UXBody
import com.anytypeio.anytype.emojifier.Emojifier
import com.anytypeio.anytype.presentation.home.InteractionMode
import com.anytypeio.anytype.presentation.spaces.SpaceIconView
@ -503,10 +502,8 @@ fun HomeScreenButton(
Text(
text = text,
modifier = Modifier.align(Alignment.Center),
style = TextStyle(
fontSize = 17.sp,
color = colorResource(id = R.color.text_white)
)
style = UXBody,
color = colorResource(id = R.color.text_button_label)
)
}
}

1
app/src/main/java/com/anytypeio/anytype/ui/library/views/LibraryTabs.kt
View file

@ -122,6 +122,7 @@ fun LibraryTab(
Text(
text = stringResource(id = config.mainTitle),
style = TabTitleStyle,
color = colorResource(id = R.color.text_primary),
onTextLayout = onTextLayout::invoke
)
}

1
app/src/main/java/com/anytypeio/anytype/ui/library/views/list/LibraryListTabs.kt
View file

@ -80,6 +80,7 @@ fun LibraryListTab(
modifier = modifier
.wrapContentWidth()
.offset(x = config.subtitleTabOffset),
color = colorResource(id = R.color.text_primary)
)
},
selected = pagerState.currentPage == index,

1
app/src/main/java/com/anytypeio/anytype/ui/library/views/list/items/Items.kt
View file

@ -222,6 +222,7 @@ fun LibraryObjectEmptyItem(objectType: String, name: String) {
formatArgs = arrayOf(objectType, name)
),
style = UXBody,
color = colorResource(id = R.color.text_primary),
textAlign = TextAlign.Center,
modifier = Modifier.padding(bottom = 9.dp)
)

1
app/src/main/java/com/anytypeio/anytype/ui/relations/RelationEditScreen.kt
View file

@ -99,6 +99,7 @@ fun RelationEditHeader(
}
Text(
text = stringResource(id = R.string.relation_editing_title),
color = colorResource(id = R.color.text_primary),
style = Title1,
)
if (!readOnly) {

1
app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeCreationHeader.kt
View file

@ -49,6 +49,7 @@ fun TypeCreationHeader(
Spacer(modifier = Modifier.weight(1f))
Text(
text = stringResource(id = R.string.type_creation_new_type),
color = colorResource(id = R.color.text_primary),
style = Title1,
)
Box(modifier = Modifier.weight(1f)) {

3
app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditHeader.kt
View file

@ -53,7 +53,8 @@ fun TypeEditHeader(
}
Text(
text = stringResource(id = R.string.type_editing_title),
style = Title1
style = Title1,
color = colorResource(id = R.color.text_primary)
)
if (!readOnly) {
Box(modifier = Modifier.weight(1f)) {

4
app/src/main/java/com/anytypeio/anytype/ui/types/views/TypeEditWidget.kt
View file

@ -19,16 +19,12 @@ import androidx.compose.ui.layout.onGloballyPositioned
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.TextRange
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.TextFieldValue
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_ui.views.BodyRegular
import com.anytypeio.anytype.presentation.objects.ObjectIcon
import com.anytypeio.anytype.ui.settings.fonts
import com.anytypeio.anytype.ui.types.views.TypeEditWidgetDefaults.OffsetX

65
app/src/main/java/com/anytypeio/anytype/ui/update/MigrationErrorScreen.kt
View file

@ -8,16 +8,12 @@ import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.ClickableText
import androidx.compose.material.Button
import androidx.compose.material.ButtonDefaults
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
@ -34,9 +30,14 @@ import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.withStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
import com.anytypeio.anytype.core_ui.views.BodyCallout
import com.anytypeio.anytype.core_ui.views.BodyRegular
import com.anytypeio.anytype.core_ui.views.ButtonPrimary
import com.anytypeio.anytype.core_ui.views.ButtonSize
import com.anytypeio.anytype.core_ui.views.HeadlineHeading
import com.anytypeio.anytype.core_ui.views.HeadlineSubheading
import com.anytypeio.anytype.presentation.update.MigrationErrorViewModel.ViewAction
import kotlinx.coroutines.launch
@ -59,17 +60,14 @@ fun Cards(onViewAction: (ViewAction) -> Unit) {
Column(modifier = Modifier.padding(horizontal = 20.dp)) {
Text(
text = stringResource(id = R.string.almost_there),
style = MaterialTheme.typography.h2.copy(
color = colorResource(id = R.color.text_primary)
),
style = HeadlineHeading,
color = colorResource(id = R.color.text_primary),
modifier = Modifier.padding(top = 56.dp)
)
Text(
text = stringResource(id = R.string.almost_there_subtitle),
style = MaterialTheme.typography.body1.copy(
fontSize = 17.sp,
color = colorResource(id = R.color.text_primary)
),
style = BodyRegular,
color = colorResource(id = R.color.text_primary),
modifier = Modifier.padding(top = 12.dp)
)
InfoCard(
@ -95,11 +93,7 @@ fun Cards(onViewAction: (ViewAction) -> Unit) {
ClickableText(
modifier = Modifier.padding(top = 12.dp),
text = text,
style = MaterialTheme.typography.body2.copy(
fontSize = 15.sp,
color = colorResource(id = R.color.text_primary),
lineHeight = 22.sp
),
style = BodyCallout,
onClick = { offset ->
text.getStringAnnotations(
tag = ANNOTATION_TAG,
@ -120,37 +114,20 @@ fun Cards(onViewAction: (ViewAction) -> Unit) {
expanded = false,
toggleClick = { onViewAction(ViewAction.ToggleMigrationReady) },
content = {
Column() {
Column {
Text(
modifier = Modifier.padding(top = 12.dp),
text = stringResource(id = R.string.migration_error_msg),
style = MaterialTheme.typography.body2.copy(
fontSize = 15.sp,
color = colorResource(id = R.color.text_primary),
lineHeight = 22.sp
)
style = BodyCallout,
color = colorResource(id = R.color.text_primary)
)
Button(
ButtonPrimary(
text = stringResource(id = R.string.visit_forum),
modifier = Modifier
.fillMaxWidth()
.padding(top = 0.dp),
.padding(top = 16.dp),
onClick = { onViewAction(ViewAction.VisitForum) },
colors = ButtonDefaults.buttonColors(backgroundColor = colorResource(id = R.color.black)),
shape = RoundedCornerShape(10.dp),
contentPadding = PaddingValues(
0.dp, 10.dp, 0.dp, 10.dp
),
content = {
Text(
text = stringResource(id = R.string.visit_forum),
style = MaterialTheme.typography.h3.copy(
color = colorResource(id = R.color.library_action_btn_text_color)
)
)
},
elevation = ButtonDefaults.elevation(
defaultElevation = 0.dp, pressedElevation = 0.dp
)
size = ButtonSize.Large
)
}
}
@ -210,10 +187,8 @@ fun InfoCard(
) {
Text(
text = title,
style = MaterialTheme.typography.h2.copy(
color = colorResource(id = R.color.text_primary),
fontSize = 17.sp
)
style = HeadlineSubheading,
color = colorResource(id = R.color.text_primary)
)
AnimatedVisibility(visible = cardOpened.value) {
content()

40
app/src/main/java/com/anytypeio/anytype/ui/widgets/SelectWidgetTypeScreen.kt
View file

@ -1,5 +1,6 @@
package com.anytypeio.anytype.ui.widgets
import android.graphics.Color
import androidx.annotation.DrawableRes
import androidx.compose.foundation.Image
import androidx.compose.foundation.clickable
@ -16,16 +17,29 @@ 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.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.anytypeio.anytype.R
import com.anytypeio.anytype.core_ui.foundation.Divider
import com.anytypeio.anytype.core_ui.foundation.Dragger
import com.anytypeio.anytype.core_ui.foundation.Toolbar
import com.anytypeio.anytype.core_ui.views.Caption2Regular
import com.anytypeio.anytype.core_ui.views.Title2
import com.anytypeio.anytype.presentation.widgets.WidgetTypeView
@Preview(backgroundColor = 0xFFFFFFFF, showBackground = true)
@Composable
fun MySelectWidgetTypeScreen() {
SelectWidgetTypeScreen(
views = listOf(
WidgetTypeView.List(isSelected = true),
WidgetTypeView.Link(isSelected = true),
WidgetTypeView.Tree(isSelected = true)
),
onViewClicked = { }
)
}
@Composable
fun SelectWidgetTypeScreen(
views: List<WidgetTypeView>,
@ -78,9 +92,6 @@ fun SelectWidgetTypeScreen(
onClick = { onViewClicked(type) }
)
}
if (index != views.lastIndex) {
Divider(paddingStart = 76.dp)
}
}
Spacer(modifier = Modifier.height(20.dp))
}
@ -110,23 +121,18 @@ fun WidgetTypeItem(
Text(
modifier = Modifier
.align(Alignment.TopStart)
.padding(start = 70.dp, top = 11.dp),
.padding(start = 76.dp, top = 11.dp),
text = title,
style = TextStyle(
color = colorResource(id = R.color.text_primary),
fontSize = 15.sp,
fontWeight = FontWeight.Medium
)
style = Title2,
color = colorResource(id = R.color.text_primary)
)
Text(
modifier = Modifier
.align(Alignment.BottomStart)
.padding(start = 70.dp, bottom = 11.dp),
.padding(start = 76.dp, bottom = 11.dp),
text = subtitle,
style = TextStyle(
color = colorResource(id = R.color.text_secondary),
fontSize = 13.sp
)
style = Caption2Regular,
color = colorResource(id = R.color.text_secondary)
)
if (isChecked) {
Image(

61
app/src/main/java/com/anytypeio/anytype/ui/widgets/collection/CollectionScreen.kt
View file

@ -77,6 +77,11 @@ 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.views.BodyCalloutRegular
import com.anytypeio.anytype.core_ui.views.PreviewTitle2Medium
import com.anytypeio.anytype.core_ui.views.Relations3
import com.anytypeio.anytype.core_ui.views.Title1
import com.anytypeio.anytype.core_ui.views.UXBody
import com.anytypeio.anytype.core_ui.widgets.CollectionActionWidget
import com.anytypeio.anytype.core_ui.widgets.ObjectIconWidget
import com.anytypeio.anytype.core_utils.ext.invisible
@ -152,24 +157,21 @@ private fun TopBar(
Text(
modifier = Modifier.align(Alignment.Center),
text = uiState.collectionName,
style = MaterialTheme.typography.h3,
style = Title1,
color = colorResource(id = R.color.text_primary)
)
Text(
modifier = Modifier
.align(CenterEnd)
.noRippleClickable { vm.onActionClicked() },
.noRippleClickable { vm.onActionClicked() }
.padding(start = 16.dp, top = 12.dp, bottom = 12.dp),
text = uiState.actionName,
style = actionTextStyle(),
style = UXBody,
color = colorResource(id = R.color.glyph_active)
)
}
}
@Composable
private fun actionTextStyle() = MaterialTheme.typography.body2.copy(
fontSize = 17.sp,
color = colorResource(id = R.color.glyph_active)
)
@Composable
private fun ListView(
vm: CollectionViewModel,
@ -339,9 +341,10 @@ fun SectionItem(
Text(
modifier = Modifier.padding(16.dp, 20.dp, 0.dp, 0.dp),
text = view.name,
style = sectionTextStyle(),
style = BodyCalloutRegular,
maxLines = 1,
overflow = TextOverflow.Ellipsis
overflow = TextOverflow.Ellipsis,
color = colorResource(id = R.color.text_secondary)
)
}
}
@ -431,7 +434,8 @@ fun CollectionItem(
Text(
text = name,
style = objNameTextStyle(),
style = PreviewTitle2Medium,
color = colorResource(id = R.color.text_primary),
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
@ -440,7 +444,8 @@ fun CollectionItem(
if (!description.isNullOrBlank()) {
Text(
text = description,
style = objDescriptionTextStyle(),
style = Relations3,
color = colorResource(id = R.color.text_primary),
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
@ -451,8 +456,8 @@ fun CollectionItem(
if (!typeName.isNullOrBlank()) {
Text(
text = typeName,
fontSize = 12.sp,
style = objTypeNameTextStyle(),
style = Relations3,
color = colorResource(id = R.color.text_secondary),
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
@ -494,32 +499,6 @@ fun CollectionItem(
}
}
@Composable
private fun sectionTextStyle() = MaterialTheme.typography.body2.copy(
fontSize = 15.sp,
color = colorResource(id = R.color.text_secondary)
)
@Composable
private fun objTypeNameTextStyle() = MaterialTheme.typography.body2.copy(
color = colorResource(id = R.color.text_secondary)
)
@Composable
private fun objDescriptionTextStyle() = MaterialTheme.typography.body2.copy(
fontSize = 12.sp,
color = colorResource(id = R.color.text_primary)
)
@Composable
private fun objNameTextStyle() = MaterialTheme.typography.h3.copy(
fontSize = 15.sp,
color = colorResource(id = R.color.text_primary),
fontWeight = FontWeight.Medium,
lineHeight = 20.sp
)
@ExperimentalMaterialApi
@Composable
fun CollectionScreen(vm: CollectionViewModel) {

15
app/src/main/java/com/anytypeio/anytype/ui/widgets/menu/WidgetDropDownMenu.kt
View file

@ -50,7 +50,8 @@ fun WidgetMenu(
) {
Text(
text = stringResource(R.string.widget_add_below),
style = BodyRegular
style = BodyRegular,
color = colorResource(id = R.color.text_primary),
)
}
Divider(
@ -68,7 +69,8 @@ fun WidgetMenu(
) {
Text(
text = stringResource(R.string.widget_change_source),
style = defaultTextStyle
style = defaultTextStyle,
color = colorResource(id = R.color.text_primary),
)
}
Divider(
@ -86,7 +88,8 @@ fun WidgetMenu(
) {
Text(
text = stringResource(R.string.widget_change_type),
style = defaultTextStyle
style = defaultTextStyle,
color = colorResource(id = R.color.text_primary),
)
}
Divider(
@ -144,7 +147,8 @@ fun WidgetMenu(
) {
Text(
text = stringResource(R.string.widget_edit_widgets),
style = defaultTextStyle
style = defaultTextStyle,
color = colorResource(id = R.color.text_primary),
)
}
}
@ -173,7 +177,8 @@ fun WidgetActionButton(
.align(Alignment.Center)
.padding(horizontal = 12.dp),
text = label,
style = Title2
style = Title2,
color = colorResource(id = R.color.text_primary)
)
}
}

3
app/src/main/java/com/anytypeio/anytype/ui/widgets/types/BinWidgetCard.kt
View file

@ -91,7 +91,8 @@ fun BinWidgetCard(
modifier = Modifier
.align(Alignment.CenterStart)
.padding(start = 42.dp, end = 16.dp),
style = HeadlineSubheading
style = HeadlineSubheading,
color = colorResource(id = R.color.text_primary),
)
}
AnimatedVisibility(

3
app/src/main/java/com/anytypeio/anytype/ui/widgets/types/DataViewWidget.kt
View file

@ -211,7 +211,8 @@ fun ListWidgetElement(
.align(Alignment.CenterStart),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
style = PreviewTitle2Medium
style = PreviewTitle2Medium,
color = colorResource(id = R.color.text_primary),
)
if (hasDescription) {
Text(

3
app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LibraryWidgetCard.kt
View file

@ -85,7 +85,8 @@ fun LibraryWidgetCard(
modifier = Modifier
.align(Alignment.CenterStart)
.padding(start = 42.dp, end = 16.dp),
style = HeadlineSubheading
style = HeadlineSubheading,
color = colorResource(id = R.color.text_primary),
)
}
WidgetMenu(

3
app/src/main/java/com/anytypeio/anytype/ui/widgets/types/LinkWidget.kt
View file

@ -94,7 +94,8 @@ fun LinkWidgetCard(
start = 16.dp,
end = if (isInEditMode) 76.dp else 32.dp
),
style = HeadlineSubheading
style = HeadlineSubheading,
color = colorResource(id = R.color.text_primary),
)
AnimatedVisibility(
visible = isInEditMode,

4
app/src/main/java/com/anytypeio/anytype/ui/widgets/types/TreeWidget.kt
View file

@ -207,7 +207,8 @@ private fun TreeWidgetTreeItems(
modifier = Modifier.padding(start = 8.dp),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
style = PreviewTitle2Medium
style = PreviewTitle2Medium,
color = colorResource(id = R.color.text_primary),
)
}
Divider(
@ -242,6 +243,7 @@ fun WidgetHeader(
Text(
text = title.ifEmpty { stringResource(id = R.string.untitled) },
style = HeadlineSubheading,
color = colorResource(id = R.color.text_primary),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
modifier = Modifier

2
app/src/main/res/values/strings.xml
View file

@ -259,7 +259,7 @@ Do the computation of an expensive paragraph of text on a background thread:
<string name="download_from_node">All files will be deleted from your current device. They can be downloaded again from a backup node or another device.</string>
<string name="new_profile">New profile</string>
<string name="back_up_your_phrase">Back up</string>
<string name="back_up_your_phrase">Back up phrase</string>
<string name="anytype_analytics">Anytype Analytics</string>
<string name="anytype_analytics_msg">Understanding how people use Anytype helps us improve the product. This version of Anytype includes the analytics code that protects your privacy.\nIt doesn\'t record the actual document\'s content but still allows us to understand how you use Anytype.\nStay subscribed to our mailing list, as we will soon announce a new release that enables you to opt-out.</string>
<string name="retry">Retry</string>

183
core-ui/src/main/java/com/anytypeio/anytype/core_ui/foundation/Foundation.kt
View file

@ -1,10 +1,8 @@
package com.anytypeio.anytype.core_ui.foundation
import androidx.annotation.DrawableRes
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
@ -15,36 +13,42 @@ import androidx.compose.foundation.layout.height
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.Card
import androidx.compose.material.CircularProgressIndicator
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.anytypeio.anytype.core_ui.R
import com.anytypeio.anytype.core_ui.views.BodyCalloutRegular
import com.anytypeio.anytype.core_ui.views.BodyRegular
import com.anytypeio.anytype.core_ui.views.ButtonPrimary
import com.anytypeio.anytype.core_ui.views.ButtonSecondary
import com.anytypeio.anytype.core_ui.views.ButtonSize
import com.anytypeio.anytype.core_ui.views.ButtonWarning
import com.anytypeio.anytype.core_ui.views.Caption2Regular
import com.anytypeio.anytype.core_ui.views.HeadlineHeading
import com.anytypeio.anytype.core_ui.views.HeadlineSubheading
import com.anytypeio.anytype.core_ui.views.Title1
@Composable
fun Toolbar(title: String) {
Box(
Modifier.fillMaxWidth().height(48.dp),
Modifier
.fillMaxWidth()
.height(48.dp),
contentAlignment = Alignment.Center
) {
Text(
text = title,
style = HeadlineSubheading
style = Title1,
color = colorResource(R.color.text_primary)
)
}
}
@ -52,13 +56,15 @@ fun Toolbar(title: String) {
@Composable
fun Dragger(modifier: Modifier = Modifier) {
Box(
modifier = modifier.size(
height = 4.dp,
width = 48.dp
).background(
color = colorResource(R.color.shape_primary),
shape = RoundedCornerShape(6.dp)
)
modifier = modifier
.size(
height = 4.dp,
width = 48.dp
)
.background(
color = colorResource(R.color.shape_primary),
shape = RoundedCornerShape(6.dp)
)
)
}
@ -68,7 +74,8 @@ fun Divider(
paddingEnd: Dp = 20.dp
) {
Box(
Modifier.padding(start = paddingStart, end = paddingEnd)
Modifier
.padding(start = paddingStart, end = paddingEnd)
.background(color = colorResource(R.color.shape_primary))
.height(0.5.dp)
.fillMaxWidth()
@ -83,7 +90,9 @@ fun Option(
) {
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.height(52.dp).clickable(onClick = onClick)
modifier = Modifier
.height(52.dp)
.clickable(onClick = onClick)
) {
Image(
@ -98,7 +107,8 @@ fun Option(
color = colorResource(R.color.text_primary),
modifier = Modifier.padding(
start = 12.dp
)
),
style = BodyRegular
)
Box(
modifier = Modifier.weight(1.0f, true),
@ -133,13 +143,13 @@ fun Warning(
) {
Column {
Text(
style = MaterialTheme.typography.h2,
text = title,
modifier = Modifier.padding(
top = 24.dp,
start = 20.dp,
end = 20.dp
),
style = HeadlineHeading,
color = colorResource(R.color.text_primary)
)
Text(
@ -147,54 +157,40 @@ fun Warning(
modifier = Modifier.padding(
top = 12.dp,
start = 20.dp,
end = 20.dp
end = 20.dp,
bottom = 10.dp
),
style = BodyCalloutRegular,
color = colorResource(R.color.text_primary)
)
Row(
modifier = Modifier.height(68.dp).padding(
top = 8.dp,
start = 20.dp,
end = 20.dp
).fillMaxWidth(),
modifier = Modifier
.height(68.dp)
.padding(
top = 10.dp,
start = 20.dp,
end = 20.dp
)
.fillMaxWidth(),
verticalAlignment = Alignment.CenterVertically
) {
Box(
modifier = Modifier.height(48.dp).border(
width = 1.dp,
color = colorResource(R.color.shape_primary),
shape = RoundedCornerShape(10.dp)
).weight(1.0f, true).clickable(onClick = onNegativeClick),
contentAlignment = Alignment.Center
) {
Text(
text = cancelButtonText,
color = colorResource(R.color.text_primary),
fontSize = 17.sp
)
}
ButtonSecondary(
onClick = onNegativeClick,
size = ButtonSize.Large,
text = cancelButtonText,
modifier = Modifier
.fillMaxWidth()
.weight(1f)
)
Spacer(modifier = Modifier.width(10.dp))
Box(
modifier = Modifier.height(48.dp).background(
color = colorResource(R.color.palette_system_red),
shape = RoundedCornerShape(10.dp)
).weight(1.0f, true).clickable(onClick = onPositiveClick),
contentAlignment = Alignment.Center
) {
Text(
text = actionButtonText,
color = Color.White,
fontSize = 17.sp,
fontWeight = FontWeight.SemiBold
)
if (isInProgress) {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.CenterEnd).padding(end = 20.dp).size(16.dp),
color = Color.White,
strokeWidth = 2.dp
)
}
}
ButtonWarning(
onClick = onPositiveClick,
size = ButtonSize.Large,
text = actionButtonText,
modifier = Modifier
.fillMaxWidth()
.weight(1f)
)
}
}
}
@ -219,13 +215,13 @@ fun Announcement(
) {
Column {
Text(
style = MaterialTheme.typography.h2,
text = title,
modifier = Modifier.padding(
top = 24.dp,
start = 20.dp,
end = 20.dp
),
style = HeadlineHeading,
color = colorResource(R.color.text_primary)
)
Text(
@ -235,52 +231,37 @@ fun Announcement(
start = 20.dp,
end = 20.dp
),
style = BodyCalloutRegular,
color = colorResource(R.color.text_primary)
)
Row(
modifier = Modifier.height(68.dp).padding(
top = 8.dp,
start = 20.dp,
end = 20.dp
).fillMaxWidth(),
modifier = Modifier
.height(68.dp)
.padding(
top = 8.dp,
start = 20.dp,
end = 20.dp
)
.fillMaxWidth(),
verticalAlignment = Alignment.CenterVertically
) {
Card(
modifier = Modifier.height(48.dp).weight(1.0f, true),
ButtonSecondary(
text = stringResource(R.string.back),
onClick = onBackClicked,
shape = RoundedCornerShape(10.dp),
border = BorderStroke(
width = 1.dp,
color = colorResource(R.color.shape_primary)
),
elevation = 0.dp,
backgroundColor = Color.Transparent
) {
Box(Modifier.wrapContentSize(Alignment.Center)) {
Text(
text = stringResource(R.string.back),
color = colorResource(R.color.text_primary),
fontSize = 17.sp
)
}
}
size = ButtonSize.Large,
modifier = Modifier
.fillMaxWidth()
.weight(1.0f)
)
Spacer(modifier = Modifier.width(10.dp))
Card(
modifier = Modifier.height(48.dp).weight(1.0f, true),
ButtonPrimary(
text = stringResource(R.string.next),
onClick = onNextClicked,
backgroundColor = colorResource(R.color.glyph_accent),
shape = RoundedCornerShape(10.dp),
elevation = 0.dp
) {
Box(Modifier.wrapContentSize(Alignment.Center)) {
Text(
text = stringResource(R.string.next),
color = Color.White,
fontSize = 17.sp,
fontWeight = FontWeight.SemiBold
)
}
}
size = ButtonSize.Large,
modifier = Modifier
.fillMaxWidth()
.weight(1.0f)
)
}
Spacer(modifier = Modifier.height(10.dp))
}

4
core-ui/src/main/res/layout/view_dataview_info.xml
View file

@ -36,8 +36,8 @@
<com.anytypeio.anytype.core_ui.views.ButtonSecondarySmall
android:id="@+id/button"
android:layout_width="118dp"
android:layout_height="48dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:layout_marginBottom="16dp"
tools:text="Create object"

19
ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/about/AboutAppScreen.kt
View file

@ -11,10 +11,10 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.anytypeio.anytype.core_ui.foundation.Dragger
import com.anytypeio.anytype.core_ui.views.BodyRegular
import com.anytypeio.anytype.core_ui.views.Title1
import com.anytypeio.anytype.ui_settings.R
@Composable
@ -38,8 +38,7 @@ fun AboutAppScreen(
) {
Text(
text = stringResource(R.string.about),
fontWeight = FontWeight.Bold,
fontSize = 28.sp,
style = Title1,
color = colorResource(R.color.text_primary)
)
}
@ -54,7 +53,7 @@ fun AboutAppScreen(
Box(modifier = Modifier.weight(1.0f, true)) {
Text(
text = stringResource(R.string.app_version),
fontSize = 17.sp,
style = BodyRegular,
color = colorResource(R.color.text_secondary)
)
}
@ -64,7 +63,7 @@ fun AboutAppScreen(
) {
Text(
text = version,
fontSize = 17.sp,
style = BodyRegular,
color = colorResource(R.color.text_primary)
)
}
@ -80,7 +79,7 @@ fun AboutAppScreen(
Box(modifier = Modifier.weight(1.0f, true)) {
Text(
text = stringResource(R.string.library),
fontSize = 17.sp,
style = BodyRegular,
color = colorResource(R.color.text_secondary)
)
}
@ -90,7 +89,7 @@ fun AboutAppScreen(
) {
Text(
text = libraryVersion,
fontSize = 17.sp,
style = BodyRegular,
color = colorResource(R.color.text_primary)
)
}
@ -106,7 +105,7 @@ fun AboutAppScreen(
Box(modifier = Modifier.weight(1.0f, true)) {
Text(
text = stringResource(R.string.user_id),
fontSize = 17.sp,
style = BodyRegular,
color = colorResource(R.color.text_secondary)
)
}
@ -116,7 +115,7 @@ fun AboutAppScreen(
) {
Text(
text = anytypeId,
fontSize = 17.sp,
style = BodyRegular,
color = colorResource(R.color.text_primary)
)
}

29
ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/account/AccountAndDataScreen.kt
View file

@ -48,6 +48,9 @@ import com.anytypeio.anytype.core_ui.foundation.Divider
import com.anytypeio.anytype.core_ui.foundation.Dragger
import com.anytypeio.anytype.core_ui.foundation.Option
import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
import com.anytypeio.anytype.core_ui.views.BodyRegular
import com.anytypeio.anytype.core_ui.views.Caption1Regular
import com.anytypeio.anytype.core_ui.views.Title1
import com.anytypeio.anytype.presentation.profile.ProfileIconView
import com.anytypeio.anytype.ui_settings.R
import com.anytypeio.anytype.ui_settings.main.NameBlock
@ -105,19 +108,19 @@ fun AccountAndDataScreen(
Divider()
}
Section(stringResource(R.string.account))
Action(
name = stringResource(R.string.delete_account),
color = colorResource(R.color.text_primary),
onClick = onDeleteAccountClicked
)
Divider()
ActionWithProgressBar(
name = stringResource(R.string.log_out),
color = colorResource(R.color.palette_dark_red),
color = colorResource(R.color.text_primary),
onClick = onLogoutClicked,
isInProgress = isLogoutInProgress
)
Divider()
Action(
name = stringResource(R.string.delete_account),
color = colorResource(R.color.palette_dark_red),
onClick = onDeleteAccountClicked
)
Divider()
Box(Modifier.height(54.dp))
}
}
@ -132,12 +135,12 @@ fun Section(name: String) {
) {
Text(
text = name,
fontSize = 13.sp,
modifier = Modifier.padding(
start = 20.dp,
bottom = 8.dp
),
color = colorResource(R.color.text_secondary)
color = colorResource(R.color.text_secondary),
style = Caption1Regular
)
}
}
@ -199,7 +202,7 @@ fun Action(
Text(
text = name,
color = color,
fontSize = 17.sp,
style = BodyRegular,
modifier = Modifier.padding(
start = 20.dp
)
@ -224,7 +227,7 @@ fun ActionWithProgressBar(
Text(
text = name,
color = color,
fontSize = 17.sp,
style = BodyRegular,
modifier = Modifier.padding(
start = 20.dp
)
@ -345,10 +348,10 @@ fun NameBlock(
}
@Composable
fun ProfileNameBlock(modifier: Modifier = Modifier) {
fun ProfileNameBlock() {
Text(
text = stringResource(R.string.account_and_data),
style = MaterialTheme.typography.h3,
style = Title1,
color = colorResource(id = R.color.text_primary)
)
}

10
ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/appearance/AppearanceScreen.kt
View file

@ -47,6 +47,8 @@ import com.anytypeio.anytype.core_ui.foundation.Divider
import com.anytypeio.anytype.core_ui.foundation.Dragger
import com.anytypeio.anytype.core_ui.foundation.Option
import com.anytypeio.anytype.core_ui.foundation.Toolbar
import com.anytypeio.anytype.core_ui.views.Caption1Medium
import com.anytypeio.anytype.core_ui.views.Caption2Regular
import com.anytypeio.anytype.ui_settings.R
@ -83,8 +85,8 @@ fun AppearanceScreen(
.padding(top = 18.dp, bottom = 12.dp),
textAlign = TextAlign.Center,
text = stringResource(R.string.mode),
style = MaterialTheme.typography.body2,
color = colorResource(com.anytypeio.anytype.core_ui.R.color.text_secondary),
style = Caption1Medium,
color = colorResource(R.color.text_secondary),
)
Row(
modifier = Modifier
@ -251,8 +253,8 @@ fun ModeNameText(
) {
Text(
text = stringResource(id = id),
style = MaterialTheme.typography.caption,
color = colorResource(com.anytypeio.anytype.core_ui.R.color.text_secondary),
style = Caption2Regular,
color = colorResource(R.color.text_secondary),
modifier = Modifier.padding(top = 4.dp)
)
}

6
ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/MainSettingScreen.kt
View file

@ -29,6 +29,7 @@ import com.anytypeio.anytype.core_ui.foundation.Arrow
import com.anytypeio.anytype.core_ui.foundation.Divider
import com.anytypeio.anytype.core_ui.foundation.Dragger
import com.anytypeio.anytype.core_ui.foundation.Option
import com.anytypeio.anytype.core_ui.views.BodyRegular
import com.anytypeio.anytype.presentation.profile.ProfileIconView
import com.anytypeio.anytype.presentation.settings.MainSettingsViewModel
import com.anytypeio.anytype.ui_settings.R
@ -217,10 +218,11 @@ fun AccountOption(
Text(
text = text,
color = colorResource(com.anytypeio.anytype.core_ui.R.color.text_primary),
color = colorResource(R.color.text_primary),
modifier = Modifier.padding(
start = 12.dp
)
),
style = BodyRegular
)
Box(
modifier = Modifier.weight(1.0f, true),

21
ui-settings/src/main/java/com/anytypeio/anytype/ui_settings/main/Views.kt
View file

@ -14,7 +14,6 @@ import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.material.TextFieldDefaults
import androidx.compose.runtime.Composable
@ -29,15 +28,15 @@ import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.platform.LocalFocusManager
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.text.input.VisualTransformation
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.rememberAsyncImagePainter
import com.anytypeio.anytype.core_ui.foundation.noRippleClickable
import com.anytypeio.anytype.core_ui.views.Caption1Regular
import com.anytypeio.anytype.core_ui.views.HeadlineHeading
import com.anytypeio.anytype.core_ui.views.Title1
import com.anytypeio.anytype.emojifier.Emojifier
import com.anytypeio.anytype.presentation.spaces.SpaceIconView
import com.anytypeio.anytype.ui_settings.R
@ -48,7 +47,7 @@ fun Section(modifier: Modifier = Modifier, title: String) {
modifier = modifier,
text = title,
color = colorResource(id = R.color.text_secondary),
fontSize = 13.sp
style = Caption1Regular
)
}
@ -65,8 +64,8 @@ fun NameBlock(
Column(modifier = modifier.padding(start = 20.dp)) {
Text(
text = "Name",
color = colorResource(id = R.color.text_secondary),
fontSize = 13.sp
style = Caption1Regular,
color = colorResource(id = R.color.text_secondary)
)
SettingsTextField(
value = nameValue.value,
@ -87,7 +86,7 @@ fun NameBlock(
fun SpaceNameBlock() {
Text(
text = "Space",
style = MaterialTheme.typography.h3,
style = Title1,
color = colorResource(id = R.color.text_primary)
)
}
@ -168,11 +167,7 @@ fun SettingsTextField(
onValueChange = onValueChange,
enabled = true,
readOnly = false,
textStyle = TextStyle(
fontSize = 22.sp,
fontWeight = FontWeight.SemiBold,
color = colorResource(id = R.color.text_primary)
),
textStyle = HeadlineHeading.copy(color = colorResource(id = R.color.text_primary)),
cursorBrush = SolidColor(colorResource(id = R.color.orange)),
visualTransformation = visualTransformation,
keyboardOptions = KeyboardOptions(