Smaller action bars (#261)

* Adding light and dark theme options. Fixes #254 * Adding an about page. Fixes #250 * Some major UI changes - Redoing action bars. Fixes #258 - Using outlined icons. Fixes #255
LemmyNet · Dec 21, 2022 · af1630a · af1630a
1 parent 5c9682a
commit af1630a
Show file tree

Hide file tree

Showing 29 changed files with 368 additions and 288 deletions.
diff --git a/app/src/main/java/com/jerboa/ui/components/comment/CommentNode.kt b/app/src/main/java/com/jerboa/ui/components/comment/CommentNode.kt
@@ -14,7 +14,17 @@ import androidx.compose.material.Divider
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.*
+import androidx.compose.material.icons.outlined.*
+import androidx.compose.material.icons.outlined.Block
+import androidx.compose.material.icons.outlined.BookmarkAdd
+import androidx.compose.material.icons.outlined.BookmarkAdded
+import androidx.compose.material.icons.outlined.Delete
+import androidx.compose.material.icons.outlined.Description
+import androidx.compose.material.icons.outlined.Edit
+import androidx.compose.material.icons.outlined.Flag
+import androidx.compose.material.icons.outlined.Link
+import androidx.compose.material.icons.outlined.MoreVert
+import androidx.compose.material.icons.outlined.Restore
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
@@ -359,24 +369,27 @@ fun CommentFooterLine(
             )
             if (showRead) {
                 ActionBarButton(
-                    icon = Icons.Filled.Check,
+                    icon = if (commentView.comment.read) {
+                        Icons.Outlined.MarkChatRead
+                    } else {
+                        Icons.Outlined.MarkChatUnread
+                    },
                     onClick = { onMarkAsReadClick(commentView) },
                     contentColor = if (commentView.comment.read) {
-                        Color.Green
+                        MaterialTheme.colors.primary
                     } else {
                         MaterialTheme.colors.onBackground.muted
                     },
                     account = account
                 )
             }
             ActionBarButton(
-                icon = if (commentView.saved) { Icons.Default.BookmarkAdded } else {
-                    Icons.Default
-                        .BookmarkAdd
+                icon = if (commentView.saved) { Icons.Outlined.BookmarkAdded } else {
+                    Icons.Outlined.BookmarkAdd
                 },
                 onClick = { onSaveClick(commentView) },
                 contentColor = if (commentView.saved) {
-                    Color.Yellow
+                    MaterialTheme.colors.primary
                 } else {
                     MaterialTheme.colors.onBackground.muted
                 },
@@ -385,13 +398,13 @@ fun CommentFooterLine(
             // Don't let you respond to your own comment.
             if (commentView.creator.id != account?.id) {
                 ActionBarButton(
-                    icon = Icons.Filled.Reply,
+                    icon = Icons.Outlined.Textsms,
                     onClick = { onReplyClick(commentView) },
                     account = account
                 )
             }
             ActionBarButton(
-                icon = Icons.Filled.MoreVert,
+                icon = Icons.Outlined.MoreVert,
                 account = account,
                 onClick = { showMoreOptions = !showMoreOptions }
             )
@@ -447,12 +460,12 @@ fun CommentOptionsDialog(
             Column {
                 IconAndTextDrawerItem(
                     text = "View Source",
-                    icon = Icons.Default.Description,
+                    icon = Icons.Outlined.Description,
                     onClick = onViewSourceClick
                 )
                 IconAndTextDrawerItem(
                     text = "Copy Permalink",
-                    icon = Icons.Default.Link,
+                    icon = Icons.Outlined.Link,
                     onClick = {
                         val permalink = "${commentView.post.ap_id}/comment/${commentView.comment.id}"
                         localClipboardManager.setText(AnnotatedString(permalink))
@@ -463,32 +476,32 @@ fun CommentOptionsDialog(
                 if (!isCreator) {
                     IconAndTextDrawerItem(
                         text = "Report Comment",
-                        icon = Icons.Default.Flag,
+                        icon = Icons.Outlined.Flag,
                         onClick = onReportClick
                     )
                     IconAndTextDrawerItem(
                         text = "Block ${commentView.creator.name}",
-                        icon = Icons.Default.Block,
+                        icon = Icons.Outlined.Block,
                         onClick = onBlockCreatorClick
                     )
                 }
                 if (isCreator) {
                     IconAndTextDrawerItem(
                         text = "Edit",
-                        icon = Icons.Default.Edit,
+                        icon = Icons.Outlined.Edit,
                         onClick = onEditCommentClick
                     )
                     val deleted = commentView.comment.deleted
                     if (deleted) {
                         IconAndTextDrawerItem(
                             text = "Restore",
-                            icon = Icons.Default.Restore,
+                            icon = Icons.Outlined.Restore,
                             onClick = onDeleteCommentClick
                         )
                     } else {
                         IconAndTextDrawerItem(
                             text = "Delete",
-                            icon = Icons.Default.Delete,
+                            icon = Icons.Outlined.Delete,
                             onClick = onDeleteCommentClick
                         )
                     }

diff --git a/app/src/main/java/com/jerboa/ui/components/comment/edit/CommentEdit.kt b/app/src/main/java/com/jerboa/ui/components/comment/edit/CommentEdit.kt
@@ -6,8 +6,9 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.*
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
-import androidx.compose.material.icons.filled.Save
+import androidx.compose.material.icons.outlined.*
+import androidx.compose.material.icons.outlined.Close
+import androidx.compose.material.icons.outlined.Save
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.input.TextFieldValue
@@ -46,7 +47,7 @@ fun CommentEditHeader(
                     )
                 } else {
                     Icon(
-                        imageVector = Icons.Default.Save,
+                        imageVector = Icons.Outlined.Save,
                         contentDescription = "TODO"
                     )
                 }
@@ -59,7 +60,7 @@ fun CommentEditHeader(
                 }
             ) {
                 Icon(
-                    Icons.Filled.Close,
+                    Icons.Outlined.Close,
                     contentDescription = "Back"
                 )
             }

diff --git a/app/src/main/java/com/jerboa/ui/components/comment/reply/CommentReply.kt b/app/src/main/java/com/jerboa/ui/components/comment/reply/CommentReply.kt
@@ -8,8 +8,9 @@ import androidx.compose.foundation.text.selection.SelectionContainer
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.*
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.Close
-import androidx.compose.material.icons.filled.Send
+import androidx.compose.material.icons.outlined.*
+import androidx.compose.material.icons.outlined.Close
+import androidx.compose.material.icons.outlined.Send
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.text.input.TextFieldValue
@@ -54,7 +55,7 @@ fun CommentReplyHeader(
                     )
                 } else {
                     Icon(
-                        imageVector = Icons.Default.Send,
+                        imageVector = Icons.Outlined.Send,
                         contentDescription = "TODO"
                     )
                 }
@@ -67,7 +68,7 @@ fun CommentReplyHeader(
                 }
             ) {
                 Icon(
-                    Icons.Filled.Close,
+                    Icons.Outlined.Close,
                     contentDescription = "Back"
                 )
             }

diff --git a/app/src/main/java/com/jerboa/ui/components/common/AppBars.kt b/app/src/main/java/com/jerboa/ui/components/common/AppBars.kt
@@ -12,7 +12,7 @@ import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material.*
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.filled.*
+import androidx.compose.material.icons.outlined.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
@@ -61,7 +61,7 @@ fun SimpleTopAppBar(
         navigationIcon = {
             IconButton(onClick = { navController.popBackStack() }) {
                 Icon(
-                    Icons.Filled.ArrowBack,
+                    Icons.Outlined.ArrowBack,
                     contentDescription = "Back"
                 )
             }
@@ -87,7 +87,7 @@ fun BottomAppBarAll(
         BottomNavigationItem(
             icon = {
                 Icon(
-                    imageVector = Icons.Default.Home,
+                    imageVector = Icons.Outlined.Home,
                     contentDescription = "TODO"
                 )
             },
@@ -102,7 +102,7 @@ fun BottomAppBarAll(
         BottomNavigationItem(
             icon = {
                 Icon(
-                    imageVector = Icons.Default.List,
+                    imageVector = Icons.Outlined.List,
                     contentDescription = "TODO"
                 )
             },
@@ -117,7 +117,7 @@ fun BottomAppBarAll(
             icon = {
                 InboxIconAndBadge(
                     iconBadgeCount = totalUnreads,
-                    icon = Icons.Default.Email,
+                    icon = Icons.Outlined.Email,
                     tint = if (screen == "inbox") {
                         MaterialTheme.colors.primary
                     } else {
@@ -135,7 +135,7 @@ fun BottomAppBarAll(
         BottomNavigationItem(
             icon = {
                 Icon(
-                    imageVector = Icons.Default.Bookmarks,
+                    imageVector = Icons.Outlined.Bookmarks,
                     contentDescription = "TODO"
                 )
             },
@@ -149,7 +149,7 @@ fun BottomAppBarAll(
         BottomNavigationItem(
             icon = {
                 Icon(
-                    imageVector = Icons.Default.Person,
+                    imageVector = Icons.Outlined.Person,
                     contentDescription = "TODO"
                 )
             },
@@ -204,7 +204,7 @@ fun CommentOrPostNodeHeader(
         ) {
             if (deleted) {
                 Icon(
-                    imageVector = Icons.Default.Delete,
+                    imageVector = Icons.Outlined.Delete,
                     contentDescription = "TODO",
                     tint = MaterialTheme.colors.error
                 )
@@ -243,8 +243,7 @@ fun ActionBarButton(
     text: String? = null,
     contentColor: Color = MaterialTheme.colors.onBackground.muted,
     noClick: Boolean = false,
-    account: Account?,
-    smallIcon: Boolean = false
+    account: Account?
 ) {
     val ctx = LocalContext.current
 //    Button(
@@ -260,7 +259,6 @@ fun ActionBarButton(
 //        modifier = Modifier
 //            .defaultMinSize(minWidth = 1.dp, minHeight = 1.dp)
 //    )
-    val iconHeight = if (smallIcon) { ACTION_BAR_ICON_SIZE_SMALLER } else { ACTION_BAR_ICON_SIZE }
     val barMod = if (noClick) {
         Modifier
     } else {
@@ -279,14 +277,14 @@ fun ActionBarButton(
         Icon(
             imageVector = icon,
             contentDescription = "TODO",
-            tint = contentColor,
-            modifier = Modifier.height(iconHeight)
+            tint = contentColor
         )
         text?.also {
             Spacer(Modifier.size(ButtonDefaults.IconSpacing))
             Text(
                 text = text,
-                color = contentColor
+                color = contentColor,
+                style = MaterialTheme.typography.body2
             )
         }
     }