From 92eb972c7c4f315c923309c602a0d3a4ebbd19ff Mon Sep 17 00:00:00 2001
From: Mitan Omar <mitan@gmx.ch>
Date: Thu, 14 Nov 2024 15:14:43 +0100
Subject: [PATCH 1/3] fix: view link column in small screen in search route

---
 app/styles/_responsive.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/app/styles/_responsive.scss b/app/styles/_responsive.scss
index 1c72971a..366fa951 100644
--- a/app/styles/_responsive.scss
+++ b/app/styles/_responsive.scss
@@ -36,7 +36,6 @@
 
   table.document-list > thead > tr > th:nth-child(4),
   table.document-list > thead > tr > th:nth-child(5),
-  table.document-list > tbody > tr > td:nth-child(4),
   table.document-list > tbody > tr > td:nth-child(5) {
     display: none;
   }

From 356446e0d45074de8b9b683d2087935eb3452942 Mon Sep 17 00:00:00 2001
From: Mitan Omar <mitan@gmx.ch>
Date: Thu, 14 Nov 2024 16:03:06 +0100
Subject: [PATCH 2/3] refactor: hide column by class instade of index number

---
 addon/components/document-list-item.hbs | 16 ++++++++--------
 addon/components/document-list.hbs      |  2 +-
 app/styles/_responsive.scss             |  4 +---
 3 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/addon/components/document-list-item.hbs b/addon/components/document-list-item.hbs
index c1d21281..534b75a6 100644
--- a/addon/components/document-list-item.hbs
+++ b/addon/components/document-list-item.hbs
@@ -10,7 +10,7 @@
 >
   {{#each-in @columns as |column|}}
     {{#if (eq column "type")}}
-      <td class="uk-preserve-width">
+      <td class="uk-preserve-width {{concat "document-list-item-" column}}">
         <FaIcon
           @icon="file-alt"
           @prefix="far"
@@ -21,7 +21,7 @@
         />
       </td>
     {{else if (eq column "title")}}
-      <td>
+      <td class={{concat "document-list-item-" column}}>
         <span>{{@document.title}}</span>
         <div
           class="document-thumbnail"
@@ -36,7 +36,7 @@
         </div>
       </td>
     {{else if (eq column "marks")}}
-      <td class="list-marks uk-flex">
+      <td class="list-marks uk-flex {{concat "document-list-item-" column}}">
         {{#each @document.marks as |mark|}}
           <div uk-tooltip={{mark.name}} data-test-document-mark={{mark.id}}>
             <FaIcon @icon={{mark.icon}} @fixedWidth={{true}} />
@@ -44,7 +44,7 @@
         {{/each}}
       </td>
     {{else if (eq column "link")}}
-      <td>
+      <td class={{concat "document-list-item-" column}}>
         {{#let
           (await (this.config.documentListLinkTo @document))
           as |linkConfig|
@@ -65,7 +65,7 @@
         {{/let}}
       </td>
     {{else if (eq column "date")}}
-      <td>
+      <td class={{concat "document-list-item-" column}}>
         {{format-date
           @document.date
           month="2-digit"
@@ -74,7 +74,7 @@
         }}
       </td>
     {{else if (eq column "modifiedAt")}}
-      <td>
+      <td class="{{concat "document-list-item-" column}}">
         {{format-date
           @document.latestFile.value.createdAt
           month="2-digit"
@@ -85,11 +85,11 @@
         }}
       </td>
     {{else if (eq column "createdByUser")}}
-      <td>
+      <td class="{{concat "document-list-item-" column}}">
         {{await (resolve-user @document.createdByUser)}}
       </td>
     {{else if (eq column "createdByGroup")}}
-      <td>
+      <td class="{{concat "document-list-item" column}}">
         {{await (resolve-group @document.createdByGroup)}}
       </td>
     {{/if}}
diff --git a/addon/components/document-list.hbs b/addon/components/document-list.hbs
index 4b857430..ee562bae 100644
--- a/addon/components/document-list.hbs
+++ b/addon/components/document-list.hbs
@@ -5,7 +5,7 @@
   <thead>
     <tr>
       {{#each-in @columns as |key settings|}}
-        <th class={{if (eq key "title") "uk-table-expand"}}>
+        <th class={{concat (if (eq key "title") "uk-table-expand") (concat "document-list-item-" key)}}>
           {{#if settings.labelHidden}}
             <span hidden>
               {{t (concat "alexandria.document-list." settings.label)}}
diff --git a/app/styles/_responsive.scss b/app/styles/_responsive.scss
index 366fa951..ba563910 100644
--- a/app/styles/_responsive.scss
+++ b/app/styles/_responsive.scss
@@ -34,9 +34,7 @@
     margin-left: 0 !important;
   }
 
-  table.document-list > thead > tr > th:nth-child(4),
-  table.document-list > thead > tr > th:nth-child(5),
-  table.document-list > tbody > tr > td:nth-child(5) {
+  .document-list-item-date {
     display: none;
   }
 

From 865f9961462e883d6202efaa3833e5ed9806aaac Mon Sep 17 00:00:00 2001
From: Christian Zosel <christian@zosel.ch>
Date: Fri, 15 Nov 2024 14:41:27 +0100
Subject: [PATCH 3/3] fix: make responsive behavior of table depend on it's own
 width

---
 addon/components/document-list.hbs |  2 +-
 app/styles/_responsive.scss        | 20 ++++++++++++++++++--
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/addon/components/document-list.hbs b/addon/components/document-list.hbs
index ee562bae..b680e587 100644
--- a/addon/components/document-list.hbs
+++ b/addon/components/document-list.hbs
@@ -5,7 +5,7 @@
   <thead>
     <tr>
       {{#each-in @columns as |key settings|}}
-        <th class={{concat (if (eq key "title") "uk-table-expand") (concat "document-list-item-" key)}}>
+        <th class={{concat "uk-text-nowrap" (if (eq key "title") " uk-table-expand") (concat " document-list-item-" key)}}>
           {{#if settings.labelHidden}}
             <span hidden>
               {{t (concat "alexandria.document-list." settings.label)}}
diff --git a/app/styles/_responsive.scss b/app/styles/_responsive.scss
index ba563910..862fd89c 100644
--- a/app/styles/_responsive.scss
+++ b/app/styles/_responsive.scss
@@ -2,7 +2,11 @@
   container: alexandria / inline-size;
 }
 
-@container alexandria (max-width: 1200px) {
+.document-view {
+  container: table / inline-size;
+}
+
+@container alexandria (max-width: 1550px) {
   .document-details {
     width: 300px;
 
@@ -12,7 +16,13 @@
   }
 }
 
-@container alexandria (max-width: 1100px) {
+@container table (max-width: 700px) {
+  .document-list-item-createdByUser {
+    display: none;
+  }
+}
+
+@container table (max-width: 850px) {
   .side-nav > div:first-child {
     font-size: 0;
   }
@@ -48,3 +58,9 @@
     }
   }
 }
+
+@container table (max-width: 900px) {
+  .document-list-item-modifiedAt {
+    display: none;
+  }
+}