* Comment model * Framework, model, policy, presenter, api endpoint etc * Iteration, first pass of UI * fixes, refactors * Comment commands * comment socket support * typing indicators * comment component, styling * wip * right sidebar resize * fix: CMD+Enter submit * Add usePersistedState fix: Main page scrolling on comment highlight * drafts * Typing indicator * refactor * policies * Click thread to highlight Improve comment timestamps * padding * Comment menu v1 * Change comments to use editor * Basic comment editing * fix: Hide commenting button when disabled at team level * Enable opening sidebar without mark * Move selected comment to location state * Add comment delete confirmation * Add comment count to document meta * fix: Comment sidebar togglable Add copy link to comment * stash * Restore History changes * Refactor right sidebar to allow for comment animation * Update to new router best practices * stash * Various improvements * stash * Handle click outside * Fix incorrect placeholder in input fix: Input box appearing on other sessions erroneously * stash * fix: Don't leave orphaned child comments * styling * stash * Enable comment toggling again * Edit styling, merge conflicts * fix: Cannot navigate from insights to comments * Remove draft comment mark on click outside * Fix: Empty comment sidebar, tsc * Remove public toggle * fix: All comments are recessed fix: Comments should not be printed * fix: Associated mark should be removed on comment delete * Revert unused changes * Empty state, basic RTL support * Create dont toggle comment mark * Make it feel more snappy * Highlight active comment in text * fix animation * RTL support * Add reply CTA * Translations
45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
import styled from "styled-components";
|
|
|
|
type Props = {
|
|
type?: "secondary" | "tertiary" | "danger";
|
|
size?: "large" | "small" | "xsmall";
|
|
dir?: "ltr" | "rtl" | "auto";
|
|
selectable?: boolean;
|
|
weight?: "bold" | "normal";
|
|
};
|
|
|
|
/**
|
|
* Use this component for all interface text that should not be selectable
|
|
* by the user, this is the majority of UI text explainers, notes, headings.
|
|
*/
|
|
const Text = styled.p<Props>`
|
|
margin-top: 0;
|
|
text-align: ${(props) => (props.dir ? props.dir : "left")};
|
|
color: ${(props) =>
|
|
props.type === "secondary"
|
|
? props.theme.textSecondary
|
|
: props.type === "tertiary"
|
|
? props.theme.textTertiary
|
|
: props.type === "danger"
|
|
? props.theme.brand.red
|
|
: props.theme.text};
|
|
font-size: ${(props) =>
|
|
props.size === "large"
|
|
? "18px"
|
|
: props.size === "small"
|
|
? "14px"
|
|
: props.size === "xsmall"
|
|
? "13px"
|
|
: "inherit"};
|
|
font-weight: ${(props) =>
|
|
props.weight === "bold"
|
|
? "bold"
|
|
: props.weight === "normal"
|
|
? "normal"
|
|
: "inherit"};
|
|
white-space: normal;
|
|
user-select: ${(props) => (props.selectable ? "text" : "none")};
|
|
`;
|
|
|
|
export default Text;
|