From 7d98197c45ce0fec6f02fbc0385c70af8d1af2d9 Mon Sep 17 00:00:00 2001 From: "@suet-kei.chan" Date: Thu, 18 Dec 2025 17:10:57 +0100 Subject: [PATCH 1/5] Use Nextcloud default folder icons instead of custom theme icons --- css/apps/files.scss | 17 ----------------- src/icons.mjs | 4 ---- 2 files changed, 21 deletions(-) diff --git a/css/apps/files.scss b/css/apps/files.scss index 0922ec9..619d22f 100644 --- a/css/apps/files.scss +++ b/css/apps/files.scss @@ -11,10 +11,6 @@ max-width: unset; max-height: unset; width: 44px; - - svg { - display: none; - } } @mixin header-menu-files { @@ -630,10 +626,6 @@ table.files-filestable { height: calc(100% - 2 * 14px); position: absolute; - &.folder-icon { - background-image: var(--icon-mime-folder-blue); - } - &.files-list__row-icon-overlay { max-width: calc(50% - 2 * 14px); max-height: calc(50% - 2 * 14px); @@ -824,10 +816,6 @@ table.files-filestable { .material-design-icon:not(.play-circle-icon) { @include thumbnail-icons(); - &.folder-icon { - background-image: var(--icon-mime-folder-blue); - } - &.files-list__row-icon-overlay { width: 22px; height: 22px; @@ -1153,11 +1141,6 @@ table.files-filestable { margin-right: 16px; margin-left: 24px; z-index: 100; - - .material-design-icon.folder-icon { - background-image: var(--icon-mime-folder-blue); - @include thumbnail-icons(); - } } } } diff --git a/src/icons.mjs b/src/icons.mjs index 64bafd6..172329b 100644 --- a/src/icons.mjs +++ b/src/icons.mjs @@ -226,10 +226,6 @@ const iconsColor = { path: path.join(__dirname, '../img', 'rich-workspace', 'danger.svg'), color: 'danger', }, - 'mime-folder': { - path: path.join(__dirname, '../img', 'filetypes', 'folder.svg'), - color: 'blue', - }, } let css = '' From faed8304a24505ea9eb7c603f321ee4bc71f0b38 Mon Sep 17 00:00:00 2001 From: "@suet-kei.chan" Date: Thu, 18 Dec 2025 17:27:32 +0100 Subject: [PATCH 2/5] Style folder icons with 44px size and blue color --- css/apps/files.scss | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/css/apps/files.scss b/css/apps/files.scss index 619d22f..f111553 100644 --- a/css/apps/files.scss +++ b/css/apps/files.scss @@ -626,6 +626,13 @@ table.files-filestable { height: calc(100% - 2 * 14px); position: absolute; + &.folder-icon svg, + &.folder-open-icon svg { + width: 44px; + height: 44px; + color: #84B0F5; + } + &.files-list__row-icon-overlay { max-width: calc(50% - 2 * 14px); max-height: calc(50% - 2 * 14px); @@ -816,6 +823,13 @@ table.files-filestable { .material-design-icon:not(.play-circle-icon) { @include thumbnail-icons(); + &.folder-icon svg, + &.folder-open-icon svg { + width: 44px; + height: 44px; + color: #84B0F5; + } + &.files-list__row-icon-overlay { width: 22px; height: 22px; From 70102feb5d3cc28737977caa3bc3f7d48427cb83 Mon Sep 17 00:00:00 2001 From: "@suet-kei.chan" Date: Thu, 18 Dec 2025 17:36:33 +0100 Subject: [PATCH 3/5] Update folder icon dimensions and replace hardcoded colors with CSS variables --- css/apps/files.scss | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/css/apps/files.scss b/css/apps/files.scss index f111553..702e7d4 100644 --- a/css/apps/files.scss +++ b/css/apps/files.scss @@ -628,9 +628,9 @@ table.files-filestable { &.folder-icon svg, &.folder-open-icon svg { - width: 44px; - height: 44px; - color: #84B0F5; + width: 45px; + height: 36px; + color: var(--nmc-ods-blue-active); } &.files-list__row-icon-overlay { @@ -825,9 +825,9 @@ table.files-filestable { &.folder-icon svg, &.folder-open-icon svg { - width: 44px; - height: 44px; - color: #84B0F5; + width: 45px; + height: 36px; + color: var(--nmc-ods-blue-active); } &.files-list__row-icon-overlay { @@ -1001,7 +1001,7 @@ table.files-filestable { display: flex; align-items: center; justify-content: center; - background-color: #D2E2FC; + background-color: var(--nmc-ods-blue-primary); .button-vue__icon { background-image: var(--icon-shared-dark); @@ -1013,18 +1013,18 @@ table.files-filestable { &:hover { border: none; - background-color: #9EC1F7; + background-color: var(--nmc-ods-blue-active); } &:active { border: 1px solid var(--telekom-color-ui-black); - background-color: #FFFFFF; + background-color: var(--nmc-ods-blue-pressed); } &:focus, &:focus-visible { border: none; - background-color: #D2E2FC; + background-color: var(--nmc-ods-blue-primary); outline: 2px solid var(--telekom-color-ui-black); outline-offset: 2px; } @@ -1060,11 +1060,11 @@ table.files-filestable { display: flex; align-items: center; justify-content: center; - background-color: #D2E2FC; + background-color: var(--nmc-ods-blue-primary); &:hover { border: none; - background-color: #9EC1F7; + background-color: var(--nmc-ods-blue-active); svg { color: var(--color-main-text); @@ -1073,13 +1073,13 @@ table.files-filestable { &:active { border: 1px solid var(--telekom-color-ui-black); - background-color: #FFFFFF; + background-color: var(--nmc-ods-blue-pressed); } &:focus, &:focus-visible { border: none; - background-color: #D2E2FC; + background-color: var(--nmc-ods-blue-primary); outline: 2px solid var(--telekom-color-ui-black); outline-offset: 2px; } From 163708ee62c7a6ba15301d54213db4d18b6541ba Mon Sep 17 00:00:00 2001 From: "@suet-kei.chan" Date: Thu, 18 Dec 2025 18:06:53 +0100 Subject: [PATCH 4/5] Hide overlay icon SVG elements and adjust folder icon size to 44px --- css/apps/files.scss | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/css/apps/files.scss b/css/apps/files.scss index 702e7d4..a876266 100644 --- a/css/apps/files.scss +++ b/css/apps/files.scss @@ -628,8 +628,8 @@ table.files-filestable { &.folder-icon svg, &.folder-open-icon svg { - width: 45px; - height: 36px; + width: 44px; + height: 44px; color: var(--nmc-ods-blue-active); } @@ -640,6 +640,10 @@ table.files-filestable { height: calc(50% - 2 * 14px); margin-top: 10px; + svg { + display: none; + } + &.link-icon, &.account-plus-icon { background-image: var(--original-icon-folder-overlay-share-white); } @@ -825,8 +829,8 @@ table.files-filestable { &.folder-icon svg, &.folder-open-icon svg { - width: 45px; - height: 36px; + width: 44px; + height: 44px; color: var(--nmc-ods-blue-active); } @@ -835,6 +839,10 @@ table.files-filestable { height: 22px; margin-top: 10px; + svg { + display: none; + } + &.link-icon, &.account-plus-icon { background-image: var(--original-icon-folder-overlay-share-white); } From 3d337f1b1e980d7f3f8fd350c80f978af58e30c3 Mon Sep 17 00:00:00 2001 From: "@suet-kei.chan" Date: Thu, 18 Dec 2025 18:13:28 +0100 Subject: [PATCH 5/5] Revert to using custom folder icon --- src/icons.mjs | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/icons.mjs b/src/icons.mjs index 172329b..64bafd6 100644 --- a/src/icons.mjs +++ b/src/icons.mjs @@ -226,6 +226,10 @@ const iconsColor = { path: path.join(__dirname, '../img', 'rich-workspace', 'danger.svg'), color: 'danger', }, + 'mime-folder': { + path: path.join(__dirname, '../img', 'filetypes', 'folder.svg'), + color: 'blue', + }, } let css = ''