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;