Page MenuHomePhorge
Files F32221602

D6158.1765198728.diff
No OneTemporary
Actions

Size
1 KB
Referenced Files
None
Subscribers
None

D6158.1765198728.diff
View Options

diff --git a/web/sidebar/expand-buttons.css b/web/sidebar/expand-buttons.css
new file mode 100644
--- /dev/null
+++ b/web/sidebar/expand-buttons.css
@@ -0,0 +1,13 @@
+.buttonIcon {
+ color: var(--drawer-expand-button);
+}
+
+.disabledButtonIcon {
+ color: var(--drawer-expand-button-disabled);
+}
+
+.button {
+ font-size: var(--xs-font-12);
+ width: 24px;
+ height: 24px;
+}
diff --git a/web/sidebar/expand-buttons.react.js b/web/sidebar/expand-buttons.react.js
new file mode 100644
--- /dev/null
+++ b/web/sidebar/expand-buttons.react.js
@@ -0,0 +1,33 @@
+// @flow
+
+import { faCaretDown, faCaretRight } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import classNames from 'classnames';
+import * as React from 'react';
+
+import Button from '../components/button.react';
+import css from './expand-buttons.css';
+
+type Props = {
+ +onClick?: () => mixed,
+ +expanded?: boolean,
+ +disabled?: boolean,
+};
+
+function ExpandButton(props: Props): React.Node {
+ const { onClick, expanded = false, disabled } = props;
+ const icon = expanded ? faCaretDown : faCaretRight;
+
+ const iconClass = classNames({
+ [css.disabledButtonIcon]: disabled,
+ [css.buttonIcon]: !disabled,
+ });
+
+ return (
+ <Button onClick={onClick} className={css.button} disabled={disabled}>
+ <FontAwesomeIcon icon={icon} className={iconClass} />
+ </Button>
+ );
+}
+
+export { ExpandButton };
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -194,4 +194,6 @@
--spoiler-text-color: var(--spoiler-color);
--spoiler-background-color: var(--spoiler-color);
--purple-link: var(--violet-light-100);
+ --drawer-expand-button: var(--shades-black-60);
+ --drawer-expand-button-disabled: var(--shades-black-80);
}

File Metadata

Mime Type
text/plain
Expires
Mon, Dec 8, 12:58 PM (12 h, 33 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5848358
Default Alt Text
D6158.1765198728.diff (1 KB)

Event Timeline