From 2995afd5895bce1588e626f3725a1ad805e33b50 Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Thu, 28 Nov 2024 12:12:43 +0100 Subject: [PATCH 1/8] Add quick edit bulk header --- .../src/components/post-edit-header/index.js | 84 +++++++++++++++++++ .../components/post-edit-header/style.scss | 9 ++ .../src/components/post-edit/index.js | 7 +- packages/edit-site/src/style.scss | 2 + 4 files changed, 98 insertions(+), 4 deletions(-) create mode 100644 packages/edit-site/src/components/post-edit-header/index.js create mode 100644 packages/edit-site/src/components/post-edit-header/style.scss diff --git a/packages/edit-site/src/components/post-edit-header/index.js b/packages/edit-site/src/components/post-edit-header/index.js new file mode 100644 index 00000000000000..ab4569b432273a --- /dev/null +++ b/packages/edit-site/src/components/post-edit-header/index.js @@ -0,0 +1,84 @@ +/** + * WordPress dependencies + */ +import { + __experimentalHStack as HStack, + __experimentalVStack as VStack, + Icon, + __experimentalText as Text, +} from '@wordpress/components'; +import { useMemo } from '@wordpress/element'; +import { + privateApis as editorPrivateApis, + store as editorStore, +} from '@wordpress/editor'; +import { store as coreStore } from '@wordpress/core-data'; +import { useSelect } from '@wordpress/data'; +import { sprintf, __ } from '@wordpress/i18n'; + +/** + * Internal dependencies + */ +import { unlock } from '../../lock-unlock'; + +const { PostCardPanel } = unlock( editorPrivateApis ); + +export default function PostEditHeader( { postType, postId } ) { + const ids = useMemo( () => postId.split( ',' ), [ postId ] ); + const { icon, labels } = useSelect( + ( select ) => { + const { getEditedEntityRecord, getPostType } = select( coreStore ); + const _record = getEditedEntityRecord( + 'postType', + postType, + ids[ 0 ] + ); + + return { + icon: unlock( select( editorStore ) ).getPostIcon( postType, { + area: _record?.area, + } ), + labels: getPostType( postType )?.labels, + }; + }, + [ ids, postType ] + ); + + if ( ids.length === 1 ) { + return ; + } + + return ( + + + + + { labels?.name && + sprintf( + // translators: %i number of selected items %s: Name of the plural post type e.g: "Posts". + __( '%i %s' ), + ids.length, + labels?.name + ) } + + + + { sprintf( + // translators: %s: Name of the plural post type e.g: "Posts". + __( 'Changes will be applied to all selected %s.' ), + labels?.name.toLowerCase() + ) } + + + ); +} diff --git a/packages/edit-site/src/components/post-edit-header/style.scss b/packages/edit-site/src/components/post-edit-header/style.scss new file mode 100644 index 00000000000000..6ddf12983a79c2 --- /dev/null +++ b/packages/edit-site/src/components/post-edit-header/style.scss @@ -0,0 +1,9 @@ +.edit-site-post-edit-header { + .edit-site-post-edit-header__description { + color: $gray-700; + } + + .edit-site-post-edit-header__title { + padding: 2px 0; + } +} diff --git a/packages/edit-site/src/components/post-edit/index.js b/packages/edit-site/src/components/post-edit/index.js index 9a99a987089c1a..a4c8fcc0febbf7 100644 --- a/packages/edit-site/src/components/post-edit/index.js +++ b/packages/edit-site/src/components/post-edit/index.js @@ -18,11 +18,12 @@ import { privateApis as editorPrivateApis } from '@wordpress/editor'; * Internal dependencies */ import Page from '../page'; +import PostEditHeader from '../post-edit-header'; import { unlock } from '../../lock-unlock'; import usePatternSettings from '../page-patterns/use-pattern-settings'; import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; -const { PostCardPanel, usePostFields } = unlock( editorPrivateApis ); +const { usePostFields } = unlock( editorPrivateApis ); const fieldsWithBulkEditSupport = [ 'title', @@ -159,9 +160,7 @@ function PostEditForm( { postType, postId } ) { return ( - { ids.length === 1 && ( - - ) } + Date: Mon, 2 Dec 2024 14:12:24 +0100 Subject: [PATCH 2/8] Updating styling of header --- packages/base-styles/_mixins.scss | 57 +++++++++++-------- .../src/components/post-edit-header/index.js | 7 +-- .../components/post-edit-header/style.scss | 2 +- 3 files changed, 38 insertions(+), 28 deletions(-) diff --git a/packages/base-styles/_mixins.scss b/packages/base-styles/_mixins.scss index 65f98bf6f15bfc..b21e1650f7a7bf 100644 --- a/packages/base-styles/_mixins.scss +++ b/packages/base-styles/_mixins.scss @@ -18,25 +18,25 @@ @mixin heading-small() { @include _text-heading(); font-size: $font-size-x-small; - line-height: $line-height-x-small; + line-height: $font-line-height--x-small; } @mixin heading-medium() { @include _text-heading(); font-size: $font-size-medium; - line-height: $line-height-small; + line-height: $font-line-height-small; } @mixin heading-large() { @include _text-heading(); font-size: $font-size-large; - line-height: $line-height-small; + line-height: $font-line-height-small; } @mixin heading-x-large() { @include _text-heading(); font-size: $font-size-x-large; - line-height: $line-height-medium; + line-height: $font-line-height-medium; } @mixin heading-2x-large() { @@ -48,25 +48,25 @@ @mixin body-small() { @include _text-body(); font-size: $font-size-small; - line-height: $line-height-x-small; + line-height: $font-line-height-x-small; } @mixin body-medium() { @include _text-body(); font-size: $font-size-medium; - line-height: $line-height-small; + line-height: $font-line-height-small; } @mixin body-large() { @include _text-body(); font-size: $font-size-large; - line-height: $line-height-medium; + line-height: $font-line-height-medium; } @mixin body-x-large() { @include _text-body(); font-size: $font-size-x-large; - line-height: $line-height-x-large; + line-height: $font-line-height-x-large; } /** @@ -178,7 +178,8 @@ */ @mixin editor-left($selector) { - #{$selector} { /* Set left position when auto-fold is not on the body element. */ + #{$selector} { + /* Set left position when auto-fold is not on the body element. */ left: 0; @media (min-width: #{ ($break-medium + 1) }) { @@ -186,7 +187,9 @@ } } - .auto-fold #{$selector} { /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */ + .auto-fold #{$selector} { + + /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */ @media (min-width: #{ ($break-medium + 1) }) { left: $admin-sidebar-width-collapsed; } @@ -236,12 +239,12 @@ @mixin reduce-motion($property: "") { - @if $property == "transition" { + @if $property =="transition" { @media (prefers-reduced-motion: reduce) { transition-duration: 0s; transition-delay: 0s; } - } @else if $property == "animation" { + } @else if $property =="animation" { @media (prefers-reduced-motion: reduce) { animation-duration: 1ms; animation-delay: 0s; @@ -265,6 +268,7 @@ font-size: $mobile-text-min-font-size; /* Override core line-height. To be reviewed. */ line-height: normal; + @include break-small { font-size: $default-font-size; /* Override core line-height. To be reviewed. */ @@ -447,6 +451,7 @@ // Fonts smaller than 16px causes mobile safari to zoom. font-size: $mobile-text-min-font-size !important; + @include break-small { font-size: $default-font-size !important; } @@ -464,7 +469,7 @@ * Reset the WP Admin page styles for Gutenberg-like pages. */ -@mixin wp-admin-reset( $content-container ) { +@mixin wp-admin-reset($content-container ) { background: $white; #wpcontent { @@ -515,7 +520,8 @@ // Focus style width. // Avoid rounding issues by showing a whole 2px for 1x screens, and 1.5px on high resolution screens. --wp-admin-border-width-focus: 2px; - @media ( -webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { --wp-admin-border-width-focus: 1.5px; } } @@ -582,32 +588,33 @@ /* stylelint-disable @stylistic/function-comma-space-after -- We can not use spacing because of WP multi site kses rule. */ .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background { - background: linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%); + background: linear-gradient(135deg, rgba(0, 208, 132, 1) 0%, rgba(6, 147, 227, 1) 100%); } .has-purple-crush-gradient-background { - background: linear-gradient(135deg,rgb(52,226,228) 0%,rgb(71,33,251) 50%,rgb(171,29,254) 100%); + background: linear-gradient(135deg, rgb(52, 226, 228) 0%, rgb(71, 33, 251) 50%, rgb(171, 29, 254) 100%); } .has-hazy-dawn-gradient-background { - background: linear-gradient(135deg,rgb(250,172,168) 0%,rgb(218,208,236) 100%); + background: linear-gradient(135deg, rgb(250, 172, 168) 0%, rgb(218, 208, 236) 100%); } .has-subdued-olive-gradient-background { - background: linear-gradient(135deg,rgb(250,250,225) 0%,rgb(103,166,113) 100%); + background: linear-gradient(135deg, rgb(250, 250, 225) 0%, rgb(103, 166, 113) 100%); } .has-atomic-cream-gradient-background { - background: linear-gradient(135deg,rgb(253,215,154) 0%,rgb(0,74,89) 100%); + background: linear-gradient(135deg, rgb(253, 215, 154) 0%, rgb(0, 74, 89) 100%); } .has-nightshade-gradient-background { - background: linear-gradient(135deg,rgb(51,9,104) 0%,rgb(49,205,207) 100%); + background: linear-gradient(135deg, rgb(51, 9, 104) 0%, rgb(49, 205, 207) 100%); } .has-midnight-gradient-background { - background: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%); + background: linear-gradient(135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%); } + /* stylelint-enable @stylistic/function-comma-space-after */ } @@ -618,16 +625,20 @@ width: 12px; height: 12px; } + &::-webkit-scrollbar-track { background-color: transparent; } + &::-webkit-scrollbar-thumb { background-color: $handle-color; border-radius: 8px; border: 3px solid transparent; background-clip: padding-box; } - &:hover::-webkit-scrollbar-thumb, // This needs specificity. + + &:hover::-webkit-scrollbar-thumb, + // This needs specificity. &:focus::-webkit-scrollbar-thumb, &:focus-within::-webkit-scrollbar-thumb { background-color: $handle-color-hover; @@ -659,7 +670,7 @@ outline-color: var(--wp-admin-theme-color); outline-style: solid; outline-width: calc(#{$widthRatio} * (var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1))); - outline-offset: calc(#{$widthRatio} * ((-1 * var(--wp-admin-border-width-focus) ) / var(--wp-block-editor-iframe-zoom-out-scale, 1))); + outline-offset: calc(#{$widthRatio} * ((-1 * var(--wp-admin-border-width-focus)) / var(--wp-block-editor-iframe-zoom-out-scale, 1))); } @mixin selected-block-focus($widthRatio: 1) { diff --git a/packages/edit-site/src/components/post-edit-header/index.js b/packages/edit-site/src/components/post-edit-header/index.js index ab4569b432273a..582344a933b503 100644 --- a/packages/edit-site/src/components/post-edit-header/index.js +++ b/packages/edit-site/src/components/post-edit-header/index.js @@ -28,6 +28,7 @@ export default function PostEditHeader( { postType, postId } ) { const { icon, labels } = useSelect( ( select ) => { const { getEditedEntityRecord, getPostType } = select( coreStore ); + const { getPostIcon } = unlock( select( editorStore ) ); const _record = getEditedEntityRecord( 'postType', postType, @@ -35,7 +36,7 @@ export default function PostEditHeader( { postType, postId } ) { ); return { - icon: unlock( select( editorStore ) ).getPostIcon( postType, { + icon: getPostIcon( postType, { area: _record?.area, } ), labels: getPostType( postType )?.labels, @@ -50,7 +51,7 @@ export default function PostEditHeader( { postType, postId } ) { return ( - + { labels?.name && sprintf( diff --git a/packages/edit-site/src/components/post-edit-header/style.scss b/packages/edit-site/src/components/post-edit-header/style.scss index 6ddf12983a79c2..f34616cc615474 100644 --- a/packages/edit-site/src/components/post-edit-header/style.scss +++ b/packages/edit-site/src/components/post-edit-header/style.scss @@ -4,6 +4,6 @@ } .edit-site-post-edit-header__title { - padding: 2px 0; + @include heading-medium(); } } From 6a69d9f8c7623e66efdbd5d30c6b88137a94294e Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Mon, 2 Dec 2024 14:14:44 +0100 Subject: [PATCH 3/8] Moved header to post-edit folder --- .../src/components/post-edit-header/style.scss | 9 --------- .../{post-edit-header/index.js => post-edit/header.js} | 0 packages/edit-site/src/components/post-edit/index.js | 2 +- packages/edit-site/src/components/post-edit/style.scss | 10 ++++++++++ packages/edit-site/src/style.scss | 1 - 5 files changed, 11 insertions(+), 11 deletions(-) delete mode 100644 packages/edit-site/src/components/post-edit-header/style.scss rename packages/edit-site/src/components/{post-edit-header/index.js => post-edit/header.js} (100%) diff --git a/packages/edit-site/src/components/post-edit-header/style.scss b/packages/edit-site/src/components/post-edit-header/style.scss deleted file mode 100644 index f34616cc615474..00000000000000 --- a/packages/edit-site/src/components/post-edit-header/style.scss +++ /dev/null @@ -1,9 +0,0 @@ -.edit-site-post-edit-header { - .edit-site-post-edit-header__description { - color: $gray-700; - } - - .edit-site-post-edit-header__title { - @include heading-medium(); - } -} diff --git a/packages/edit-site/src/components/post-edit-header/index.js b/packages/edit-site/src/components/post-edit/header.js similarity index 100% rename from packages/edit-site/src/components/post-edit-header/index.js rename to packages/edit-site/src/components/post-edit/header.js diff --git a/packages/edit-site/src/components/post-edit/index.js b/packages/edit-site/src/components/post-edit/index.js index a4c8fcc0febbf7..51f06bd734493e 100644 --- a/packages/edit-site/src/components/post-edit/index.js +++ b/packages/edit-site/src/components/post-edit/index.js @@ -18,7 +18,7 @@ import { privateApis as editorPrivateApis } from '@wordpress/editor'; * Internal dependencies */ import Page from '../page'; -import PostEditHeader from '../post-edit-header'; +import PostEditHeader from '../post-edit/header'; import { unlock } from '../../lock-unlock'; import usePatternSettings from '../page-patterns/use-pattern-settings'; import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor'; diff --git a/packages/edit-site/src/components/post-edit/style.scss b/packages/edit-site/src/components/post-edit/style.scss index 5688d83df00c5f..5a20183c8f0210 100644 --- a/packages/edit-site/src/components/post-edit/style.scss +++ b/packages/edit-site/src/components/post-edit/style.scss @@ -14,3 +14,13 @@ padding-top: $grid-unit-20; } } + +.edit-site-post-edit-header { + .edit-site-post-edit-header__description { + color: $gray-700; + } + + .edit-site-post-edit-header__title { + @include heading-medium(); + } +} diff --git a/packages/edit-site/src/style.scss b/packages/edit-site/src/style.scss index 4151b28bba3c05..4269cdb4bc90d1 100644 --- a/packages/edit-site/src/style.scss +++ b/packages/edit-site/src/style.scss @@ -28,7 +28,6 @@ @import "./components/style-book/style.scss"; @import "./components/editor-canvas-container/style.scss"; @import "./components/post-edit/style.scss"; -@import "./components/post-edit-header/style.scss"; @import "./components/post-list/style.scss"; @import "./components/resizable-frame/style.scss"; @import "./hooks/push-changes-to-global-styles/style.scss"; From 1bdc3797ac54120c5fcd75de58acf9c2a57223cd Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Wed, 4 Dec 2024 15:00:24 +0100 Subject: [PATCH 4/8] Make use of mixin for the post title --- packages/editor/src/components/post-card-panel/index.js | 2 -- packages/editor/src/components/post-card-panel/style.scss | 1 + 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/editor/src/components/post-card-panel/index.js b/packages/editor/src/components/post-card-panel/index.js index 8fcca6c6bd6d40..c8264a30d97231 100644 --- a/packages/editor/src/components/post-card-panel/index.js +++ b/packages/editor/src/components/post-card-panel/index.js @@ -78,9 +78,7 @@ export default function PostCardPanel( { numberOfLines={ 2 } truncate className="editor-post-card-panel__title" - weight={ 500 } as="h2" - lineHeight="20px" > { title ? decodeEntities( title ) : __( 'No title' ) } { pageTypeBadge && ( diff --git a/packages/editor/src/components/post-card-panel/style.scss b/packages/editor/src/components/post-card-panel/style.scss index d8a2a4628e6f9c..d9ecfc58304e85 100644 --- a/packages/editor/src/components/post-card-panel/style.scss +++ b/packages/editor/src/components/post-card-panel/style.scss @@ -7,6 +7,7 @@ width: 100%; &.editor-post-card-panel__title { + @include heading-medium(); margin: 0; padding: 2px 0; display: flex; From 031625daf87961b261c9d7083f535611f09bca8a Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Wed, 4 Dec 2024 15:24:05 +0100 Subject: [PATCH 5/8] Pass postId to the pageTypeBadge hook, for use outside editor --- packages/editor/src/components/document-bar/index.js | 4 +++- .../editor/src/components/post-card-panel/index.js | 2 +- packages/editor/src/utils/pageTypeBadge.js | 11 +++-------- 3 files changed, 7 insertions(+), 10 deletions(-) diff --git a/packages/editor/src/components/document-bar/index.js b/packages/editor/src/components/document-bar/index.js index 7b94a6fbeb3be9..f5ca65dfe18ed7 100644 --- a/packages/editor/src/components/document-bar/index.js +++ b/packages/editor/src/components/document-bar/index.js @@ -54,6 +54,7 @@ const MotionButton = motion( Button ); */ export default function DocumentBar( props ) { const { + postId, postType, postTypeLabel, documentTitle, @@ -93,6 +94,7 @@ export default function DocumentBar( props ) { const _postTypeLabel = getPostType( _postType )?.labels?.singular_name; return { + postId: _postId, postType: _postType, postTypeLabel: _postTypeLabel, documentTitle: _document.title, @@ -120,7 +122,7 @@ export default function DocumentBar( props ) { const title = props.title || entityTitle; const icon = props.icon; - const pageTypeBadge = usePageTypeBadge(); + const pageTypeBadge = usePageTypeBadge( postId ); const mountedRef = useRef( false ); useEffect( () => { diff --git a/packages/editor/src/components/post-card-panel/index.js b/packages/editor/src/components/post-card-panel/index.js index c8264a30d97231..f6f5c3deca9f52 100644 --- a/packages/editor/src/components/post-card-panel/index.js +++ b/packages/editor/src/components/post-card-panel/index.js @@ -64,7 +64,7 @@ export default function PostCardPanel( { [ postId, postType ] ); - const pageTypeBadge = usePageTypeBadge(); + const pageTypeBadge = usePageTypeBadge( parseInt( postId, 10 ) ); return (
diff --git a/packages/editor/src/utils/pageTypeBadge.js b/packages/editor/src/utils/pageTypeBadge.js index 321b9caa17769e..bc787b12284222 100644 --- a/packages/editor/src/utils/pageTypeBadge.js +++ b/packages/editor/src/utils/pageTypeBadge.js @@ -5,19 +5,14 @@ import { __ } from '@wordpress/i18n'; import { useSelect } from '@wordpress/data'; import { store as coreStore } from '@wordpress/core-data'; -/** - * Internal dependencies - */ -import { store as editorStore } from '../store'; - /** * Custom hook to get the page type badge for the current post on edit site view. + * + * @param {number} postId postId of the current post being edited. */ -export default function usePageTypeBadge() { +export default function usePageTypeBadge( postId ) { const { isFrontPage, isPostsPage } = useSelect( ( select ) => { - const { getCurrentPostId } = select( editorStore ); const { canUser, getEditedEntityRecord } = select( coreStore ); - const postId = getCurrentPostId(); const siteSettings = canUser( 'read', { kind: 'root', name: 'site', From a0c5fa9d754bd7772d86c1dbecaea52e3fffb71c Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Wed, 4 Dec 2024 15:38:26 +0100 Subject: [PATCH 6/8] Fix formatting issues --- packages/base-styles/_mixins.scss | 43 ++++++++++++------------------- 1 file changed, 16 insertions(+), 27 deletions(-) diff --git a/packages/base-styles/_mixins.scss b/packages/base-styles/_mixins.scss index b21e1650f7a7bf..e2f953e5787814 100644 --- a/packages/base-styles/_mixins.scss +++ b/packages/base-styles/_mixins.scss @@ -18,7 +18,7 @@ @mixin heading-small() { @include _text-heading(); font-size: $font-size-x-small; - line-height: $font-line-height--x-small; + line-height: $font-line-height-x-small; } @mixin heading-medium() { @@ -178,8 +178,7 @@ */ @mixin editor-left($selector) { - #{$selector} { - /* Set left position when auto-fold is not on the body element. */ + #{$selector} { /* Set left position when auto-fold is not on the body element. */ left: 0; @media (min-width: #{ ($break-medium + 1) }) { @@ -187,9 +186,7 @@ } } - .auto-fold #{$selector} { - - /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */ + .auto-fold #{$selector} { /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */ @media (min-width: #{ ($break-medium + 1) }) { left: $admin-sidebar-width-collapsed; } @@ -239,12 +236,12 @@ @mixin reduce-motion($property: "") { - @if $property =="transition" { + @if $property == "transition" { @media (prefers-reduced-motion: reduce) { transition-duration: 0s; transition-delay: 0s; } - } @else if $property =="animation" { + } @else if $property == "animation" { @media (prefers-reduced-motion: reduce) { animation-duration: 1ms; animation-delay: 0s; @@ -268,7 +265,6 @@ font-size: $mobile-text-min-font-size; /* Override core line-height. To be reviewed. */ line-height: normal; - @include break-small { font-size: $default-font-size; /* Override core line-height. To be reviewed. */ @@ -451,7 +447,6 @@ // Fonts smaller than 16px causes mobile safari to zoom. font-size: $mobile-text-min-font-size !important; - @include break-small { font-size: $default-font-size !important; } @@ -469,7 +464,7 @@ * Reset the WP Admin page styles for Gutenberg-like pages. */ -@mixin wp-admin-reset($content-container ) { +@mixin wp-admin-reset( $content-container ) { background: $white; #wpcontent { @@ -520,8 +515,7 @@ // Focus style width. // Avoid rounding issues by showing a whole 2px for 1x screens, and 1.5px on high resolution screens. --wp-admin-border-width-focus: 2px; - - @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + @media ( -webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { --wp-admin-border-width-focus: 1.5px; } } @@ -588,33 +582,32 @@ /* stylelint-disable @stylistic/function-comma-space-after -- We can not use spacing because of WP multi site kses rule. */ .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background { - background: linear-gradient(135deg, rgba(0, 208, 132, 1) 0%, rgba(6, 147, 227, 1) 100%); + background: linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%); } .has-purple-crush-gradient-background { - background: linear-gradient(135deg, rgb(52, 226, 228) 0%, rgb(71, 33, 251) 50%, rgb(171, 29, 254) 100%); + background: linear-gradient(135deg,rgb(52,226,228) 0%,rgb(71,33,251) 50%,rgb(171,29,254) 100%); } .has-hazy-dawn-gradient-background { - background: linear-gradient(135deg, rgb(250, 172, 168) 0%, rgb(218, 208, 236) 100%); + background: linear-gradient(135deg,rgb(250,172,168) 0%,rgb(218,208,236) 100%); } .has-subdued-olive-gradient-background { - background: linear-gradient(135deg, rgb(250, 250, 225) 0%, rgb(103, 166, 113) 100%); + background: linear-gradient(135deg,rgb(250,250,225) 0%,rgb(103,166,113) 100%); } .has-atomic-cream-gradient-background { - background: linear-gradient(135deg, rgb(253, 215, 154) 0%, rgb(0, 74, 89) 100%); + background: linear-gradient(135deg,rgb(253,215,154) 0%,rgb(0,74,89) 100%); } .has-nightshade-gradient-background { - background: linear-gradient(135deg, rgb(51, 9, 104) 0%, rgb(49, 205, 207) 100%); + background: linear-gradient(135deg,rgb(51,9,104) 0%,rgb(49,205,207) 100%); } .has-midnight-gradient-background { - background: linear-gradient(135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%); + background: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%); } - /* stylelint-enable @stylistic/function-comma-space-after */ } @@ -625,20 +618,16 @@ width: 12px; height: 12px; } - &::-webkit-scrollbar-track { background-color: transparent; } - &::-webkit-scrollbar-thumb { background-color: $handle-color; border-radius: 8px; border: 3px solid transparent; background-clip: padding-box; } - - &:hover::-webkit-scrollbar-thumb, - // This needs specificity. + &:hover::-webkit-scrollbar-thumb, // This needs specificity. &:focus::-webkit-scrollbar-thumb, &:focus-within::-webkit-scrollbar-thumb { background-color: $handle-color-hover; @@ -670,7 +659,7 @@ outline-color: var(--wp-admin-theme-color); outline-style: solid; outline-width: calc(#{$widthRatio} * (var(--wp-admin-border-width-focus) / var(--wp-block-editor-iframe-zoom-out-scale, 1))); - outline-offset: calc(#{$widthRatio} * ((-1 * var(--wp-admin-border-width-focus)) / var(--wp-block-editor-iframe-zoom-out-scale, 1))); + outline-offset: calc(#{$widthRatio} * ((-1 * var(--wp-admin-border-width-focus) ) / var(--wp-block-editor-iframe-zoom-out-scale, 1))); } @mixin selected-block-focus($widthRatio: 1) { From 5e2d674c986aaf2109ed455f38927d17124641ba Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Thu, 5 Dec 2024 12:23:16 +0100 Subject: [PATCH 7/8] Move parseInt up --- packages/edit-site/src/components/post-edit/header.js | 7 ++++++- packages/editor/src/components/post-card-panel/index.js | 2 +- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/edit-site/src/components/post-edit/header.js b/packages/edit-site/src/components/post-edit/header.js index 582344a933b503..305589d0cc22bf 100644 --- a/packages/edit-site/src/components/post-edit/header.js +++ b/packages/edit-site/src/components/post-edit/header.js @@ -46,7 +46,12 @@ export default function PostEditHeader( { postType, postId } ) { ); if ( ids.length === 1 ) { - return ; + return ( + + ); } return ( diff --git a/packages/editor/src/components/post-card-panel/index.js b/packages/editor/src/components/post-card-panel/index.js index f6f5c3deca9f52..e347d3c79fc521 100644 --- a/packages/editor/src/components/post-card-panel/index.js +++ b/packages/editor/src/components/post-card-panel/index.js @@ -64,7 +64,7 @@ export default function PostCardPanel( { [ postId, postType ] ); - const pageTypeBadge = usePageTypeBadge( parseInt( postId, 10 ) ); + const pageTypeBadge = usePageTypeBadge( postId ); return (
From 58e34e78eee222768bb5fc3d23c886302f380df9 Mon Sep 17 00:00:00 2001 From: Lourens Schep Date: Thu, 5 Dec 2024 12:45:36 +0100 Subject: [PATCH 8/8] Remove title field --- packages/edit-site/src/components/post-edit/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/edit-site/src/components/post-edit/index.js b/packages/edit-site/src/components/post-edit/index.js index 51f06bd734493e..b3954e4ddbdeaf 100644 --- a/packages/edit-site/src/components/post-edit/index.js +++ b/packages/edit-site/src/components/post-edit/index.js @@ -77,7 +77,6 @@ function PostEditForm( { postType, postId } ) { id: 'featured_media', layout: 'regular', }, - 'title', { id: 'status', label: __( 'Status & Visibility' ),