Unified buttons styles

This commit is contained in:
Abdelilah El Aissaoui 2022-10-15 00:27:15 +02:00
parent 65fbab2bd8
commit ff3adee916
13 changed files with 99 additions and 143 deletions

View File

@ -67,7 +67,7 @@ fun RepositoryOpenPage(tabViewModel: TabViewModel) {
if (showNewBranchDialog) {
NewBranchDialog(
onReject = {
onClose = {
showNewBranchDialog = false
},
onAccept = { branchName ->

View File

@ -4,15 +4,18 @@ package com.jetpackduba.gitnuro.ui
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.BiasAlignment
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.graphics.painter.Painter
@ -20,9 +23,7 @@ import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.AppConstants
import com.jetpackduba.gitnuro.AppStateManager
import com.jetpackduba.gitnuro.extensions.dirName
import com.jetpackduba.gitnuro.extensions.dirPath
import com.jetpackduba.gitnuro.extensions.openUrlInBrowser
import com.jetpackduba.gitnuro.extensions.*
import com.jetpackduba.gitnuro.theme.secondaryTextColor
import com.jetpackduba.gitnuro.theme.textButtonColors
import com.jetpackduba.gitnuro.ui.dialogs.AppInfoDialog
@ -52,7 +53,7 @@ fun WelcomePage(
Box(
modifier = Modifier
.fillMaxSize()
.background(MaterialTheme.colors.background),
.background(MaterialTheme.colors.surface),
) {
Row(
horizontalArrangement = Arrangement.Center,
@ -196,7 +197,7 @@ fun RecentRepositories(appStateManager: AppStateManager, tabViewModel: TabViewMo
Text(
text = "Recent",
style = MaterialTheme.typography.h3,
modifier = Modifier.padding(top = 48.dp, bottom = 8.dp),
modifier = Modifier.padding(top = 48.dp, bottom = 4.dp),
)
if (latestOpenedRepositoriesPaths.isEmpty()) {
@ -214,18 +215,21 @@ fun RecentRepositories(appStateManager: AppStateManager, tabViewModel: TabViewMo
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.padding(vertical = 4.dp)
) {
TextButton(
onClick = {
Box(
modifier = Modifier
.clip(RoundedCornerShape(4.dp))
.handMouseClickable {
tabViewModel.openRepository(repo)
},
colors = textButtonColors(),
) {
Text(
text = repoDirName,
style = MaterialTheme.typography.body1,
maxLines = 1,
color = MaterialTheme.colors.primaryVariant
color = MaterialTheme.colors.primaryVariant,
modifier = Modifier.padding(8.dp)
)
}
@ -252,7 +256,10 @@ fun ButtonTile(
) {
OutlinedButton(
onClick = onClick,
modifier = modifier.size(width = 280.dp, height = 56.dp)
modifier = modifier
.size(width = 280.dp, height = 56.dp)
.handOnHover(),
colors = ButtonDefaults.outlinedButtonColors(backgroundColor = MaterialTheme.colors.primary)
) {
Row(
modifier = Modifier.fillMaxSize(),
@ -264,14 +271,14 @@ fun ButtonTile(
.size(24.dp),
painter = painter,
contentDescription = null,
colorFilter = ColorFilter.tint(MaterialTheme.colors.primaryVariant),
colorFilter = ColorFilter.tint(MaterialTheme.colors.onBackground),
)
Text(
text = title,
maxLines = 1,
style = MaterialTheme.typography.body1,
color = MaterialTheme.colors.primaryVariant,
color = MaterialTheme.colors.onBackground,
)
}
}

View File

@ -1,12 +1,17 @@
package com.jetpackduba.gitnuro.ui.components
import androidx.compose.material.Button
import androidx.compose.material.ButtonDefaults
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.extensions.handMouseClickable
@Composable
@ -14,22 +19,23 @@ fun PrimaryButton(
modifier: Modifier = Modifier,
text: String,
enabled: Boolean = true,
backgroundColor: Color = MaterialTheme.colors.primary,
textColor: Color = MaterialTheme.colors.onPrimary,
disabledTextColor: Color = MaterialTheme.colors.onBackground,
onClick: () -> Unit,
) {
Button(
onClick = onClick,
modifier = modifier,
enabled = enabled,
colors = ButtonDefaults.buttonColors(
backgroundColor = MaterialTheme.colors.primary,
contentColor = textColor
),
Box(
modifier = modifier
.clip(RoundedCornerShape(4.dp))
.background(backgroundColor)
.handMouseClickable {
onClick()
},
) {
Text(
text,
color = if(enabled) textColor else disabledTextColor
modifier = Modifier.padding(horizontal = 12.dp, vertical = 6.dp),
color = if (enabled) textColor else disabledTextColor
)
}
}

View File

@ -5,17 +5,15 @@ import androidx.compose.foundation.layout.*
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.material.TextButton
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.jetpackduba.gitnuro.theme.outlinedTextFieldColors
import com.jetpackduba.gitnuro.theme.textButtonColors
import com.jetpackduba.gitnuro.ui.components.AdjustableOutlinedTextField
import com.jetpackduba.gitnuro.ui.components.PrimaryButton
import com.jetpackduba.gitnuro.viewmodels.AuthorViewModel
@ -103,19 +101,12 @@ fun AuthorDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
colors = textButtonColors(),
onClick = {
onClose()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onClose,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
onClick = {
authorViewModel.saveAuthorInfo(
@ -126,7 +117,7 @@ fun AuthorDialog(
)
onClose()
},
text = "Save"
text = "Save data"
)
}
}

View File

@ -15,6 +15,7 @@ import androidx.compose.ui.focus.FocusProperties
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.git.CloneStatus
@ -196,25 +197,17 @@ private fun CloneInput(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier
.padding(end = 8.dp)
PrimaryButton(
text = "Cancel",
modifier = Modifier.padding(end = 8.dp)
.focusRequester(cancelButtonFocusRequester)
.focusProperties {
previous = cloneButtonFocusRequester
next = urlFocusRequester
},
colors = textButtonColors(),
onClick = {
onClose()
}
) {
Text(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
onClick = onClose,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
onClick = {
cloneViewModel.clone(directory, url)

View File

@ -8,28 +8,27 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.onPreviewKeyEvent
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.keybindings.KeybindingOption
import com.jetpackduba.gitnuro.keybindings.matchesBinding
import com.jetpackduba.gitnuro.theme.outlinedTextFieldColors
import com.jetpackduba.gitnuro.theme.secondaryTextColor
import com.jetpackduba.gitnuro.theme.textButtonColors
import com.jetpackduba.gitnuro.ui.components.AdjustableOutlinedTextField
import com.jetpackduba.gitnuro.ui.components.PrimaryButton
@Composable
fun NewBranchDialog(
onReject: () -> Unit,
onClose: () -> Unit,
onAccept: (branchName: String) -> Unit
) {
var branchField by remember { mutableStateOf("") }
val branchFieldFocusRequester = remember { FocusRequester() }
val buttonFieldFocusRequester = remember { FocusRequester() }
MaterialDialog(onCloseRequested = onReject) {
MaterialDialog(onCloseRequested = onClose) {
Column(
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center,
@ -86,19 +85,12 @@ fun NewBranchDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
colors = textButtonColors(),
onClick = {
onReject()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onClose,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
modifier = Modifier
.focusRequester(buttonFieldFocusRequester)

View File

@ -8,6 +8,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.onPreviewKeyEvent
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.style.TextAlign
@ -85,19 +86,12 @@ fun NewTagDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
colors = textButtonColors(),
onClick = {
onReject()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onReject,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
modifier = Modifier
.focusRequester(buttonFieldFocusRequester)

View File

@ -9,6 +9,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.onPreviewKeyEvent
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.input.PasswordVisualTransformation
@ -92,18 +93,12 @@ fun PasswordDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
onClick = {
onReject()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onReject,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
modifier = Modifier
.focusRequester(buttonFieldFocusRequester)

View File

@ -12,6 +12,7 @@ import androidx.compose.runtime.*
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.res.painterResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
@ -92,19 +93,12 @@ fun ResetBranchDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
colors = textButtonColors(),
onClick = {
onReject()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onReject,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
onClick = {
onAccept(resetType)

View File

@ -12,6 +12,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.onPreviewKeyEvent
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.keybindings.KeybindingOption
@ -69,19 +70,12 @@ fun StashWithMessageDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
colors = textButtonColors(),
onClick = {
onReject()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onReject,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
modifier = Modifier
.focusRequester(buttonFieldFocusRequester)

View File

@ -12,6 +12,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusProperties
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.onPreviewKeyEvent
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.unit.dp
@ -120,19 +121,12 @@ fun UserPasswordDialog(
.padding(top = 16.dp)
.align(Alignment.End)
) {
TextButton(
modifier = Modifier.padding(end = 8.dp),
colors = textButtonColors(),
onClick = {
onReject()
}
) {
Text(
PrimaryButton(
text = "Cancel",
color = MaterialTheme.colors.onBackground,
style = MaterialTheme.typography.body1,
modifier = Modifier.padding(end = 8.dp),
onClick = onReject,
backgroundColor = Color.Transparent
)
}
PrimaryButton(
modifier = Modifier
.focusRequester(buttonFieldFocusRequester)

View File

@ -7,6 +7,7 @@ import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.input.KeyboardType
@ -16,6 +17,7 @@ import com.jetpackduba.gitnuro.extensions.handMouseClickable
import com.jetpackduba.gitnuro.preferences.DEFAULT_UI_SCALE
import com.jetpackduba.gitnuro.theme.*
import com.jetpackduba.gitnuro.ui.components.AdjustableOutlinedTextField
import com.jetpackduba.gitnuro.ui.components.PrimaryButton
import com.jetpackduba.gitnuro.ui.components.ScrollableColumn
import com.jetpackduba.gitnuro.ui.dialogs.MaterialDialog
import com.jetpackduba.gitnuro.ui.dropdowns.DropDownOption
@ -95,24 +97,18 @@ fun SettingsDialog(
}
}
TextButton(
PrimaryButton(
text = "Accept",
modifier = Modifier
.padding(end = 8.dp)
.padding(end = 8.dp, bottom = 8.dp)
.align(Alignment.End),
colors = textButtonColors(),
onClick = {
settingsViewModel.savePendingChanges()
onDismiss()
}
) {
Text(
"Close",
style = MaterialTheme.typography.body1.copy(color = MaterialTheme.colors.primaryVariant)
},
)
}
}
}
}
@Composable

View File

@ -521,7 +521,7 @@ fun LogDialogs(
) {
when (showLogDialog) {
is LogDialog.NewBranch -> {
NewBranchDialog(onReject = onResetShowLogDialog, onAccept = { branchName ->
NewBranchDialog(onClose = onResetShowLogDialog, onAccept = { branchName ->
logViewModel.createBranchOnCommit(branchName, showLogDialog.graphNode)
onResetShowLogDialog()
})