Added new UI design
This commit is contained in:
parent
c5f7ddf266
commit
9ea8d0c99a
@ -39,7 +39,7 @@ val darkBlueTheme = ColorsScheme(
|
||||
background = Color(0xFF0E1621),
|
||||
backgroundSelected = Color(0xFF2f3640),
|
||||
surface = Color(0xFF182533),
|
||||
headerBackground = Color(0xFF0a2b4a),
|
||||
headerBackground = Color(0xFF0a335c),
|
||||
borderColor = Color(0xFF989898),
|
||||
graphHeaderBackground = Color(0xFF303132),
|
||||
addFile = Color(0xFF32A852),
|
||||
|
@ -75,7 +75,7 @@ fun CommitChangesView(
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(horizontal = 8.dp),
|
||||
.padding(end = 8.dp),
|
||||
) {
|
||||
SelectionContainer {
|
||||
Text(
|
||||
@ -100,7 +100,7 @@ fun CommitChangesView(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.weight(1f, fill = true)
|
||||
.padding(horizontal = 8.dp, vertical = 8.dp)
|
||||
.padding(end = 8.dp, top = 8.dp, bottom = 8.dp)
|
||||
.background(MaterialTheme.colors.background)
|
||||
) {
|
||||
Text(
|
||||
|
@ -38,6 +38,7 @@ import app.git.diff.DiffResult
|
||||
import app.git.diff.Hunk
|
||||
import app.git.diff.Line
|
||||
import app.git.diff.LineType
|
||||
import app.theme.headerBackground
|
||||
import app.theme.primaryTextColor
|
||||
import app.theme.stageButton
|
||||
import app.theme.unstageButton
|
||||
@ -304,8 +305,8 @@ fun DiffHeader(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.height(50.dp)
|
||||
.background(MaterialTheme.colors.surface)
|
||||
.padding(start = 8.dp, end = 8.dp, top = 8.dp),
|
||||
.background(MaterialTheme.colors.headerBackground)
|
||||
.padding(start = 8.dp, end = 8.dp),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
) {
|
||||
val filePath = if (diffEntry.newPath != "/dev/null")
|
||||
|
@ -2,6 +2,7 @@
|
||||
|
||||
package app.ui
|
||||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.border
|
||||
import androidx.compose.foundation.layout.*
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
@ -9,6 +10,10 @@ import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.Text
|
||||
import androidx.compose.runtime.*
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.graphics.SolidColor
|
||||
import androidx.compose.ui.input.pointer.PointerIcon
|
||||
import androidx.compose.ui.input.pointer.pointerHoverIcon
|
||||
import androidx.compose.ui.unit.dp
|
||||
import app.git.DiffEntryType
|
||||
import app.theme.borderColor
|
||||
@ -23,7 +28,9 @@ import org.eclipse.jgit.lib.RepositoryState
|
||||
import org.eclipse.jgit.revwalk.RevCommit
|
||||
import org.jetbrains.compose.splitpane.ExperimentalSplitPaneApi
|
||||
import org.jetbrains.compose.splitpane.HorizontalSplitPane
|
||||
import org.jetbrains.compose.splitpane.SplitterScope
|
||||
import org.jetbrains.compose.splitpane.rememberSplitPaneState
|
||||
import java.awt.Cursor
|
||||
|
||||
|
||||
@OptIn(androidx.compose.ui.ExperimentalComposeUiApi::class)
|
||||
@ -117,11 +124,9 @@ fun MainContentView(
|
||||
) {
|
||||
Row {
|
||||
HorizontalSplitPane {
|
||||
first(minSize = 200.dp) {
|
||||
first(minSize = 250.dp) {
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.widthIn(min = 300.dp)
|
||||
.weight(0.15f)
|
||||
.fillMaxHeight()
|
||||
) {
|
||||
Branches(
|
||||
@ -139,6 +144,10 @@ fun MainContentView(
|
||||
}
|
||||
}
|
||||
|
||||
splitter {
|
||||
this.repositorySplitter()
|
||||
}
|
||||
|
||||
second {
|
||||
HorizontalSplitPane(
|
||||
splitPaneState = rememberSplitPaneState(0.9f)
|
||||
@ -147,11 +156,6 @@ fun MainContentView(
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.fillMaxSize()
|
||||
.border(
|
||||
width = 2.dp,
|
||||
color = MaterialTheme.colors.borderColor,
|
||||
shape = RoundedCornerShape(4.dp)
|
||||
)
|
||||
) {
|
||||
if (blameState is BlameState.Loaded && !blameState.isMinimized) {
|
||||
Blame(
|
||||
@ -191,6 +195,10 @@ fun MainContentView(
|
||||
}
|
||||
}
|
||||
|
||||
splitter {
|
||||
this.repositorySplitter()
|
||||
}
|
||||
|
||||
second(minSize = 300.dp) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
@ -246,6 +254,27 @@ fun MainContentView(
|
||||
}
|
||||
}
|
||||
|
||||
fun SplitterScope.repositorySplitter() {
|
||||
visiblePart {
|
||||
Box(
|
||||
Modifier
|
||||
.width(8.dp)
|
||||
.fillMaxHeight()
|
||||
.background(Color.Transparent)
|
||||
)
|
||||
}
|
||||
handle {
|
||||
Box(
|
||||
Modifier
|
||||
.markAsHandle()
|
||||
.pointerHoverIcon(PointerIcon(Cursor(Cursor.E_RESIZE_CURSOR)))
|
||||
.background(Color.Transparent)
|
||||
.width(8.dp)
|
||||
.fillMaxHeight()
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
sealed class SelectedItem {
|
||||
object None : SelectedItem()
|
||||
object UncommitedChanges : SelectedItem()
|
||||
|
@ -94,7 +94,7 @@ fun UncommitedChanges(
|
||||
|
||||
EntriesList(
|
||||
modifier = Modifier
|
||||
.padding(start = 8.dp, end = 8.dp, bottom = 4.dp)
|
||||
.padding(end = 8.dp, bottom = 4.dp)
|
||||
.weight(5f)
|
||||
.fillMaxWidth(),
|
||||
title = "Staged",
|
||||
@ -123,7 +123,7 @@ fun UncommitedChanges(
|
||||
|
||||
EntriesList(
|
||||
modifier = Modifier
|
||||
.padding(start = 8.dp, end = 8.dp, top = 4.dp)
|
||||
.padding(end = 8.dp, top = 8.dp)
|
||||
.weight(5f)
|
||||
.fillMaxWidth(),
|
||||
title = "Unstaged",
|
||||
@ -155,7 +155,7 @@ fun UncommitedChanges(
|
||||
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.padding(8.dp)
|
||||
.padding(top = 8.dp, bottom = 8.dp, end = 8.dp)
|
||||
.run {
|
||||
// When rebasing, we don't need a fixed size as we don't show the message TextField
|
||||
if (!repositoryState.isRebasing) {
|
||||
|
@ -35,7 +35,7 @@ fun ScrollableLazyColumn(
|
||||
modifier = Modifier
|
||||
.align(Alignment.CenterEnd)
|
||||
.fillMaxHeight()
|
||||
.padding(end = 4.dp),
|
||||
.padding(end = 2.dp),
|
||||
style = LocalScrollbarStyle.current.copy(
|
||||
unhoverColor = MaterialTheme.colors.scrollbarNormal,
|
||||
hoverColor = MaterialTheme.colors.scrollbarHover,
|
||||
|
@ -229,8 +229,7 @@ fun SearchFilter(
|
||||
Row(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.height(64.dp)
|
||||
.background(MaterialTheme.colors.graphHeaderBackground),
|
||||
.height(64.dp),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
) {
|
||||
TextField(
|
||||
@ -530,11 +529,14 @@ fun GraphHeader(
|
||||
modifier = Modifier.fillMaxWidth()
|
||||
) {
|
||||
Row(
|
||||
modifier = Modifier.fillMaxWidth().height(48.dp).background(MaterialTheme.colors.graphHeaderBackground),
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.height(40.dp)
|
||||
.background(MaterialTheme.colors.headerBackground),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
) {
|
||||
Text(
|
||||
modifier = Modifier.width(graphWidth).padding(start = 8.dp),
|
||||
modifier = Modifier.width(graphWidth).padding(start = 16.dp),
|
||||
text = "Graph",
|
||||
color = MaterialTheme.colors.headerText,
|
||||
fontSize = 14.sp,
|
||||
@ -550,7 +552,9 @@ fun GraphHeader(
|
||||
)
|
||||
|
||||
Text(
|
||||
modifier = Modifier.padding(start = 8.dp).weight(1f),
|
||||
modifier = Modifier
|
||||
.padding(start = 16.dp)
|
||||
.weight(1f),
|
||||
text = "Message",
|
||||
color = MaterialTheme.colors.headerText,
|
||||
fontSize = 14.sp,
|
||||
@ -586,7 +590,8 @@ fun UncommitedChangesLine(
|
||||
.fillMaxWidth()
|
||||
.clickable { onUncommitedChangesSelected() }
|
||||
.padding(start = graphWidth)
|
||||
.backgroundIf(isSelected, MaterialTheme.colors.backgroundSelected),
|
||||
.backgroundIf(isSelected, MaterialTheme.colors.backgroundSelected)
|
||||
.padding(DIVIDER_WIDTH.dp),
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
) {
|
||||
val text = when {
|
||||
|
Loading…
Reference in New Issue
Block a user