Working on #64.

It can now navigate to read marker only if the event is in timeline.

imports/Spectral/Panel/RoomListPanelForm.ui.qml

@@ -43,10 +43,6 @@ Rectangle {
             Layout.margins: 12
 
             color: MSettings.darkTheme ? "#303030" : "#fafafa"
-//            layer.enabled: true
-//            layer.effect: ElevationEffect {
-//                elevation: searchField.focus ? 2 : 1
-//            }
 
             RowLayout {
                 anchors.fill: parent

imports/Spectral/Panel/RoomPanel.qml

@@ -39,6 +39,7 @@ RoomPanelForm {
         }
     }
 
+    goBottomFab.onClicked: goToEvent(currentRoom.readMarkerEventId)
     goTopFab.onClicked: messageListView.positionViewAtBeginning()
 
     function goToEvent(eventID) {

imports/Spectral/Panel/RoomPanelForm.ui.qml

@@ -22,6 +22,7 @@ Item {
     property alias roomHeader: roomHeader
     property alias messageListView: messageListView
     property alias goTopFab: goTopFab
+    property alias goBottomFab: goBottomFab
     property alias messageEventModel: messageEventModel
     property alias sortedMessageEventModel: sortedMessageEventModel
     property alias roomDrawer: roomDrawer
@@ -153,6 +154,26 @@ Item {
                 }
             }
 
+            RoundButton {
+                width: 64
+                height: 64
+                anchors.right: parent.right
+                anchors.top: parent.top
+
+                id: goBottomFab
+
+                visible: currentRoom && currentRoom.hasUnreadMessages
+
+                contentItem: MaterialIcon {
+                    anchors.fill: parent
+
+                    icon: "\ue316"
+                    color: "white"
+                }
+
+                Material.background: Material.accent
+            }
+
             RoundButton {
                 width: 64
                 height: 64