From c5511c77a1011a0548cd8452a70458c1491fd09b Mon Sep 17 00:00:00 2001
From: Ernst Widerberg <ernstwi@kth.se>
Date: Wed, 6 Oct 2021 16:43:27 +0200
Subject: Put user_presentation field descriptions in row below value

---
 src/components/ObjectComponent.js | 20 +++++++++++++-------
 src/styles/main.css               | 10 +++++++++-
 2 files changed, 22 insertions(+), 8 deletions(-)

(limited to 'src')

diff --git a/src/components/ObjectComponent.js b/src/components/ObjectComponent.js
index 56bdc7c..bc059a3 100644
--- a/src/components/ObjectComponent.js
+++ b/src/components/ObjectComponent.js
@@ -48,15 +48,21 @@ function UserPresentation(props) {
                     {Object.entries(props.data).map(
                         ([key, { data, display_name, description }]) => {
                             return (
-                                <tr key={key}>
-                                    <td>{display_name}</td>
+                                <>
+                                    <tr key={key}>
+                                        <td>{display_name}</td>
+                                        <td>{data.toString()}</td>
+                                    </tr>
                                     {description && (
-                                        <td className="description">
-                                            {description}
-                                        </td>
+                                        <tr
+                                            className="description"
+                                            key={key + "-description"}
+                                        >
+                                            <td colspan="2">{description}</td>
+                                        </tr>
                                     )}
-                                    <td>{data.toString()}</td>
-                                </tr>
+                                    <tr className="spacer"></tr>
+                                </>
                             );
                         }
                     )}
diff --git a/src/styles/main.css b/src/styles/main.css
index 4e78591..ba42d67 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -67,11 +67,19 @@ body {
     margin-bottom: 0.5em;
 }
 
-.object .user-presentation .description {
+.object > .user-presentation > .description {
     font-style: italic;
     margin-bottom: 1em;
 }
 
+.object > .user-presentation > table .description {
+    font-style: italic;
+}
+
+.object > .user-presentation > table .spacer {
+    height: 1em;
+}
+
 /* List */
 
 #list-container > #controls {
-- 
cgit v1.1