app style: made it prettier again

src/main/kotlin/xyz/atnrch/wrench/components/WatcherDisplay.kt

@@ -1,29 +1,51 @@
 package xyz.atnrch.wrench.components
 
-import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.layout.Row
+import androidx.compose.material.ButtonDefaults
-import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.material.Icon
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material.Text
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.rounded.QuestionMark
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
 import xyz.atnrch.wrench.components.center.input.InputEntries
 import xyz.atnrch.wrench.components.center.output.OutputEntries
+import xyz.atnrch.wrench.ui.Fonts
 import xyz.atnrch.wrench.watcher.WatcherManager
+import java.io.File
 
 @Composable
 fun WatcherDisplay(watcherManager: WatcherManager) {
     var currentClick by remember { mutableStateOf(-1) }
-
+    Row(
-    Row {
+        modifier = Modifier.padding(0.dp, 0.dp, 0.dp, 55.dp)
+    ) {
         if (watcherManager.getEntries().isEmpty()) {
-            //watcherManager.addFile(File("/home/aro/IdeaProjects/Wrench/dummy"))
+            watcherManager.addFile(File("/home/aro/IdeaProjects/Wrench/dummy"))
             Box(
                 contentAlignment = Alignment.Center,
                 modifier = Modifier.fillMaxWidth().fillMaxHeight()
             ) {
-                Text("Add a file to start...")
+                Row(
+                    verticalAlignment = Alignment.CenterVertically,
+                    horizontalArrangement = Arrangement.SpaceEvenly
+                ) {
+                    Icon(
+                        imageVector = Icons.Rounded.QuestionMark,
+                        tint = Color.White,
+                        contentDescription = "Open Folder",
+                        modifier = Modifier.size(ButtonDefaults.IconSize)
+                    )
+                    Spacer(Modifier.size(ButtonDefaults.IconSpacing))
+                    Text(
+                        text = "Add a file to start...",
+                        fontFamily = Fonts.ROBOTO_REGULAR,
+                        color = Color.White
+                    )
+                }
             }
         } else {
             InputEntries(watcherManager) { currentClick = it }

src/main/kotlin/xyz/atnrch/wrench/components/WrenchScaffold.kt

@@ -11,6 +11,7 @@ import xyz.atnrch.wrench.components.bottom.BottomAppBar
 import xyz.atnrch.wrench.components.bottom.FloatingButton
 import xyz.atnrch.wrench.components.top.TopBar
 import xyz.atnrch.wrench.compose.SnackBarDataHolder
+import xyz.atnrch.wrench.ui.UIColors
 import xyz.atnrch.wrench.watcher.Watcher
 import xyz.atnrch.wrench.watcher.WatcherEntry
 import xyz.atnrch.wrench.watcher.WatcherManager
@@ -28,6 +29,7 @@ fun WrenchScaffold() {
         topBar = { TopBar() },
         floatingActionButton = { FloatingButton(watcherManager) },
         isFloatingActionButtonDocked = true,
+        backgroundColor = UIColors.PRIMARY,
         bottomBar = { BottomAppBar(watcher) }
     ) { WatcherDisplay(watcherManager) }
 }

src/main/kotlin/xyz/atnrch/wrench/components/bottom/BottomBar.kt

@@ -14,6 +14,6 @@ fun BottomAppBar(
         cutoutShape = MaterialTheme.shapes.small.copy(
             CornerSize(percent = 50)
         ),
-        backgroundColor = UIColors.PRIMARY
+        backgroundColor = UIColors.DARK
     ) { BottomRowNew(watcher) }
 }

src/main/kotlin/xyz/atnrch/wrench/components/bottom/FloatingAddButton.kt

@@ -30,7 +30,7 @@ fun FloatingButton(
                 Logger.info("No file selected.")
             })
         },
