Refs #2. Updated visuals of the Dashboard Selector screen.

Frontend/DashboardsViewer/DashboardsViewer.qmlproject.qtds

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE QtCreatorProject>
-<!-- Written by QtDesignStudio 4.4.0, 2024-03-11T08:06:35. -->
+<!-- Written by QtDesignStudio 4.4.0, 2024-03-15T13:33:11. -->
 <qtcreator>
  <data>
   <variable>EnvironmentId</variable>

Frontend/DashboardsViewer/content/App.qml

@@ -1,12 +1,10 @@
-// Copyright (C) 2021 The Qt Company Ltd.
-// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR GPL-3.0-only
-
 import QtQuick 6.2
 import QtQuick.VirtualKeyboard 6.2
 import QtQuick.Controls 6.2
 
 import DashboardsViewer
 import "screens"
+import "ui"
 
 import DashboardsViewer.ConfigParser 1.0
 import OpenTeraLibs.UserClient 1.0
@@ -56,16 +54,16 @@ Window {
             color: "white"
         }
 
-
-
         //Logout button
-        Button {
+        BasicButton {
             id: logoutButton
             text: "Logout"
             anchors.right: parent.right
-            anchors.top: parent.top
+            anchors.verticalCenter: parent.verticalCenter
+            color: "darkred"
+            hoverColor: "red"
             width: 100
-            height: parent.height
+            //height: parent.height
             onClicked: {
                 UserClient.disconnect();
             }

Frontend/DashboardsViewer/content/CMakeLists.txt

@@ -32,12 +32,18 @@ qt6_add_qml_module(content
         dataSources/ParticipantSessionListDataSource.qml
         # Delegates
         delegates/BaseDelegate.qml
-        delegates/ParticipantDelegate.qml
-        delegates/SessionDelegate.qml
-        delegates/SiteProjectDelegate.qml
+        delegates/DashboardDelegate.qml
         delegates/GenericItemDelegate.qml
+        delegates/ParticipantDelegate.qml
+        delegates/SessionDelegate.qml        
 
     RESOURCES
         fonts/Arimo-VariableFont_wght.ttf
+
         images/logos/LogoOpenTera.png
+
+        images/icons/dashboard.png
+        images/icons/project.png
+        images/icons/site.png
+
     )

Frontend/DashboardsViewer/content/dataSources/BaseDataSource.qml

@@ -20,13 +20,13 @@ Item {
         var reply = UserClient.get(url, params);
 
         reply.requestSucceeded.connect(function(response, statusCode) {
-            console.log("Success", response, statusCode);
+            //console.log("Success", response, statusCode);
 
             //Make sure model is empty
             myModel.clear();
 
             //Print number of elements
-            console.log("Number of elements: ", response.length);
+            //console.log("Number of elements: ", response.length);
 
             //Add session
             response.forEach(function(item) {

Frontend/DashboardsViewer/content/delegates/DashboardDelegate.qml

@@ -0,0 +1,81 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Effects
+import QtQuick.Layouts
+import DashboardsViewer 1.0
+
+Item {
+    width: GridView.view.cellWidth - 10
+    height: mainLayout.implicitHeight + 10 //GridView.view.cellHeight - 10
+
+    signal itemClicked(var id, var definition)
+
+    states: [
+        State {
+            name: "hover"
+            when: mouseZone.containsMouse && enabled
+            PropertyChanges {
+                target: recBackground
+                color: "#44ffffff"
+            }
+        }
+    ]
+
+    MouseArea {
+        id: mouseZone
+        anchors.fill: parent
+        propagateComposedEvents: true
+        hoverEnabled: true
+        cursorShape: Qt.PointingHandCursor
+        onClicked: function(){
+            //console.log("Click! " + model.id + " - " + model.definition);
+            itemClicked(model.id, model.definition);
+        }
+    }
+    Rectangle{
+        id: recBackground
+        anchors.fill: parent
+        radius: 5
+        color: "transparent"
+    }
+
+    ColumnLayout{
+        id: mainLayout
+        anchors.fill: parent
+        anchors.margins: 5
+        spacing: 5
+
+        Item{
+            height: imgDashboard.height
+            Layout.fillWidth: true
+
+            Image{
+                id: imgDashboard
+                anchors.centerIn: parent
+                source: "../images/icons/dashboard.png"
+                fillMode: Image.PreserveAspectFit
+                height: 64
+            }
+            MultiEffect{
+                source: imgDashboard
+                anchors.fill: source
+                shadowEnabled: true
+                shadowScale: 0.90
+            }
+        }
+
+        Text {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            text: model.name
+            color:  model.color //Constants.textColor
+            font.pixelSize: Constants.smallFontSize
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignTop
+            wrapMode: Text.WordWrap
+            Layout.alignment: Qt.AlignLeft | Qt.AlignTop
+            style: Text.Outline
+            font.bold: true
+        }
+    }
+}

Frontend/DashboardsViewer/content/screens/Dashboard.qml

@@ -57,7 +57,7 @@ Item {
 
     Button {
         id: closeButton
-        anchors.left: loadButton.right
+        anchors.left: parent.left
         anchors.top: parent.top
         width: 150
         height: 60