Move css for hiding columns to the ResourceTable component

owncloud · Mar 28, 2022 · 8a9591c · 8a9591c
1 parent 2c74391
commit 8a9591c
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 58 deletions.
diff --git a/packages/web-app-files/src/App.vue b/packages/web-app-files/src/App.vue
@@ -144,61 +144,3 @@ main {
   grid-area: upload;
 }
 </style>
-
-<style lang="scss">
-// Hide files table columns
-.files-table {
-  .oc-table-header-cell-mdate,
-  .oc-table-data-cell-mdate,
-  .oc-table-header-cell-sdate,
-  .oc-table-data-cell-sdate,
-  .oc-table-header-cell-ddate,
-  .oc-table-data-cell-ddate,
-  .oc-table-header-cell-size,
-  .oc-table-data-cell-size,
-  .oc-table-header-cell-sharedWith,
-  .oc-table-data-cell-sharedWith,
-  .oc-table-header-cell-owner,
-  .oc-table-data-cell-owner,
-  .oc-table-header-cell-status,
-  .oc-table-data-cell-status {
-    display: none;
-
-    @media only screen and (min-width: 640px) {
-      display: table-cell;
-    }
-  }
-
-  .oc-table-header-cell-owner,
-  .oc-table-data-cell-owner {
-    display: none;
-
-    @media only screen and (min-width: 960px) {
-      display: table-cell;
-    }
-  }
-
-  &-squashed {
-    .oc-table-header-cell-mdate,
-    .oc-table-data-cell-mdate,
-    .oc-table-header-cell-sdate,
-    .oc-table-data-cell-sdate,
-    .oc-table-header-cell-ddate,
-    .oc-table-data-cell-ddate,
-    .oc-table-header-cell-size,
-    .oc-table-data-cell-size,
-    .oc-table-header-cell-sharedWith,
-    .oc-table-data-cell-sharedWith,
-    .oc-table-header-cell-owner,
-    .oc-table-data-cell-owner,
-    .oc-table-header-cell-status,
-    .oc-table-data-cell-status {
-      display: none;
-
-      @media only screen and (min-width: 1600px) {
-        display: table-cell;
-      }
-    }
-  }
-}
-</style>
diff --git a/packages/web-app-files/src/components/FilesList/ResourceTable.vue b/packages/web-app-files/src/components/FilesList/ResourceTable.vue
@@ -724,4 +724,60 @@ export default {
     justify-content: center;
   }
 }
+
+// Hide files table columns
+.files-table {
+  .oc-table-header-cell-mdate,
+  .oc-table-data-cell-mdate,
+  .oc-table-header-cell-sdate,
+  .oc-table-data-cell-sdate,
+  .oc-table-header-cell-ddate,
+  .oc-table-data-cell-ddate,
+  .oc-table-header-cell-size,
+  .oc-table-data-cell-size,
+  .oc-table-header-cell-sharedWith,
+  .oc-table-data-cell-sharedWith,
+  .oc-table-header-cell-owner,
+  .oc-table-data-cell-owner,
+  .oc-table-header-cell-status,
+  .oc-table-data-cell-status {
+    display: none;
+
+    @media only screen and (min-width: 640px) {
+      display: table-cell;
+    }
+  }
+
+  .oc-table-header-cell-owner,
+  .oc-table-data-cell-owner {
+    display: none;
+
+    @media only screen and (min-width: 960px) {
+      display: table-cell;
+    }
+  }
+
+  &-squashed {
+    .oc-table-header-cell-mdate,
+    .oc-table-data-cell-mdate,
+    .oc-table-header-cell-sdate,
+    .oc-table-data-cell-sdate,
+    .oc-table-header-cell-ddate,
+    .oc-table-data-cell-ddate,
+    .oc-table-header-cell-size,
+    .oc-table-data-cell-size,
+    .oc-table-header-cell-sharedWith,
+    .oc-table-data-cell-sharedWith,
+    .oc-table-header-cell-owner,
+    .oc-table-data-cell-owner,
+    .oc-table-header-cell-status,
+    .oc-table-data-cell-status {
+      display: none;
+
+      @media only screen and (min-width: 1600px) {
+        display: table-cell;
+      }
+    }
+  }
+}
 </style>