Page MenuHomePhabricator
Files F2899288

D3283.diff
No OneTemporary
Actions

D3283.diff
View Options

diff --git a/web/chat/chat-message-list.css b/web/chat/chat-message-list.css
--- a/web/chat/chat-message-list.css
+++ b/web/chat/chat-message-list.css
@@ -82,24 +82,43 @@
border-color: transparent transparent var(--tool-tip-bg) transparent;
}
-div.messageActionLinks {
+div.messageActionActiveArea {
position: absolute;
display: flex;
top: 0;
bottom: 0;
align-items: center;
- color: gray;
- padding: 0 6px;
+ padding: 0 12px;
}
-div.viewerMessageActionLinks {
+
+div.viewerMessageActionActiveArea {
right: 100%;
}
-div.nonViewerMessageActionLinks {
+div.nonViewerMessageActiveArea {
left: 100%;
}
-div.messageActionLinks > div + div {
+div.messageActionActiveArea > div + div {
margin-left: 4px;
}
+
+div.messageActionContainer {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ padding: 0 6px;
+ background-color: var(--message-action-tooltip-bg);
+ border-radius: 8px;
+}
+
+div.messageActionContainer svg {
+ padding: 10px 6px 6px;
+ color: var(--fg);
+}
+div.messageActionContainer svg:hover {
+ cursor: pointer;
+}
+
div.messageActionLinkIcon:hover {
cursor: pointer;
}
diff --git a/web/chat/composed-message.react.js b/web/chat/composed-message.react.js
--- a/web/chat/composed-message.react.js
+++ b/web/chat/composed-message.react.js
@@ -166,24 +166,28 @@
viewerActionLinks = (
<div
className={classNames(
- css.messageActionLinks,
- css.viewerMessageActionLinks,
+ css.messageActionActiveArea,
+ css.viewerMessageActionActiveArea,
)}
>
- {messageActionButton}
- {replyButton}
+ <div className={css.messageActionContainer}>
+ {messageActionButton}
+ {replyButton}
+ </div>
</div>
);
} else if (replyButton || messageActionButton) {
nonViewerActionLinks = (
<div
className={classNames(
- css.messageActionLinks,
- css.nonViewerMessageActionLinks,
+ css.messageActionActiveArea,
+ css.nonViewerMessageActiveArea,
)}
>
- {replyButton}
- {messageActionButton}
+ <div className={css.messageActionContainer}>
+ {replyButton}
+ {messageActionButton}
+ </div>
</div>
);
}
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -100,4 +100,5 @@
--thread-ancestor-color-light: var(--shades-white-70);
--thread-ancestor-color-dark: var(--shades-black-100);
--text-message-default-background: var(--shades-black-80);
+ --message-action-tooltip-bg: var(--shades-black-90);
}

File Metadata

Mime Type
text/plain
Expires
Sun, Oct 6, 6:22 AM (21 h, 58 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2248124
Default Alt Text
D3283.diff (2 KB)

Event Timeline