fix: Move references spacing directly below content (#1113)

* fix: Move references spacing directly below content

* Child document -> Nested document
This commit is contained in:
Tom Moor 2019-12-18 21:00:36 -08:00 committed by GitHub
parent 949dd296b4
commit 293c3b7b9c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 33 additions and 12 deletions

View File

@ -17,6 +17,7 @@ import embeds from '../../embeds';
type Props = {
defaultValue?: string,
readOnly?: boolean,
grow?: boolean,
disableEmbeds?: boolean,
forwardedRef: React.Ref<RichMarkdownEditor>,
ui: UiStore,
@ -103,6 +104,7 @@ class Editor extends React.Component<Props> {
}
const StyledEditor = styled(RichMarkdownEditor)`
flex-grow: ${props => (props.grow ? 'initial' : '0')};
justify-content: start;
> div {

View File

@ -188,9 +188,9 @@ class DocumentMenu extends React.Component<Props> {
{can.update && (
<DropdownMenuItem
onClick={this.handleNewChild}
title="Create a new child document for the current document"
title="Create a nested document inside the current document"
>
New child document
New nested document
</DropdownMenuItem>
)}
{can.update && (

View File

@ -49,7 +49,7 @@ class NewChildDocumentMenu extends React.Component<Props> {
</span>
</DropdownMenuItem>
<DropdownMenuItem onClick={this.handleNewChild}>
New child document
New nested document
</DropdownMenuItem>
</DropdownMenu>
);

View File

@ -52,6 +52,19 @@ export default class Document extends BaseModel {
}
}
@computed
get isOnlyTitle(): boolean {
const { title } = parseTitle(this.text);
// find and extract title
const trimmedBody = this.text
.trim()
.replace(/^#/, '')
.trim();
return unescape(trimmedBody) === title;
}
@computed
get modifiedSinceViewed(): boolean {
return !!this.lastViewedAt && this.lastViewedAt < this.updatedAt;

View File

@ -440,7 +440,11 @@ class DocumentScene extends React.Component<Props> {
schema={schema}
/>
{!this.isEditing &&
!isShare && <References document={document} />}
!isShare && (
<ReferencesWrapper isOnlyTitle={document.isOnlyTitle}>
<References document={document} />
</ReferencesWrapper>
)}
</MaxWidth>
</Container>
</Container>
@ -450,6 +454,10 @@ class DocumentScene extends React.Component<Props> {
}
}
const ReferencesWrapper = styled('div')`
margin-top: ${props => (props.isOnlyTitle ? -45 : 16)}px;
`;
const MaxWidth = styled(Flex)`
${props =>
props.archived && `* { color: ${props.theme.textSecondary} !important; } `};

View File

@ -34,12 +34,10 @@ class DocumentEditor extends React.Component<Props> {
<Editor
ref={ref => (this.editor = ref)}
plugins={plugins}
grow={!readOnly}
{...this.props}
/>
<ClickablePadding
onClick={!readOnly ? this.focusAtEnd : undefined}
grow
/>
{!readOnly && <ClickablePadding onClick={this.focusAtEnd} grow />}
</React.Fragment>
);
}

View File

@ -42,7 +42,7 @@ class References extends React.Component<Props> {
<Tabs>
{showChildren && (
<Tab to="#children" isActive={() => !isBacklinksTab}>
Child documents
Nested documents
</Tab>
)}
{showBacklinks && (

View File

@ -51,7 +51,7 @@ class DocumentDelete extends React.Component<Props> {
<HelpText>
Are you sure about that? Deleting the{' '}
<strong>{document.title}</strong> document will delete all of its
history, and any child documents.
history, and any nested documents.
</HelpText>
{!document.isDraft &&
!document.isArchived && (

View File

@ -439,7 +439,7 @@ export default function Api() {
<Method method="documents.archive" label="Archive a document">
<Description>
Archive a document and all of its child documents, if any.
Archive a document and all of its nested documents, if any.
</Description>
<Arguments>
<Argument
@ -452,7 +452,7 @@ export default function Api() {
<Method method="documents.delete" label="Delete a document">
<Description>
Permanantly delete a document and all of its child documents, if
Permanantly delete a document and all of its nested documents, if
any.
</Description>
<Arguments>