Change badge component from Badge to Box (#459)

* Change badge component from Badge to Box

This allows to customize the shape. I also changed the color of the text to OnTertiary to avoid contrast issues.

* Fix formatting

* refactor: create TextBadge component

* Modify attributes for TextBadge

Add default values and add padding values

* gradle kotlin formatting

* Add section in settings to edit TextBadge corner radius

* kotlin formatting

* Revert "kotlin formatting"

This reverts commit 1425c7d.

* Revert "Add section in settings to edit TextBadge corner radius"

This reverts commit f9222a2.

app/src/main/java/com/jerboa/ui/components/common/TextBadge.kt

@@ -0,0 +1,42 @@
+package com.jerboa.ui.components.common
+
+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.material3.MaterialTheme
+import androidx.compose.material3.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.text.TextStyle
+import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun TextBadge(
+    text: String,
+    verticalTextPadding: Float = 0f,
+    horizontalTextPadding: Float = 6f,
+    textColor: Color = MaterialTheme.colorScheme.onTertiary,
+    textStyle: TextStyle,
+    containerColor: Color = MaterialTheme.colorScheme.tertiary,
+    containerRadius: Float = 4f,
+) {
+    Box(
+        modifier = Modifier
+            .clip(RoundedCornerShape(containerRadius.dp))
+            .background(containerColor),
+    ) {
+        Text(
+            text = text,
+            style = textStyle,
+            overflow = TextOverflow.Clip,
+            maxLines = 1,
+            color = textColor,
+            modifier = Modifier
+                .padding(horizontalTextPadding.dp, verticalTextPadding.dp),
+        )
+    }
+}

app/src/main/java/com/jerboa/ui/components/person/PersonProfileLink.kt

@@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Row
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.outlined.*
-import androidx.compose.material3.Badge
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
@@ -22,6 +21,7 @@ import com.jerboa.datatypes.PersonSafe
 import com.jerboa.datatypes.samplePersonSafe
 import com.jerboa.personNameShown
 import com.jerboa.ui.components.common.CircularIcon
+import com.jerboa.ui.components.common.TextBadge
 import com.jerboa.ui.theme.SMALL_PADDING
 
 @Composable
@@ -34,16 +34,7 @@ fun PersonName(
     val style = MaterialTheme.typography.bodyMedium
 
     if (isPostCreator) {
-        Badge(
-            containerColor = MaterialTheme.colorScheme.tertiary,
-        ) {
-            Text(
-                text = name,
-                style = style,
-                overflow = TextOverflow.Clip,
-                maxLines = 1,
-            )
-        }
+        TextBadge(text = name, textStyle = style)
     } else {
         Text(
             text = name,