diff --git a/web/src/message_list_tooltips.ts b/web/src/message_list_tooltips.ts
index 642f39868f..6a73dfb97e 100644
--- a/web/src/message_list_tooltips.ts
+++ b/web/src/message_list_tooltips.ts
@@ -358,6 +358,18 @@ export function initialize(): void {
},
});
+ message_list_tooltip(".media-audio-download", {
+ delay: LONG_HOVER_DELAY,
+ onShow(instance) {
+ const title = $(instance.reference).attr("aria-label");
+ assert(title !== undefined);
+ instance.setContent(title);
+ },
+ onHidden(instance) {
+ instance.destroy();
+ },
+ });
+
message_list_tooltip(".view_user_card_tooltip", {
delay: LONG_HOVER_DELAY,
onShow(instance) {
diff --git a/web/styles/rendered_markdown.css b/web/styles/rendered_markdown.css
index ca8f072309..d60ce4ab95 100644
--- a/web/styles/rendered_markdown.css
+++ b/web/styles/rendered_markdown.css
@@ -687,6 +687,17 @@
max-width: calc(100% - 30px);
}
+ .media-audio-download {
+ flex: 0 0 20px;
+ margin-left: 5px;
+ display: flex;
+ place-content: center center;
+
+ &:hover {
+ text-decoration: none;
+ }
+ }
+
.message_embed {
display: grid;
grid-template-columns:
@@ -758,7 +769,7 @@
}
}
- & a {
+ & a:not(.icon-button) {
color: var(--color-markdown-link);
text-decoration: none;
diff --git a/web/templates/markdown_audio.hbs b/web/templates/markdown_audio.hbs
index 451f0c5394..236caf0df9 100644
--- a/web/templates/markdown_audio.hbs
+++ b/web/templates/markdown_audio.hbs
@@ -1,5 +1,9 @@
{{~!-- --~}}
+
+
+
{{~!-- --~}}
diff --git a/web/tests/rendered_markdown.test.cjs b/web/tests/rendered_markdown.test.cjs
index 37383e2760..48d005e22f 100644
--- a/web/tests/rendered_markdown.test.cjs
+++ b/web/tests/rendered_markdown.test.cjs
@@ -564,6 +564,10 @@ run_test("audio", ({mock_template}) => {
audio_html,
'\n' +
' \n' +
+ ' \n' +
+ ' \n' +
+ " \n" +
"",
);
});