diff --git a/LICENSE b/LICENSE index 0434a877e..e9d8bae0f 100644 --- a/LICENSE +++ b/LICENSE @@ -3,7 +3,7 @@ Business Source License 1.1 Parameters Licensor: General Outline, Inc. -Licensed Work: Outline 0.46.0 +Licensed Work: Outline 0.47.1 The Licensed Work is (c) 2020 General Outline, Inc. Additional Use Grant: You may make use of the Licensed Work, provided that you may not use the Licensed Work for a Document @@ -15,7 +15,7 @@ Additional Use Grant: You may make use of the Licensed Work, provided that Licensed Work by creating teams and documents controlled by such third parties. -Change Date: 2023-08-12 +Change Date: 2023-09-11 Change License: Apache License, Version 2.0 diff --git a/app/components/Breadcrumb.js b/app/components/Breadcrumb.js index 08cc104e7..79466dc40 100644 --- a/app/components/Breadcrumb.js +++ b/app/components/Breadcrumb.js @@ -1,11 +1,13 @@ // @flow import { observer, inject } from "mobx-react"; import { - PadlockIcon, + ArchiveIcon, + EditIcon, GoToIcon, MoreIcon, + PadlockIcon, ShapesIcon, - EditIcon, + TrashIcon, } from "outline-icons"; import * as React from "react"; import { Link } from "react-router-dom"; @@ -25,11 +27,73 @@ type Props = { onlyText: boolean, }; -const Breadcrumb = observer(({ document, collections, onlyText }: Props) => { - const collection = collections.get(document.collectionId); - if (!collection) return
; +function Icon({ document }) { + if (document.isDeleted) { + return ( + <> + + +   + Trash + + + + ); + } + if (document.isArchived) { + return ( + <> + + +   + Archive + + + + ); + } + if (document.isDraft) { + return ( + <> + + +   + Drafts + + + + ); + } + if (document.isTemplate) { + return ( + <> + + +   + Templates + + + + ); + } + return null; +} - const path = collection.pathToDocument(document).slice(0, -1); +const Breadcrumb = observer(({ document, collections, onlyText }: Props) => { + let collection = collections.get(document.collectionId); + if (!collection) { + if (!document.deletedAt) return
; + + collection = { + id: document.collectionId, + name: "Deleted Collection", + color: "currentColor", + }; + } + + const path = collection.pathToDocument + ? collection.pathToDocument(document).slice(0, -1) + : []; if (onlyText === true) { return ( @@ -50,34 +114,13 @@ const Breadcrumb = observer(({ document, collections, onlyText }: Props) => { ); } - const isTemplate = document.isTemplate; - const isDraft = !document.publishedAt && !isTemplate; const isNestedDocument = path.length > 1; const lastPath = path.length ? path[path.length - 1] : undefined; const menuPath = isNestedDocument ? path.slice(0, -1) : []; return ( - {isTemplate && ( - <> - - -   - Templates - - - - )} - {isDraft && ( - <> - - -   - Drafts - - - - )} +   @@ -127,12 +170,12 @@ export const Slash = styled(GoToIcon)` const Overflow = styled(MoreIcon)` flex-shrink: 0; - opacity: 0.25; transition: opacity 100ms ease-in-out; + fill: ${(props) => props.theme.divider}; - &:hover, - &:active { - opacity: 1; + &:active, + &:hover { + fill: ${(props) => props.theme.text}; } `; diff --git a/app/components/Button.js b/app/components/Button.js index ba18085f7..d10333ad0 100644 --- a/app/components/Button.js +++ b/app/components/Button.js @@ -1,6 +1,6 @@ // @flow import { ExpandedIcon } from "outline-icons"; -import { darken, lighten } from "polished"; +import { darken } from "polished"; import * as React from "react"; import styled from "styled-components"; @@ -19,7 +19,6 @@ const RealButton = styled.button` height: 32px; text-decoration: none; flex-shrink: 0; - outline: none; cursor: pointer; user-select: none; @@ -36,13 +35,6 @@ const RealButton = styled.button` background: ${(props) => darken(0.05, props.theme.buttonBackground)}; } - &:focus { - transition-duration: 0.05s; - box-shadow: ${(props) => lighten(0.4, props.theme.buttonBackground)} 0px 0px - 0px 3px; - outline: none; - } - &:disabled { cursor: default; pointer-events: none; @@ -70,13 +62,6 @@ const RealButton = styled.button` border: 1px solid ${props.theme.buttonNeutralBorder}; } - &:focus { - transition-duration: 0.05s; - border: 1px solid ${lighten(0.4, props.theme.buttonBackground)}; - box-shadow: ${lighten(0.4, props.theme.buttonBackground)} 0px 0px - 0px 2px; - } - &:disabled { color: ${props.theme.textTertiary}; } @@ -89,12 +74,6 @@ const RealButton = styled.button` &:hover { background: ${darken(0.05, props.theme.danger)}; } - - &:focus { - transition-duration: 0.05s; - box-shadow: ${lighten(0.4, props.theme.danger)} 0px 0px - 0px 3px; - } `}; `; diff --git a/app/components/CollectionIcon.js b/app/components/CollectionIcon.js index 3d1e4fda2..3efe7ebb3 100644 --- a/app/components/CollectionIcon.js +++ b/app/components/CollectionIcon.js @@ -18,7 +18,7 @@ function ResolvedCollectionIcon({ collection, expanded, size, ui }: Props) { // If the chosen icon color is very dark then we invert it in dark mode // otherwise it will be impossible to see against the dark background. const color = - ui.resolvedTheme === "dark" + ui.resolvedTheme === "dark" && collection.color !== "currentColor" ? getLuminance(collection.color) > 0.12 ? collection.color : "currentColor" diff --git a/app/components/DocumentHistory/DocumentHistory.js b/app/components/DocumentHistory/DocumentHistory.js index e6ce3c262..03f488f9b 100644 --- a/app/components/DocumentHistory/DocumentHistory.js +++ b/app/components/DocumentHistory/DocumentHistory.js @@ -193,6 +193,7 @@ const Header = styled(Flex)` padding: 12px; border-bottom: 1px solid ${(props) => props.theme.divider}; color: ${(props) => props.theme.text}; + flex-shrink: 0; `; export default inject("documents", "revisions")(DocumentHistory); diff --git a/app/components/DocumentHistory/components/Revision.js b/app/components/DocumentHistory/components/Revision.js index f776a729e..c8d0774ce 100644 --- a/app/components/DocumentHistory/components/Revision.js +++ b/app/components/DocumentHistory/components/Revision.js @@ -36,7 +36,7 @@ class RevisionListItem extends React.Component { {revision.createdBy.name} -