Page MenuHomePhorge
Files F32566012

D3188.1767372692.diff
No OneTemporary
Actions

Size
2 KB
Referenced Files
None
Subscribers
None

D3188.1767372692.diff
View Options

diff --git a/web/chat/thread-menu-item.react.js b/web/chat/thread-menu-item.react.js
new file mode 100644
--- /dev/null
+++ b/web/chat/thread-menu-item.react.js
@@ -0,0 +1,33 @@
+// @flow
+
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import classNames from 'classnames';
+import * as React from 'react';
+
+import css from './thread-menu.css';
+
+type ThreadMenuItemProps = {
+ +onClick?: () => void,
+ +icon: IconDefinition,
+ +text: string,
+ +dangerous?: boolean,
+};
+
+function ThreadMenuItem(props: ThreadMenuItemProps): React.Node {
+ const { onClick, icon, text, dangerous } = props;
+
+ const itemClasses = classNames(css.topBarMenuAction, {
+ [css.topBarMenuActionDangerous]: dangerous,
+ });
+ return (
+ <button className={itemClasses} onClick={onClick}>
+ <div className={css.topBarMenuActionIcon}>
+ <FontAwesomeIcon icon={icon} className={css.promptIcon} />
+ </div>
+ <div className={css.topBarMenuActionDescription}>{text}</div>
+ </button>
+ );
+}
+
+export default ThreadMenuItem;
diff --git a/web/chat/thread-menu.css b/web/chat/thread-menu.css
--- a/web/chat/thread-menu.css
+++ b/web/chat/thread-menu.css
@@ -20,3 +20,34 @@
div.disabled {
display: none;
}
+
+button.topBarMenuAction {
+ z-index: 1;
+ background-color: transparent;
+ padding: 15px;
+ color: var(--thread-menu-color);
+ background-color: var(--thread-menu-bg);
+ font-size: var(--m-font-16);
+ border: none;
+ cursor: pointer;
+ display: flex;
+ column-gap: 8px;
+ align-items: center;
+}
+
+button.topBarMenuAction:hover {
+ color: var(--thread-menu-color-hover);
+}
+
+div.topBarMenuActionIcon {
+ display: flex;
+ justify-content: center;
+ width: 20px;
+}
+
+button.topBarMenuActionDangerous {
+ color: var(--thread-menu-color-dangerous);
+}
+button.topBarMenuActionDangerous:hover {
+ color: var(--thread-menu-color-dangerous-hover);
+}
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -101,4 +101,9 @@
--thread-ancestor-color-light: var(--shades-white-70);
--thread-ancestor-color-dark: var(--shades-black-100);
--thread-menu-bg: var(--shades-black-90);
+ --thread-menu-separator-color: var(--shades-black-80);
+ --thread-menu-color: var(--shades-black-60);
+ --thread-menu-color-hover: var(--shades-white-100);
+ --thread-menu-color-dangerous: var(--error-primary);
+ --thread-menu-color-dangerous-hover: var(--error-light-50);
}

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 2, 4:51 PM (19 h, 45 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5880651
Default Alt Text
D3188.1767372692.diff (2 KB)

Event Timeline