AdminCluster: Use proper card headers for title instead

and round cards

Signed-off-by: Pedro Pinto Silva <pedro.silva@collabora.com>
Change-Id: I632ca5a3053247ce4d12c4e028e0322ee1545124
This commit is contained in:
Pedro Pinto Silva 2023-08-14 15:58:45 +02:00 committed by Rashesh Padia
parent efe874f89c
commit 555a07db70
2 changed files with 17 additions and 7 deletions

View file

@ -6,6 +6,13 @@
</script>
<style>
.is-rounded {
border-radius: 8px;
}
.is-top-rounded {
border-top-right-radius: 8px;
border-top-left-radius: 8px;
}
/* Set to scroll otherwise tablets can spill over into other cards*/
.card {
overflow: auto;

View file

@ -66,21 +66,24 @@ var AdminClusterOverview = AdminSocketBase.extend({
createCard: function (server) {
var card = document.createElement('div');
card.className = 'tile is-child card';
card.className = 'tile is-child card is-rounded';
card.id = 'card-' + server.serverId;
var cardContent = document.createElement('div');
cardContent.className = 'card-content';
var cardHeader = document.createElement('header');
cardHeader.className = 'card-header is-top-rounded';
var cardTitle = document.createElement('p');
cardTitle.className = 'title has-text-centered';
cardTitle.className = 'card-header-title';
if (server.podname) {
cardTitle.textContent = server.podname;
} else {
console.warn('podname doesnot exist, using serverId instead of podname on card title');
cardTitle.textContent = server.serverId;
}
cardContent.appendChild(cardTitle);
cardHeader.appendChild(cardTitle);
card.appendChild(cardHeader);
var cardContent = document.createElement('div');
cardContent.className = 'card-content';
var mainTile = document.createElement('div');
mainTile.className = 'tile is-fullwidth is-vertical';
@ -528,4 +531,4 @@ var AdminClusterOverview = AdminSocketBase.extend({
Admin.ClusterOverview = function (host) {
return new AdminClusterOverview(host);
};
};