Skip to content

Commit

Permalink
Simplify Preview and Save draft button styles. (#21192)
Browse files Browse the repository at this point in the history
Co-authored-by: Joen Asmussen <[email protected]>
  • Loading branch information
ZebulanStanphill and Joen Asmussen authored Jun 24, 2020
1 parent bacb520 commit 0f30b6f
Show file tree
Hide file tree
Showing 5 changed files with 22 additions and 20 deletions.
4 changes: 2 additions & 2 deletions packages/block-editor/src/components/preview-options/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import classnames from 'classnames';
*/
import { Button, Dropdown, MenuGroup, MenuItem } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import { Icon, check, chevronDown } from '@wordpress/icons';
import { check } from '@wordpress/icons';

export default function PreviewOptions( {
children,
Expand All @@ -28,13 +28,13 @@ export default function PreviewOptions( {
position="bottom left"
renderToggle={ ( { isOpen, onToggle } ) => (
<Button
isTertiary
onClick={ onToggle }
className="block-editor-post-preview__button-toggle"
aria-expanded={ isOpen }
disabled={ ! isEnabled }
>
{ __( 'Preview' ) }
<Icon icon={ chevronDown } />
</Button>
) }
renderContent={ () => (
Expand Down
14 changes: 0 additions & 14 deletions packages/block-editor/src/components/preview-options/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,6 @@
padding: 0;
}

.block-editor-post-preview__button-toggle {
display: flex;
justify-content: space-between;
padding: 0 $grid-unit-10 0 $grid-unit-15;

&:focus:not(:disabled) {
box-shadow: inset 0 0 0 1px $white, 0 0 0 $border-width-focus var(--wp-admin-theme-color);
}

svg {
margin-left: $grid-unit-05;
}
}

.block-editor-post-preview__button-resize.block-editor-post-preview__button-resize {
padding-left: $button-size-small + $grid-unit-10 + $grid-unit-10;

Expand Down
20 changes: 18 additions & 2 deletions packages/edit-post/src/components/header/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -70,14 +70,30 @@
.editor-post-saved-state,
.components-button.editor-post-switch-to-draft,
.components-button.editor-post-preview,
.components-button.block-editor-post-preview__dropdown {
padding: 0 #{ $grid-unit-15 / 2 };
margin-right: $grid-unit-05;

@include break-small() {
margin-right: $grid-unit-15;
}
}

.components-button.editor-post-save-draft,
.components-button.editor-post-switch-to-draft,
.components-button.editor-post-preview,
.components-button.block-editor-post-preview__button-toggle {
color: $dark-gray-primary;
}

.components-button.block-editor-post-preview__dropdown,
.components-button.editor-post-publish-button,
.components-button.editor-post-publish-panel__toggle {
padding: 0 6px;
padding: 0 #{ $grid-unit-15 / 2 };
margin-right: $grid-unit-05;

@include break-small() {
padding: 0 12px;
padding: 0 $grid-unit-15;
margin-right: $grid-unit-15;
}
}
Expand Down
2 changes: 1 addition & 1 deletion packages/editor/src/components/post-saved-state/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@ export class PostSavedState extends Component {
return null;
}

const label = isPending ? __( 'Save as Pending' ) : __( 'Save Draft' );
const label = isPending ? __( 'Save as pending' ) : __( 'Save draft' );
if ( ! isLargeViewport ) {
return (
<Button
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,6 @@ exports[`PostSavedState should return Save button if edits to be saved 1`] = `
onClick={[Function]}
shortcut="Ctrl+S"
>
Save Draft
Save draft
</ForwardRef(Button)>
`;

0 comments on commit 0f30b6f

Please sign in to comment.