admin: fix mobile display via css instead of html

inveniosoftware · Nov 11, 2024 · 73e5f20 · 73e5f20
1 parent 08be8b9
commit 73e5f20
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 25 deletions.
diff --git a/...ts/semantic-ui/js/invenio_app_rdm/administration/records/search/SearchResultItemLayout.js b/...ts/semantic-ui/js/invenio_app_rdm/administration/records/search/SearchResultItemLayout.js
@@ -51,29 +51,27 @@ class SearchResultItemComponent extends Component {
           data-label="Title"
           className="word-break-all"
         >
-          <div>
-            <BoolFormatter
-              value={result.access.record === "public"}
-              color="green"
-              icon="lock unlocked"
-            />
-            <BoolFormatter
-              value={
-                result.access.record === "restricted" ||
-                result.access.files === "restricted"
-              }
-              color="red"
-              icon="lock"
-            />
-            <a target="_blank" rel="noreferrer" href={result.links.self_html}>
-              {_truncate(result.metadata.title || i18next.t("Empty draft title"), {
-                length: 100,
-              })}
-            </a>
-            <br />
-            <div className="text-muted">
-              {result.id} | {i18next.t("version")} {result.versions.index}
-            </div>
+          <BoolFormatter
+            value={result.access.record === "public"}
+            color="green"
+            icon="lock unlocked"
+          />
+          <BoolFormatter
+            value={
+              result.access.record === "restricted" ||
+              result.access.files === "restricted"
+            }
+            color="red"
+            icon="lock"
+          />
+          <a target="_blank" rel="noreferrer noopener" href={result.links.self_html}>
+            {_truncate(result.metadata.title || i18next.t("Empty draft title"), {
+              length: 100,
+            })}
+          </a>
+          <br />
+          <div className="text-muted">
+            {result.id} | {i18next.t("version")} {result.versions.index}
           </div>
         </Table.Cell>
         <Table.Cell

diff --git a/...o_app_rdm/theme/assets/semantic-ui/less/invenio_app_rdm/theme/collections/table.overrides b/...o_app_rdm/theme/assets/semantic-ui/less/invenio_app_rdm/theme/collections/table.overrides
@@ -108,19 +108,24 @@
             }
 
             &[data-label]  {
-              display: inline-grid !important;
-              grid-template-columns: [col1-start] 30% [col2-start] 70% [end];
+              display: grid;
+              grid-template-columns: [col1-start] 20% [col2-start] 80% [end];
 
               &:before {
                 content: attr(data-label);
                 font-weight: bold;
                 margin-right: 1rem;
                 width: inherit;
+                grid-column: 1;
               }
 
               .ui.fitted.checkbox {
                 padding-top: .2rem;
               }
+
+              > * {
+                grid-column: 2;
+              }
             }
 
             &.file-upload-pending {