-        backgroundColor = UIColors.PRIMARY,
+        backgroundColor = UIColors.DARK,
         modifier = Modifier.border(
             4.dp,
             UIColors.ORANGE,

src/main/kotlin/xyz/atnrch/wrench/components/bottom/WatcherStatusButton.kt

@@ -4,12 +4,14 @@ import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Button
 import androidx.compose.material.ButtonDefaults
 import androidx.compose.material.Icon
 import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.NoteAdd
 import androidx.compose.material.icons.filled.Update
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
@@ -20,27 +22,53 @@ import xyz.atnrch.wrench.ui.UIColors
 import xyz.atnrch.wrench.watcher.Watcher
 
 @Composable
-fun BottomRowNew(watcher: Watcher) {
+fun BottomRowNew(
+    watcher: Watcher
+) {
+    Spacer(Modifier.width(10.dp))
     Button(
         onClick = { watcher.move() },
-        colors = ButtonDefaults.buttonColors(UIColors.PRIMARY, Color.White),
+        colors = ButtonDefaults.buttonColors(UIColors.DARK, Color.White),
         contentPadding = PaddingValues(
-            start = 18.dp,
+            start = 14.dp,
             top = 6.dp,
-            end = 18.dp,
+            end = 14.dp,
             bottom = 6.dp
         ),
         shape = RoundedCornerShape(100),
-        border = BorderStroke(2.dp, UIColors.WATCHER_START_FG),
+        border = BorderStroke(2.dp, UIColors.GREEN),
         modifier = Modifier.shadow(24.dp, RoundedCornerShape(100), false)
     ) {
         Icon(
             Icons.Filled.Update,
-            tint = UIColors.WATCHER_START_FG,
+            tint = UIColors.GREEN,
             contentDescription = "Start",
             modifier = Modifier.size(22.dp)
         )
         Spacer(Modifier.size(ButtonDefaults.IconSpacing))
         Text("Move files")
     }
+    Spacer(Modifier.width(10.dp))
+    Button(
+        onClick = { println("Show Directory Picker") },
+        colors = ButtonDefaults.buttonColors(UIColors.DARK, Color.White),
+        contentPadding = PaddingValues(
+            start = 14.dp,
+            top = 6.dp,
+            end = 14.dp,
+            bottom = 6.dp
+        ),
+        shape = RoundedCornerShape(100),
+        border = BorderStroke(2.dp, UIColors.ORANGE),
+        modifier = Modifier.shadow(24.dp, RoundedCornerShape(100), false)
+    ) {
+        Icon(
+            Icons.Filled.NoteAdd,
+            tint = UIColors.ORANGE,
+            contentDescription = "Start",
+            modifier = Modifier.size(22.dp)
+        )
+        Spacer(Modifier.size(ButtonDefaults.IconSpacing))
+        Text("Add output...")
+    }
 }

src/main/kotlin/xyz/atnrch/wrench/components/center/DummyTextEntry.kt

@@ -16,7 +16,6 @@ fun DummyTextEntry(
         WatcherTextEntry(
             id,
             WatcherEntry(File("/home/aro/IdeaProjects/Wrench/dummy"), arrayListOf()),
-            watcherManager,
             onEntrySelected
         )
     }

src/main/kotlin/xyz/atnrch/wrench/components/center/WatcherTextEntry.kt

@@ -15,15 +15,14 @@ import androidx.compose.ui.unit.TextUnitType
 import xyz.atnrch.wrench.components.center.dialog.EntryDialog
 import xyz.atnrch.wrench.registery.ACTIVE_COMPOSABLE
 import xyz.atnrch.wrench.ui.Fonts
+import xyz.atnrch.wrench.ui.UIColors
 import xyz.atnrch.wrench.watcher.WatcherEntry
-import xyz.atnrch.wrench.watcher.WatcherManager
 
 @OptIn(ExperimentalUnitApi::class, ExperimentalFoundationApi::class)
 @Composable
 fun WatcherTextEntry(
     id: Int,
     entry: WatcherEntry,
-    watcherManager: WatcherManager,
     onEntrySelected: (id: Int) -> Unit
 ) {
     var dialogState by remember { mutableStateOf(false) }
@@ -31,7 +30,7 @@ fun WatcherTextEntry(
     Text(
         text = entry.file.absolutePath,
         style = TextStyle(
-            color = if(ACTIVE_COMPOSABLE == id) Color.Red else Color.Black,
+            color = if(ACTIVE_COMPOSABLE == id) UIColors.GREEN else Color.White,
             fontSize = TextUnit(15F, TextUnitType.Sp),
             fontFamily = Fonts.ROBOTO_REGULAR
         ),
@@ -39,19 +38,14 @@ fun WatcherTextEntry(
             .onClick(
                 matcher = PointerMatcher.mouse(PointerButton.Primary),
                 onClick = {
-                    println("Active composable ID was $ACTIVE_COMPOSABLE")
                     ACTIVE_COMPOSABLE = id
-                    println("Active composable ID is now $ACTIVE_COMPOSABLE")
+                    onEntrySelected.invoke(id)
-                    if (ACTIVE_COMPOSABLE == id) {
-                        onEntrySelected.invoke(id)
-                    }
                 }
             )
             .onClick(
                 matcher = PointerMatcher.mouse(PointerButton.Secondary),
                 onClick = {
                     dialogState = true
-                    println("PATH IS ${watcherManager.getFromId(ACTIVE_COMPOSABLE)!!.file.path}")
                 }
             )
     )

src/main/kotlin/xyz/atnrch/wrench/components/center/input/InputEntries.kt

@@ -2,6 +2,7 @@ package xyz.atnrch.wrench.components.center.input
 
 import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -9,6 +10,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.RectangleShape
 import androidx.compose.ui.unit.dp
 import xyz.atnrch.wrench.components.center.WatcherTextEntry
+import xyz.atnrch.wrench.registery.ACTIVE_COMPOSABLE
 import xyz.atnrch.wrench.registery.RegisterComposable
 import xyz.atnrch.wrench.ui.UIColors
 import xyz.atnrch.wrench.watcher.WatcherManager
@@ -21,10 +23,13 @@ fun InputEntries(
     Box(
         contentAlignment = Alignment.Center,
         modifier = Modifier
-            .padding(PaddingValues(0.dp, 0.dp, 0.dp, 55.dp))
             .fillMaxHeight()
             .fillMaxWidth(0.5f)
             .border(BorderStroke(4.dp, UIColors.ORANGE), RectangleShape)
+            .clickable {
+                ACTIVE_COMPOSABLE = -1
+                onEntryClick.invoke(-1)
+            }
     ) {
         InputTopText()
         Column(
@@ -35,7 +40,6 @@ fun InputEntries(
                     WatcherTextEntry(
                         it.key,
                         it.value,
-                        watcherManager,
                         onEntryClick
                     )
                 }

src/main/kotlin/xyz/atnrch/wrench/components/center/input/InputTopText.kt

@@ -10,8 +10,12 @@ 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.unit.ExperimentalUnitApi
+import androidx.compose.ui.unit.TextUnit
+import androidx.compose.ui.unit.TextUnitType
 import androidx.compose.ui.unit.dp
 
+@OptIn(ExperimentalUnitApi::class)
 @Composable
 fun InputTopText() {
     Box(
@@ -22,13 +26,17 @@ fun InputTopText() {
             .fillMaxWidth(0.5f)
     ) {
         Row {
-            Text("Input")
+            Text(
-            Spacer(Modifier.width(5.dp))
+                text = "Input",
+                color = Color.White,
+                fontSize = TextUnit(20F, TextUnitType.Sp)
+            )
+            Spacer(Modifier.size(ButtonDefaults.IconSpacing))
             Icon(
                 Icons.Filled.Input,
-                tint = Color.Black,
+                tint = Color.White,
                 contentDescription = "Input",
-                modifier = Modifier.size(ButtonDefaults.IconSize)
+                modifier = Modifier.size(24.dp)
             )
         }
     }

src/main/kotlin/xyz/atnrch/wrench/components/center/output/OutputEntries.kt

@@ -15,6 +15,9 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.RectangleShape
+import androidx.compose.ui.unit.ExperimentalUnitApi
+import androidx.compose.ui.unit.TextUnit
+import androidx.compose.ui.unit.TextUnitType
 import androidx.compose.ui.unit.dp
 import xyz.atnrch.wrench.components.center.showDirectoryPicker
 import xyz.atnrch.wrench.logger.Logger
@@ -24,6 +27,7 @@ import xyz.atnrch.wrench.watcher.WatcherManager
 import java.nio.file.Path
 import kotlin.io.path.pathString
 
+@OptIn(ExperimentalUnitApi::class)
 @Composable
 fun OutputEntries(
     watcherManager: WatcherManager,
@@ -34,7 +38,6 @@ fun OutputEntries(
     Box(
         contentAlignment = Alignment.Center,
         modifier = Modifier
-            .padding(PaddingValues(0.dp, 0.dp, 0.dp, 55.dp))
             .fillMaxHeight()
             .fillMaxWidth()
             .border(BorderStroke(4.dp, UIColors.STRESS), RectangleShape)
@@ -56,7 +59,11 @@ fun OutputEntries(
                         horizontalAlignment = Alignment.CenterHorizontally
                     ) {
                         if (outputs.isEmpty()) {
-                            Text("No outputs.")
+                            Text(
+                                text = "No outputs.",
+                                fontSize = TextUnit(20F, TextUnitType.Sp),
+                                color = Color.White
+                            )
                         } else {
                             outputs.forEach {
                                 Text(it.pathString)

src/main/kotlin/xyz/atnrch/wrench/components/center/output/OutputTopText.kt

@@ -10,8 +10,9 @@ 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.unit.dp
+import androidx.compose.ui.unit.*
 
+@OptIn(ExperimentalUnitApi::class)
 @Composable
 fun OutputTopText() {
     Box(
@@ -24,12 +25,16 @@ fun OutputTopText() {
         Row {
             Icon(
                 Icons.Filled.Output,
-                tint = Color.Black,
+                tint = Color.White,
                 contentDescription = "Output",
-                modifier = Modifier.size(ButtonDefaults.IconSize)
+                modifier = Modifier.size(24.dp)
+            )
+            Spacer(Modifier.size(ButtonDefaults.IconSpacing))
+            Text(
+                text = "Output",
+                color = Color.White,
+                fontSize = TextUnit(20F, TextUnitType.Sp)
             )
-            Spacer(Modifier.width(5.dp))
-            Text("Output")
         }
     }
 }

src/main/kotlin/xyz/atnrch/wrench/components/top/TopBar.kt

@@ -18,7 +18,7 @@ import xyz.atnrch.wrench.ui.UIColors
 @Composable
 fun TopBar() {
     TopAppBar(
-        backgroundColor = UIColors.PRIMARY,
+        backgroundColor = UIColors.DARK,
         contentColor = Color.White,
         elevation = 16.dp,
         title = {

src/main/kotlin/xyz/atnrch/wrench/ui/UIColors.kt

@@ -4,15 +4,11 @@ import androidx.compose.ui.graphics.Color
 
 class UIColors {
     companion object {
-        val PRIMARY = Color(0xFF424242)
+        val DARK = Color(0XFF1B1B1B)
+        val PRIMARY = Color(0xFF242424)
         val LIGHT = Color(0xFF6D6D6D)
         val STRESS = Color(0xFFF44336)
-        val GREEN = Color(0xFF64BA59)
+        val GREEN = Color(0xFF64BA69)
         val ORANGE = Color(0xFFFFB300)
-
-        val WATCHER_START_BG = Color(0xFF31893D)
-        val WATCHER_START_FG = Color(0xFF64BA69)
-        val WATCHER_STOP_BG = Color(0xFFBA000D)
-        val WATCHER_STOP_FG = STRESS
     }
 }