Stowage/tutanota
2
0
Fork 0
mirror of https://github.com/tutao/tutanota.git synced 2025-10-19 07:53:47 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix folder column alignment

Browse source
This commit is contained in:
mab 2025-10-16 17:28:21 +02:00
parent 495086745a
commit c45cb5b51f
2 changed files with 37 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/drive-app/drive/view/DriveFolderContent.ts
View file

@ -36,7 +36,7 @@ export class DriveFolderContent implements Component<DriveFolderContentAttrs> {
// m("th", "Actions"),
// ]),
// ), // DriveFolderContentHeader
m("div.flex.row", { style: { "text-align": "center", "padding-left": "16px" } }, [
m("div.flex.row.folder-row", { style: { padding: "8px 24px" } }, [
m("div", { style: { ...columnStyle, width: columnSizes.select } }, []),
// Icons...
m("div", { style: { ...columnStyle, width: columnSizes.icon } }, []),

74
src/drive-app/drive/view/DriveFolderContentEntry.ts
View file

@ -38,47 +38,45 @@ export class DriveFolderContentEntry implements Component<DriveFolderContentEntr
const thisFileIsAFolder = isFolder(file)
return m("div.flex.row", { style: DriveFolderContentEntryRowStyle }, [
m("div", { style: { display: "flex", gap: "16px" } }, [
m("div", { style: { width: columnSizes.select } }, m("input[type=checkbox]")),
// m("td", m(Checkbox, { label: () => "selected", checked, onChecked: () => onSelect(file) })),
return m("div.flex.row.folder-row", { style: DriveFolderContentEntryRowStyle }, [
m("div", { style: { width: columnSizes.select } }, m("input[type=checkbox]")),
// m("td", m(Checkbox, { label: () => "selected", checked, onChecked: () => onSelect(file) })),
m(
"div",
{ style: { width: columnSizes.icon } },
thisFileIsAFolder
? m(Icon, {
icon: Icons.Folder,
size: IconSize.Normal,
// style: { position: "relative", top: "2px" },
})
: null,
// choose right icon depending on type
// m(Icon, {
// icon: Icons.Draft,
// size: IconSize.Normal,
// // style: { position: "relative", top: "2px" },
// }),
),
m(
"div",
{ style: { width: columnSizes.name } },
m(
"div",
{ style: { width: columnSizes.icon } },
thisFileIsAFolder
? m(Icon, {
icon: Icons.Folder,
size: IconSize.Normal,
// style: { position: "relative", top: "2px" },
})
: null,
// choose right icon depending on type
// m(Icon, {
// icon: Icons.Draft,
// size: IconSize.Normal,
// // style: { position: "relative", top: "2px" },
// }),
),
m(
"div",
{ style: { width: columnSizes.name } },
m(
"span",
{
onclick: () => {
if (thisFileIsAFolder) {
driveViewModel.navigateToFolder(file._id)
} else {
// download
driveViewModel.downloadFile(file)
}
},
class: "cursor-pointer",
"span",
{
onclick: () => {
if (thisFileIsAFolder) {
driveViewModel.navigateToFolder(file._id)
} else {
// download
driveViewModel.downloadFile(file)
}
},
file.name,
),
class: "cursor-pointer",
},
file.name,
),
]),
),
m("div", { style: { width: columnSizes.type } }, file.mimeType?.split("/")[1]),
m("div", { style: { width: columnSizes.size } }, thisFileIsAFolder ? "🐱" : formatStorageSize(Number(file.size))),
m("div", { style: { width: columnSizes.date } }, uploadDate.toLocaleString()),