diff --git a/src/file-viewer/tags/media-list-item.marko b/src/file-viewer/tags/media-list-item.marko index ecb9c6782dcdcb6ae4e64602c630152f410ef2ea..88255d77275602e7d390f5e879b78e116cfa99d3 100644 --- a/src/file-viewer/tags/media-list-item.marko +++ b/src/file-viewer/tags/media-list-item.marko @@ -45,7 +45,7 @@ static const unknownDateWithKnownYear = new Date("1970-02-20"); : `/file${format.escapeUri(file.path)}` ) > - + @@ -54,7 +54,7 @@ static const unknownDateWithKnownYear = new Date("1970-02-20"); ${meta} - + diff --git a/src/file-viewer/views/clofi.css b/src/file-viewer/views/clofi.css index 6e507e453e35037aa67887c5e050d68ad6b8d150..1d4bb6b84eb6a0b09ec66646616b9f85515f6cbd 100644 --- a/src/file-viewer/views/clofi.css +++ b/src/file-viewer/views/clofi.css @@ -121,6 +121,12 @@ body { overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; + align-items: baseline; + & > span { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + } } .actions { display: flex; @@ -202,7 +208,8 @@ a.header { --muted: red !important; } position: relative; - display: block; + display: flex; + align-items: baseline; text-overflow: ellipsis; font-size: 0.5rem; overflow: hidden; @@ -211,6 +218,16 @@ a.header { color: var(--fg); font-size: 1rem; } + .file-row-meta { + flex: 0 0 auto; + } + .file-row-name { + flex: 1 1 auto; + min-width: 0; + display: block; + overflow: hidden; + text-overflow: ellipsis; + } &:hover:not(.active) { background-color: rgb(from var(--dark-bg) r g b / 0.5); } @@ -337,6 +354,7 @@ h3 { } .ico { display: inline-block; + flex: 0 0 19px; height: 19px; position: relative; width: 19px;