Skip to content

Commit

Permalink
Polishing icons for edition menu (#348)
Browse files Browse the repository at this point in the history 
Co-authored-by: CI Bot <[email protected]>
  • Loading branch information
@leandroBorgesFerreira
leandroBorgesFerreira and CI Bot authored Feb 19, 2025
1 parent 29e5da2 commit cb52e83
Show file tree
Hide file tree
Showing 2 changed files with 63 additions and 33 deletions.
36 changes: 25 additions & 11 deletions application/features/editor/src/androidMain/kotlin/io/writeopia/editor/input/InputScreen.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import io.writeopia.common.utils.icons.WrIcons
Expand Down Expand Up @@ -47,13 +48,22 @@ internal fun InputScreen(
verticalAlignment = Alignment.CenterVertically
) {
Box(modifier = Modifier.fillMaxSize()) {
Row(modifier = Modifier.align(Alignment.Center).padding(horizontal = 12.dp)) {
val clipShape = MaterialTheme.shapes.medium
val iconPadding = 4.dp

Row(
modifier = Modifier
.align(Alignment.Center)
.padding(horizontal = 12.dp),
verticalAlignment = Alignment.CenterVertically
) {
Icon(
modifier = Modifier
.padding(10.dp)
.clip(clipShape)
.clickable {
onAddSpan(Span.BOLD)
},
}
.padding(iconPadding),
imageVector = WrIcons.bold,
contentDescription = "Bold",
// stringResource(R.string.undo),
Expand All @@ -64,10 +74,11 @@ internal fun InputScreen(

Icon(
modifier = Modifier
.padding(10.dp)
.clip(clipShape)
.clickable {
onAddSpan(Span.ITALIC)
},
}
.padding(iconPadding),
imageVector = WrIcons.italic,
contentDescription = "Italic",
// stringResource(R.string.undo),
Expand All @@ -78,10 +89,11 @@ internal fun InputScreen(

Icon(
modifier = Modifier
.padding(10.dp)
.clip(clipShape)
.clickable {
onAddSpan(Span.UNDERLINE)
},
}
.padding(iconPadding),
imageVector = WrIcons.underline,
contentDescription = "Underline",
// stringResource(R.string.undo),
Expand All @@ -92,12 +104,13 @@ internal fun InputScreen(

Icon(
modifier = Modifier
.padding(10.dp)
.clip(clipShape)
.clickable {
if (canUndo) {
onBackPress()
}
},
}
.padding(iconPadding),
imageVector = WrIcons.undo,
contentDescription = "",
// stringResource(R.string.undo),
Expand All @@ -108,12 +121,13 @@ internal fun InputScreen(

Icon(
modifier = Modifier
.padding(10.dp)
.clip(clipShape)
.clickable {
if (canRedo) {
onForwardPress()
}
},
}
.padding(iconPadding),
imageVector = WrIcons.redo,
contentDescription = "",
// stringResource(R.string.redo),
Expand Down
60 changes: 38 additions & 22 deletions writeopia_ui/src/commonMain/kotlin/io/writeopia/ui/components/EditionScreen.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,12 @@ package io.writeopia.ui.components

import androidx.compose.foundation.clickable
import androidx.compose.foundation.horizontalScroll
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
Expand All @@ -16,6 +18,7 @@ import androidx.compose.material.icons.outlined.FormatUnderlined
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.unit.dp
Expand All @@ -35,15 +38,20 @@ fun EditionScreen(
onDelete: () -> Unit = {},
onClose: () -> Unit = {},
) {
Row(modifier = modifier) {
val iconPadding = PaddingValues(vertical = 4.dp)
val clipShape = MaterialTheme.shapes.medium
val iconSize = 36.dp
val spaceWidth = 8.dp

Row(modifier = modifier.padding(8.dp), verticalAlignment = Alignment.CenterVertically) {
Icon(
modifier = Modifier
.clip(clipShape)
.clickable {
onSpanClick(Span.BOLD)
}
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = Icons.Outlined.FormatBold,
contentDescription = "BOLD",
// contentDescription = stringResource(R.string.delete),
Expand All @@ -52,62 +60,70 @@ fun EditionScreen(

Icon(
modifier = Modifier
.clip(clipShape)
.clickable {
onSpanClick(Span.ITALIC)
}
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = Icons.Outlined.FormatItalic,
contentDescription = "ITALIC",
// contentDescription = stringResource(R.string.delete),
tint = MaterialTheme.colorScheme.onPrimary
)

Spacer(modifier = Modifier.width(spaceWidth))

Icon(
modifier = Modifier
.clip(clipShape)
.clickable {
onSpanClick(Span.UNDERLINE)
}
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = Icons.Outlined.FormatUnderlined,
contentDescription = "UNDERLINE",
// contentDescription = stringResource(R.string.delete),
tint = MaterialTheme.colorScheme.onPrimary
)

Spacer(modifier = Modifier.width(spaceWidth))

Icon(
modifier = Modifier
.clip(clipShape)
.clickable(onClick = checkboxClick)
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = WrSdkIcons.checkbox,
contentDescription = "Checkbox",
// contentDescription = stringResource(R.string.delete),
tint = MaterialTheme.colorScheme.onPrimary
)

Spacer(modifier = Modifier.width(spaceWidth))

Icon(
modifier = Modifier
.clip(clipShape)
.clickable(onClick = listItemClick)
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = WrSdkIcons.list,
contentDescription = "List item",
// contentDescription = stringResource(R.string.delete),
tint = MaterialTheme.colorScheme.onPrimary
)

Spacer(modifier = Modifier.width(spaceWidth))

Icon(
modifier = Modifier
.clip(clipShape)
.clickable(onClick = onDelete)
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = Icons.Default.DeleteOutline,
contentDescription = "Delete",
// contentDescription = stringResource(R.string.delete),
Expand All @@ -118,10 +134,10 @@ fun EditionScreen(

Icon(
modifier = Modifier
.clip(clipShape)
.clickable(onClick = onClose)
.size(50.dp)
.padding(12.dp)
.clip(RoundedCornerShape(8.dp)),
.size(iconSize)
.padding(iconPadding),
imageVector = WrSdkIcons.close,
contentDescription = "List item",
// contentDescription = stringResource(R.string.delete),
Expand Down

0 comments on commit cb52e83

Please sign in to comment.