More webapp changes+fixes

webapp/src/app/features/channels/channel-detail/channel-detail.component.scss

@@ -10,17 +10,14 @@
   gap: 8px;
 }
 
-.key-section {
-  label {
-    display: block;
-    font-weight: 500;
-    margin-bottom: 8px;
-    color: #333;
-  }
+.key-field {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
 }
 
 .key-actions {
-  margin-top: 8px;
+  display: flex;
 }
 
 .action-icon {
@@ -44,28 +41,36 @@
   }
 }
 
-.qr-section {
-  margin-top: 16px;
-  padding-top: 16px;
-  border-top: 1px solid #f0f0f0;
-
-  label {
-    display: block;
-    font-weight: 500;
-    margin-bottom: 12px;
-    color: #333;
-  }
-
-  app-qr-code-display {
-    display: flex;
-    justify-content: center;
-  }
+.qr-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
 
 .qr-hint {
-  text-align: center;
   color: #666;
   font-size: 13px;
-  margin-top: 12px;
+  margin-top: 8px;
   margin-bottom: 0;
 }
+
+.cell-name {
+  font-weight: 500;
+  color: #333;
+}
+
+.cell-id {
+  font-size: 11px;
+  color: #999;
+  margin-top: 2px;
+}
+
+.timestamp-absolute {
+  font-size: 13px;
+  color: #333;
+}
+
+.timestamp-relative {
+  font-size: 12px;
+  color: #999;
+}