fix various bugs
This commit is contained in:
@ -46,12 +46,12 @@
|
||||
"mdast-util-definitions": "^1.2.2",
|
||||
"mdast-util-to-string": "^1.0.4",
|
||||
"moment": "^2.11.2",
|
||||
"netlify-cms-editor-component-image": "file:../netlify-cms-editor-component-image",
|
||||
"netlify-cms-lib-auth": "file:../netlify-cms-lib-auth",
|
||||
"netlify-cms-lib-util": "file:../netlify-cms-lib-util",
|
||||
"netlify-cms-ui-default": "file:../netlify-cms-ui-default",
|
||||
"netlify-cms-editor-component-image": "file:../netlify-cms-editor-component-image",
|
||||
"prop-types": "^15.5.10",
|
||||
"react": "15.x || 16.x",
|
||||
"react": "^16.4.1",
|
||||
"react-aria-menubutton": "^5.1.0",
|
||||
"react-autosuggest": "^9.3.2",
|
||||
"react-datetime": "^2.11.0",
|
||||
@ -69,7 +69,7 @@
|
||||
"react-router-redux": "^5.0.0-alpha.8",
|
||||
"react-scroll-sync": "^0.4.0",
|
||||
"react-sortable-hoc": "^0.6.8",
|
||||
"react-split-pane": "^0.1.81",
|
||||
"react-split-pane": "^0.1.82",
|
||||
"react-textarea-autosize": "^5.2.0",
|
||||
"react-toggled": "^1.1.2",
|
||||
"react-topbar-progress-indicator": "^2.0.0",
|
||||
|
@ -4,7 +4,8 @@ import { uniq, initial, last, get, find, hasIn, partial } from "lodash";
|
||||
import { filterPromises, resolvePromiseProperties } from "netlify-cms-lib-util/promise";
|
||||
import AssetProxy from "ValueObjects/AssetProxy";
|
||||
import { SIMPLE, EDITORIAL_WORKFLOW, status } from "Constants/publishModes";
|
||||
import { APIError, EditorialWorkflowError } from "netlify-cms-lib-util";
|
||||
import APIError from "netlify-cms-lib-util/APIError";
|
||||
import EditorialWorkflowError from "netlify-cms-lib-util/EditorialWorkflowError";
|
||||
|
||||
const CMS_BRANCH_PREFIX = 'cms/';
|
||||
|
||||
|
@ -16,7 +16,7 @@ const PREVIEW_VISIBLE = 'cms.preview-visible';
|
||||
const SCROLL_SYNC_ENABLED = 'cms.scroll-sync-enabled';
|
||||
|
||||
const styles = {
|
||||
noPreviewContainer: css`
|
||||
splitPane: css`
|
||||
${components.card};
|
||||
border-radius: 0;
|
||||
height: 100%;
|
||||
@ -53,18 +53,21 @@ injectGlobal`
|
||||
}
|
||||
}
|
||||
|
||||
`
|
||||
|
||||
const StyledSplitPane = styled(SplitPane)`
|
||||
${styles.splitPane};
|
||||
|
||||
/**
|
||||
* Quick fix for preview pane not fully displaying in Safari
|
||||
*/
|
||||
.SplitPane {
|
||||
.Pane {
|
||||
height: 100%;
|
||||
}
|
||||
.Pane {
|
||||
height: 100%;
|
||||
}
|
||||
`
|
||||
|
||||
const NoPreviewContainer = styled.div`
|
||||
${styles.noPreviewContainer};
|
||||
${styles.splitPane};
|
||||
`
|
||||
|
||||
const EditorContainer = styled.div`
|
||||
@ -202,7 +205,7 @@ class EditorInterface extends Component {
|
||||
const editorWithPreview = (
|
||||
<ScrollSync enabled={this.state.scrollSyncEnabled}>
|
||||
<div>
|
||||
<SplitPane
|
||||
<StyledSplitPane
|
||||
maxSize={-100}
|
||||
defaultSize="50%"
|
||||
onDragStarted={this.handleSplitPaneDragStart}
|
||||
@ -218,7 +221,7 @@ class EditorInterface extends Component {
|
||||
getAsset={getAsset}
|
||||
/>
|
||||
</PreviewPaneContainer>
|
||||
</SplitPane>
|
||||
</StyledSplitPane>
|
||||
</div>
|
||||
</ScrollSync>
|
||||
);
|
||||
|
@ -2,30 +2,25 @@ import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import styled from 'react-emotion';
|
||||
import Icon from 'netlify-cms-ui-default/Icon';
|
||||
import { colors, colorsRaw, shadows } from 'netlify-cms-ui-default/styles';
|
||||
import { colors, colorsRaw, shadows, buttons } from 'netlify-cms-ui-default/styles';
|
||||
|
||||
const EditorToggleButton = styled.button`
|
||||
${buttons.button};
|
||||
${shadows.dropMiddle};
|
||||
background-color: ${colorsRaw.white};
|
||||
color: ${props => colors[props.active ? `active` : `inactive`]};
|
||||
color: ${props => colors[props.isActive ? `active` : `inactive`]};
|
||||
border-radius: 32px;
|
||||
display: block;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding: 0;
|
||||
margin-bottom: 12px;
|
||||
|
||||
${Icon} {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
`
|
||||
|
||||
const EditorToggle = ({ enabled, active, onClick, icon }) => !enabled ? null :
|
||||
<EditorToggleButton onClick={onClick}>
|
||||
<EditorToggleButton onClick={onClick} isActive={active}>
|
||||
<Icon type={icon} size="large"/>
|
||||
</EditorToggleButton>;
|
||||
|
||||
|
@ -18,6 +18,7 @@ const styles = {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border: 0 solid ${colors.textFieldBorder};
|
||||
`,
|
||||
}
|
||||
|
||||
@ -38,6 +39,7 @@ const ToolbarContainer = styled.div`
|
||||
`
|
||||
|
||||
const ToolbarSectionMain = styled.div`
|
||||
${styles.toolbarSection};
|
||||
flex: 10;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -54,7 +56,6 @@ const ToolbarSubSectionLast = styled(ToolbarSubSectionFirst)`
|
||||
|
||||
const ToolbarSectionBackLink = styled(Link)`
|
||||
${styles.toolbarSection};
|
||||
border: 0 solid ${colors.textFieldBorder};
|
||||
border-right-width: 1px;
|
||||
font-weight: normal;
|
||||
padding: 0 20px;
|
||||
@ -116,6 +117,7 @@ const BackStatusChanged = styled(BackStatus)`
|
||||
`
|
||||
|
||||
const ToolbarButton = styled.button`
|
||||
${buttons.button};
|
||||
${buttons.default};
|
||||
${styles.buttonMargin};
|
||||
display: block;
|
||||
@ -151,6 +153,12 @@ const StatusButton = styled(StyledDropdownButton)`
|
||||
color: ${colorsRaw.teal};
|
||||
`
|
||||
|
||||
const StatusDropdownItem = styled(DropdownItem)`
|
||||
${Icon} {
|
||||
color: ${colors.infoText};
|
||||
}
|
||||
`
|
||||
|
||||
export default class EditorToolbar extends React.Component {
|
||||
static propTypes = {
|
||||
isPersisting: PropTypes.bool,
|
||||
@ -265,17 +273,17 @@ export default class EditorToolbar extends React.Component {
|
||||
<StatusButton>{isUpdatingStatus ? 'Updating...' : 'Set status'}</StatusButton>
|
||||
)}
|
||||
>
|
||||
<DropdownItem
|
||||
<StatusDropdownItem
|
||||
label="Draft"
|
||||
onClick={() => onChangeStatus('DRAFT')}
|
||||
icon={currentStatus === status.get('DRAFT') && 'check'}
|
||||
/>
|
||||
<DropdownItem
|
||||
<StatusDropdownItem
|
||||
label="In review"
|
||||
onClick={() => onChangeStatus('PENDING_REVIEW')}
|
||||
icon={currentStatus === status.get('PENDING_REVIEW') && 'check'}
|
||||
/>
|
||||
<DropdownItem
|
||||
<StatusDropdownItem
|
||||
label="Ready"
|
||||
onClick={() => onChangeStatus('PENDING_PUBLISH')}
|
||||
icon={currentStatus === status.get('PENDING_PUBLISH') && 'check'}
|
||||
|
@ -15,6 +15,9 @@ const CloseButton = styled.button`
|
||||
border-radius: 50%;
|
||||
background-color: white;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
`
|
||||
|
||||
const LibraryTitle = styled.h1`
|
||||
|
@ -1,5 +1,5 @@
|
||||
import { Map } from 'immutable';
|
||||
import { resolvePath } from 'netlify-cms-lib-util';
|
||||
import { resolvePath } from 'netlify-cms-lib-util/path';
|
||||
import { ADD_ASSET, REMOVE_ASSET } from 'Actions/media';
|
||||
import AssetProxy from 'ValueObjects/AssetProxy';
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
import { resolvePath } from 'netlify-cms-lib-util';
|
||||
import { currentBackend } from "Backends/backend";
|
||||
import { resolvePath } from 'netlify-cms-lib-util/path';
|
||||
import { currentBackend } from 'Backends/backend';
|
||||
import { getIntegrationProvider } from 'Integrations';
|
||||
import { selectIntegration } from 'Reducers';
|
||||
|
||||
|
@ -1,20 +0,0 @@
|
||||
import localForage from './localForage';
|
||||
import { resolvePath, basename, fileExtensionWithSeparator, fileExtension } from './path';
|
||||
import { filterPromises, resolvePromiseProperties, then } from './promise';
|
||||
import unsentRequest from './unsentRequest';
|
||||
import APIError from './APIError';
|
||||
import EditorialWorkflowError from './EditorialWorkflowError';
|
||||
|
||||
export {
|
||||
localForage,
|
||||
resolvePath,
|
||||
basename,
|
||||
fileExtensionWithSeparator,
|
||||
fileExtension,
|
||||
filterPromises,
|
||||
resolvePromiseProperties,
|
||||
then,
|
||||
unsentRequest,
|
||||
APIError,
|
||||
EditorialWorkflowError,
|
||||
};
|
@ -16,7 +16,7 @@
|
||||
"emotion": "^9.1.3",
|
||||
"lodash": "^4.13.1",
|
||||
"prop-types": "^15.5.10",
|
||||
"react": "15.x || 16.x",
|
||||
"react": "^16.4.1",
|
||||
"react-aria-menubutton": "^5.1.0",
|
||||
"react-emotion": "^9.2.6",
|
||||
"react-toggled": "^1.1.2",
|
||||
|
@ -85,10 +85,11 @@ const Dropdown = ({
|
||||
dropdownWidth = 'auto',
|
||||
dropdownPosition = 'left',
|
||||
dropdownTopOverlap = '0',
|
||||
className,
|
||||
children,
|
||||
}) => {
|
||||
return (
|
||||
<StyledWrapper onSelection={handler => handler()}>
|
||||
<StyledWrapper onSelection={handler => handler()} className={className}>
|
||||
{renderButton()}
|
||||
<Menu>
|
||||
<DropdownList width={dropdownWidth} top={dropdownTopOverlap} position={dropdownPosition}>
|
||||
@ -99,8 +100,8 @@ const Dropdown = ({
|
||||
);
|
||||
};
|
||||
|
||||
const DropdownItem = ({ label, icon, iconDirection, onClick }) => (
|
||||
<StyledMenuItem value={onClick}>
|
||||
const DropdownItem = ({ label, icon, iconDirection, onClick, className }) => (
|
||||
<StyledMenuItem value={onClick} className={className}>
|
||||
<span>{label}</span>
|
||||
{
|
||||
icon
|
||||
|
@ -7,7 +7,7 @@ const IconWrapper = styled.span`
|
||||
line-height: 0;
|
||||
width: ${props => props.size};
|
||||
height: ${props => props.size};
|
||||
transform: ${props => `rotation(${props.rotation})`};
|
||||
transform: ${props => `rotate(${props.rotation})`};
|
||||
|
||||
& path:not(.no-fill),
|
||||
& circle:not(.no-fill),
|
||||
|
Reference in New Issue
Block a user