feat(files): reduce row height

Signed-off-by: skjnldsv <skjnldsv@protonmail.com>
This commit is contained in:
skjnldsv 2025-07-16 09:55:09 +02:00 committed by John Molakvoæ
parent 1dbd22e317
commit 6ef7700ec9
5 changed files with 11 additions and 11 deletions

View file

@ -235,7 +235,7 @@ export default defineComponent({
justify-content: center;
width: 100%;
// Breadcrumbs height + row thead height
min-height: calc(58px + 55px);
min-height: calc(58px + 44px);
margin: 0;
user-select: none;
color: var(--color-text-maxcontrast);

View file

@ -92,7 +92,7 @@ export default Vue.extend({
</script>
<style lang="scss">
$size: 32px;
$size: 24px;
$stack-shift: 6px;
.files-list-drag-image {
@ -112,8 +112,8 @@ $stack-shift: 6px;
overflow: hidden;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
width: $size;
height: $size;
border-radius: var(--border-radius);
}

View file

@ -56,8 +56,8 @@ export default defineComponent({
:deep() {
svg {
// We added a stroke for a11y so we must increase the size to include the stroke
width: 26px !important;
height: 26px !important;
width: 20px !important;
height: 20px !important;
// Override NcIconSvgWrapper defaults of 20px
max-width: unset !important;

View file

@ -481,13 +481,13 @@ export default defineComponent({
<style scoped lang="scss">
.files-list {
--row-height: 55px;
--row-height: 44px;
--cell-margin: 14px;
--checkbox-padding: calc((var(--row-height) - var(--checkbox-size)) / 2);
--checkbox-size: 24px;
--clickable-area: var(--default-clickable-area);
--icon-preview-size: 32px;
--icon-preview-size: 24px;
--fixed-block-start-position: var(--default-clickable-area);
display: flex;
@ -775,8 +775,8 @@ export default defineComponent({
// File and folder overlay
&-overlay {
position: absolute;
max-height: calc(var(--icon-preview-size) * 0.5);
max-width: calc(var(--icon-preview-size) * 0.5);
max-height: calc(var(--icon-preview-size) * 0.6);
max-width: calc(var(--icon-preview-size) * 0.6);
color: var(--color-primary-element-text);
// better alignment with the folder icon
margin-block-start: 2px;

View file

@ -157,7 +157,7 @@ export default defineComponent({
itemHeight() {
// Align with css in FilesListVirtual
// 166px + 32px (name) + 16px (mtime) + 16px (padding top and bottom)
return this.gridMode ? (166 + 32 + 16 + 16 + 16) : 55
return this.gridMode ? (166 + 32 + 16 + 16 + 16) : 44
},
// Grid mode only