fixing dark mode, spacing, and fonts

Ulas-Scan · Jun 20, 2024 · 6df96ad · 6df96ad
1 parent f5da464
commit 6df96ad
Show file tree

Hide file tree

Showing 5 changed files with 113 additions and 60 deletions.
diff --git a/app/src/main/java/com/ulascan/app/ui/screens/auth/FormInput.kt b/app/src/main/java/com/ulascan/app/ui/screens/auth/FormInput.kt
@@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.OutlinedTextFieldDefaults
 import androidx.compose.material3.Text
@@ -18,7 +19,9 @@ import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.PasswordVisualTransformation
 import androidx.compose.ui.text.input.VisualTransformation
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import com.ulascan.app.ui.theme.UlaScanTheme
 import com.ulascan.app.ui.theme.Weak100
 
 @Composable
@@ -29,24 +32,36 @@ fun FormInput(
     label: String,
     isPassword: Boolean = false
 ) {
-  Text(text = title)
+  Text(
+      text = title,
+      style = MaterialTheme.typography.labelMedium,
+  )
   Box(
       modifier =
-          Modifier.shadow(elevation = 8.dp, shape = RoundedCornerShape(36.dp))
-              .clip(RoundedCornerShape(30.dp))
-              .background(Weak100)) {
+      Modifier
+          .shadow(elevation = 8.dp, shape = RoundedCornerShape(36.dp))
+          .clip(RoundedCornerShape(30.dp))
+          .background(Weak100)) {
         OutlinedTextField(
             value = value,
             onValueChange = onValueChange,
             label = {
               if (value.isNotBlank()) {
-                Text(text = "")
+                Text(
+                    text = "",
+                    style = MaterialTheme.typography.labelMedium,
+                    )
               } else {
-                Text(text = label)
+                Text(
+                    text = label,
+                    style = MaterialTheme.typography.labelMedium,
+                )
               }
             },
             shape = RoundedCornerShape(30.dp),
-            modifier = Modifier.fillMaxWidth().offset(y = (-4).dp),
+            modifier = Modifier
+                .fillMaxWidth()
+                .offset(y = (-4).dp),
             colors =
                 OutlinedTextFieldDefaults.colors(
                     unfocusedBorderColor = Color.Transparent,
@@ -62,3 +77,17 @@ fun FormInput(
                     imeAction = if (isPassword) ImeAction.Done else ImeAction.Next))
       }
 }
+
+@Composable
+@Preview
+fun FormInputPreview() {
+    UlaScanTheme {
+        FormInput(
+            title = "Email",
+            value = "",
+            onValueChange = {},
+            label = "Masukkan Email Anda",
+            isPassword = false
+        )
+    }
+}