diff --git a/ogWebconsole/src/app/components/groups/groups.component.css b/ogWebconsole/src/app/components/groups/groups.component.css
index 0bb10f1..50c1127 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.css
+++ b/ogWebconsole/src/app/components/groups/groups.component.css
@@ -319,11 +319,26 @@ mat-tree mat-tree-node.disabled:hover {
box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
}
-.client-image {
- width: 35px;
- height: 35px;
+.client-details {
+ flex-grow: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ margin-top: 4px;
+}
+
+.action-icons {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ gap: 1px;
margin-top: 10px;
- margin-bottom: 8px;
+}
+
+.client-status-container {
+ display: flex;
+ align-items: center;
+ gap: 5px;
}
.client-ip {
@@ -338,11 +353,9 @@ mat-tree mat-tree-node.disabled:hover {
gap: 4px;
}
-.action-icons {
- display: flex;
- justify-content: center;
- gap: 1px;
- margin-top: 10px;
+.sync-spinner {
+ margin-left: 1em;
+ margin-right: 1em;
}
.mat-elevation-z8 {
@@ -360,10 +373,6 @@ mat-tree mat-tree-node.disabled:hover {
position: relative;
}
-.client-details {
- margin-top: 4px;
-}
-
@media (max-width: 1560px) {
.clients-view-header {
display: flex;
diff --git a/ogWebconsole/src/app/components/groups/groups.component.html b/ogWebconsole/src/app/components/groups/groups.component.html
index 0c91f2e..3056117 100644
--- a/ogWebconsole/src/app/components/groups/groups.component.html
+++ b/ogWebconsole/src/app/components/groups/groups.component.html
@@ -60,12 +60,14 @@