Files
outline/app/editor/components/ToolbarButton.tsx
Tom Moor 08df14618c Various commenting improvements (#4938)
* fix: New threads attached to previous as replies

* fix: Cannot use floating toolbar properly in comments

* perf: Avoid re-writing history on click in editor

* fix: Comment on text selection

* fix: 'Copy link' on comments uses wrong hostname

* Show comment buttons on input focus rather than non-empty input
Increase maximum sidebar size

* Allow opening comments from document menu

* fix: Clicking comment menu should not focus thread
2023-02-26 11:19:12 -08:00

43 lines
768 B
TypeScript

import styled from "styled-components";
type Props = { active?: boolean; disabled?: boolean };
export default styled.button.attrs((props) => ({
type: props.type || "button",
}))<Props>`
display: inline-block;
flex: 0;
width: 24px;
height: 24px;
cursor: var(--pointer);
border: none;
background: none;
transition: opacity 100ms ease-in-out;
padding: 0;
opacity: 0.7;
outline: none;
pointer-events: all;
position: relative;
color: ${(props) => props.theme.toolbarItem};
&:hover {
opacity: 1;
}
&:disabled {
opacity: 0.3;
cursor: default;
}
&:before {
position: absolute;
content: "";
top: -4px;
right: -4px;
left: -4px;
bottom: -4px;
}
${(props) => props.active && "opacity: 1;"};
`;