From 7f5a176da030a5d129d7b7d8e4af64ed04f25576 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sat, 21 Dec 2024 10:36:59 +0900 Subject: [PATCH 01/23] up --- includes/block-library/index.php | 1 + .../table-of-contents/block.json | 63 +++++++++ src/block-library/table-of-contents/edit.js | 106 +++++++++++++++ src/block-library/table-of-contents/index.js | 21 +++ src/block-library/table-of-contents/index.php | 69 ++++++++++ .../table-of-contents/style.scss | 91 +++++++++++++ src/block-library/table-of-contents/view.js | 127 ++++++++++++++++++ 7 files changed, 478 insertions(+) create mode 100644 src/block-library/table-of-contents/block.json create mode 100644 src/block-library/table-of-contents/edit.js create mode 100644 src/block-library/table-of-contents/index.js create mode 100644 src/block-library/table-of-contents/index.php create mode 100644 src/block-library/table-of-contents/style.scss create mode 100644 src/block-library/table-of-contents/view.js diff --git a/includes/block-library/index.php b/includes/block-library/index.php index 81f0e17..8b4380b 100644 --- a/includes/block-library/index.php +++ b/includes/block-library/index.php @@ -37,6 +37,7 @@ function get_blocks() { 'mega-menu', 'styles-switcher', 'styles-switcher-item', + 'table-of-contents', 'user-icon', ); } diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json new file mode 100644 index 0000000..9604db5 --- /dev/null +++ b/src/block-library/table-of-contents/block.json @@ -0,0 +1,63 @@ +{ + "apiVersion": 3, + "name": "mone/table-of-contents", + "category": "mone-block-cat", + "title": "Table of contents", + "description": "Table of contents", + "textdomain": "mone", + "attributes": { + "title": { + "type": "string" + }, + "maxHeight": { + "type": "string" + } + }, + "supports": { + "color": { + "gradients": true, + "link": false, + "__experimentalDefaultControls": { + "background": true, + "text": true + } + }, + "spacing": { + "margin": true, + "padding": true + }, + "typography": { + "fontSize": true, + "lineHeight": true, + "__experimentalFontFamily": true, + "__experimentalFontWeight": true, + "__experimentalFontStyle": true, + "__experimentalTextTransform": true, + "__experimentalTextDecoration": true, + "__experimentalLetterSpacing": true, + "__experimentalDefaultControls": { + "fontSize": true + } + }, + "__experimentalBorder": { + "color": true, + "radius": true, + "width": true, + "style": true, + "__experimentalDefaultControls": { + "color": true, + "radius": true, + "width": true, + "style": true + } + }, + "shadow": true, + "interactivity": true, + "html": false + }, + "editorScript": "file:./index.js", + "editorStyle": "file:./style.css", + "render": "file:./render.php", + "viewScriptModule": "file:./view.js", + "style": "file:./style-index.css" +} \ No newline at end of file diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js new file mode 100644 index 0000000..5701237 --- /dev/null +++ b/src/block-library/table-of-contents/edit.js @@ -0,0 +1,106 @@ +import clsx from 'clsx'; + +/** + * WordPress dependencies + */ +import { __ } from '@wordpress/i18n'; +import { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components'; +import { + InspectorControls, + useBlockProps, + HeightControl, +} from '@wordpress/block-editor'; + +export default function TableOfContentEdit( props ) { + const { attributes, setAttributes, clientId } = props; + const { maxHeight } = attributes; + + const blockProps = useBlockProps( { + className: clsx( 'mone-mega-menu' ), + } ); + + return ( + <> + + maxHeight !== undefined } + label={ __( 'Max height', 'mone' ) } + onDeselect={ () => + setAttributes( { maxHeight: undefined } ) + } + isShownByDefault={ true } + panelId={ clientId } + > + + setAttributes( { maxHeight: value } ) + } + /> + + +
+
    +
  1. + + 目次エディター プレビュー H2見出し + +
      +
    1. + + 目次エディター プレビュー H3見出し + +
      2. +
    2. + + 目次エディター プレビュー H3見出し + +
      3. +
    +
    2. +
  2. + + 目次エディター プレビュー H2見出し + +
      +
    1. + + 目次エディター プレビュー H3見出し + +
        +
      1. + + 目次エディター プレビュー H4見出し + +
          +
        1. + + 目次エディター プレビュー + H5見出し + +
          2. +
        +
        2. +
      +
      2. +
    +
    3. +
  3. + + 目次エディター プレビュー H2見出し + +
      +
    1. + + 目次エディター プレビュー H3見出し + +
      2. +
    +
    4. +
+
+ + ); +} + \ No newline at end of file diff --git a/src/block-library/table-of-contents/index.js b/src/block-library/table-of-contents/index.js new file mode 100644 index 0000000..d03b17a --- /dev/null +++ b/src/block-library/table-of-contents/index.js @@ -0,0 +1,21 @@ +/** + * WordPress dependencies + */ +import { registerBlockType } from '@wordpress/blocks'; + +/** + * block type + */ +import { blockCategoryIcon as icon } from '../../icons'; +import metadata from './block.json'; +import edit from './edit'; +import './style.scss'; + +const { name } = metadata; + +export { metadata, name }; + +registerBlockType( name, { + icon, + edit, +} ); diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php new file mode 100644 index 0000000..a38370f --- /dev/null +++ b/src/block-library/table-of-contents/index.php @@ -0,0 +1,69 @@ + implode( ' ', $classes ), + 'style' => $style_attribute, + ) + ); + return sprintf( + '
', + $wrapper_attributes + ); +} + + +/** + * Register block + * + * @return void + */ +function register_block_table_of_contents() { + register_block_type( + __DIR__, + array( + 'render_callback' => __NAMESPACE__ . '\table_of_contents_render_callback', + ) + ); +} +add_action( 'init', __NAMESPACE__ . '\register_block_table_of_contents' ); \ No newline at end of file diff --git a/src/block-library/table-of-contents/style.scss b/src/block-library/table-of-contents/style.scss new file mode 100644 index 0000000..9f0459e --- /dev/null +++ b/src/block-library/table-of-contents/style.scss @@ -0,0 +1,91 @@ +.wp-block-mone-table-of-contents { + overflow-y: auto; + max-height: var(--the-max-height); + + ol { + padding: 0; + list-style: none; + position: relative; + a { + color: var(--wp--preset--color--content-contrast-2); + text-decoration: none; + margin: 8px 0; + display: block; + line-height: 1.5; + } + } + + .ol-depth-1 { + padding-left: 21px; + margin: 0; + + >li a{ + font-weight: 500; + font-size: var(--wp--preset--font-size--medium); + } + + ol li a { + font-weight: 400; + font-size: var(--wp--preset--font-size--small); + } + } + + .ol-depth-1:before { + position: absolute; + top: 17px; + bottom: 8px; + left: 7px; + width: 2px; + content: ""; + background: var(--wp--preset--color--heading-bg); + } + + .ol-depth-1>li { + position: relative; + } + + .ol-depth-1>li.active:before, + .ol-depth-2>li.active:before, + .ol-depth-3>li.active:before, + .ol-depth-4>li.active:before, + .ol-depth-5>li.active:before, + .ol-depth-6>li.active:before { + background: var(--wp--preset--color--key-2); + transition: background-color 0.3s ease-in-out; + } + + .active { + > a { + color: var(--wp--preset--color--content-contrast); + transition: color 0.3s ease-in-out; + } + } + + li { + position: relative; + } + + li:before { + top: 6px; + background: #d9eafb; + position: absolute; + content: ""; + border-radius: 100%; + } + + .ol-depth-1>li:before { + width: 12px; + height: 12px; + left: -19px; + } + + .ol-depth-2>li:before, + .ol-depth-3>li:before, + .ol-depth-4>li:before, + .ol-depth-5>li:before, + .ol-depth-6>li:before { + left: -17px; + width: 8px; + height: 8px; + } +} \ No newline at end of file diff --git a/src/block-library/table-of-contents/view.js b/src/block-library/table-of-contents/view.js new file mode 100644 index 0000000..780dce5 --- /dev/null +++ b/src/block-library/table-of-contents/view.js @@ -0,0 +1,127 @@ +document.addEventListener( 'DOMContentLoaded', () => { + const entryContent = document.querySelector( '.entry-content' ); + if ( ! entryContent ) return console.log( 'entry-content not found' ); + + const tocContainers = document.querySelectorAll( + '.wp-block-mone-table-of-contents' + ); + if ( tocContainers.length === 0 ) + return console.log( 'wp-block-mone-table-of-contents not found' ); + + const headings = entryContent.querySelectorAll( 'h2, h3, h4, h5, h6' ); + if ( headings.length === 0 ) return console.log( 'No headings found' ); + + const idMap = new Map(); + + headings.forEach( ( heading ) => { + let id = + heading.id || + heading.textContent.trim().toLowerCase().replace( /\s+/g, '-' ); + if ( ! heading.id ) { + idMap.set( id, ( idMap.get( id ) || 0 ) + 1 ); + if ( idMap.get( id ) > 1 ) { + id += `-${ idMap.get( id ) }`; + } + heading.id = id; + } + } ); + + tocContainers.forEach( ( tocContainer ) => { + const tocList = document.createElement( 'ol' ); + tocList.classList.add( 'ol-depth-1' ); + let currentLevel = parseInt( headings[ 0 ].tagName.substring( 1 ) ); // 最初の見出しのレベルに設定 + let currentList = tocList; + const listStack = [ tocList ]; + + headings.forEach( ( heading ) => { + const level = parseInt( heading.tagName.substring( 1 ) ); + const listItem = document.createElement( 'li' ); + const link = document.createElement( 'a' ); + link.href = `#${ heading.id }`; + link.textContent = heading.textContent; + listItem.appendChild( link ); + + if ( level > currentLevel ) { + const newList = document.createElement( 'ol' ); + newList.classList.add( `ol-depth-${ level }` ); // 修正: level - 1 から level に変更 + if ( listStack[ listStack.length - 1 ].lastElementChild ) { + listStack[ + listStack.length - 1 + ].lastElementChild.appendChild( newList ); + } else { + listStack[ listStack.length - 1 ].appendChild( newList ); + } + listStack.push( newList ); + currentList = newList; + } else { + while ( level < currentLevel && listStack.length > 1 ) { + listStack.pop(); + currentList = listStack[ listStack.length - 1 ]; + currentLevel--; + } + } + + if ( currentList ) { + currentList.appendChild( listItem ); + } + currentLevel = level; + } ); + + tocContainer.appendChild( tocList ); + console.log( 'Table of contents generated' ); + } ); + + window.addEventListener( 'scroll', () => { + let currentHeading = null; + const offset = + parseFloat( + getComputedStyle( document.documentElement ).getPropertyValue( + '--wp--style--block-gap' + ) + ) * + 16 + + 1.2 * 16; + + headings.forEach( ( heading, index ) => { + const nextHeading = headings[ index + 1 ]; + const rect = heading.getBoundingClientRect(); + const nextRect = nextHeading + ? nextHeading.getBoundingClientRect() + : { top: Infinity }; + if ( rect.top <= offset && nextRect.top > offset ) + currentHeading = heading; + } ); + + tocContainers.forEach( ( tocContainer ) => { + const links = tocContainer.querySelectorAll( 'a' ); + let activeFound = false; + links.forEach( ( link ) => { + const listItem = link.parentElement; + listItem.classList.remove( 'active' ); + if ( listItem.classList.length === 0 ) { + listItem.removeAttribute( 'class' ); + } + if ( + currentHeading && + link.getAttribute( 'href' ) === `#${ currentHeading.id }` + ) { + listItem.classList.add( 'active' ); + activeFound = true; + if ( + tocContainer.classList.contains( 'sidebar' ) && + tocContainer.classList.contains( 'has-max-height' ) && + window.innerWidth >= 781 + ) { + // listItem.scrollIntoView( { + // behavior: 'smooth', + // block: 'nearest', + // } ); + } + } + } ); + if ( ! activeFound && links.length > 0 ) { + links[ 0 ].parentElement.classList.add( 'active' ); + } + } ); + } ); +} ); \ No newline at end of file From e1b7f63e52b02173c1215529396b4ef458271453 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sat, 21 Dec 2024 11:02:45 +0900 Subject: [PATCH 02/23] format --- src/block-library/table-of-contents/block.json | 2 +- src/block-library/table-of-contents/edit.js | 1 - src/block-library/table-of-contents/view.js | 16 +++++++++++----- 3 files changed, 12 insertions(+), 7 deletions(-) diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json index 9604db5..d952c33 100644 --- a/src/block-library/table-of-contents/block.json +++ b/src/block-library/table-of-contents/block.json @@ -60,4 +60,4 @@ "render": "file:./render.php", "viewScriptModule": "file:./view.js", "style": "file:./style-index.css" -} \ No newline at end of file +} diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 5701237..551bc32 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -103,4 +103,3 @@ export default function TableOfContentEdit( props ) { ); } - \ No newline at end of file diff --git a/src/block-library/table-of-contents/view.js b/src/block-library/table-of-contents/view.js index 780dce5..0507e0d 100644 --- a/src/block-library/table-of-contents/view.js +++ b/src/block-library/table-of-contents/view.js @@ -1,15 +1,20 @@ document.addEventListener( 'DOMContentLoaded', () => { const entryContent = document.querySelector( '.entry-content' ); - if ( ! entryContent ) return console.log( 'entry-content not found' ); + if ( ! entryContent ) { + return console.log( 'entry-content not found' ); + } const tocContainers = document.querySelectorAll( '.wp-block-mone-table-of-contents' ); - if ( tocContainers.length === 0 ) + if ( tocContainers.length === 0 ) { return console.log( 'wp-block-mone-table-of-contents not found' ); + } const headings = entryContent.querySelectorAll( 'h2, h3, h4, h5, h6' ); - if ( headings.length === 0 ) return console.log( 'No headings found' ); + if ( headings.length === 0 ) { + return console.log( 'No headings found' ); + } const idMap = new Map(); @@ -88,8 +93,9 @@ document.addEventListener( 'DOMContentLoaded', () => { const nextRect = nextHeading ? nextHeading.getBoundingClientRect() : { top: Infinity }; - if ( rect.top <= offset && nextRect.top > offset ) + if ( rect.top <= offset && nextRect.top > offset ) { currentHeading = heading; + } } ); tocContainers.forEach( ( tocContainer ) => { @@ -124,4 +130,4 @@ document.addEventListener( 'DOMContentLoaded', () => { } } ); } ); -} ); \ No newline at end of file +} ); From cfb28b43ae71b893027be02a56c67f820f425fb6 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sat, 21 Dec 2024 15:37:24 +0900 Subject: [PATCH 03/23] up --- .../table-of-contents/block.json | 2 +- src/block-library/table-of-contents/edit.js | 66 +++++++-- src/block-library/table-of-contents/view.js | 133 ------------------ .../table-of-contents/view/index.js | 29 ++++ .../table-of-contents/view/scroll.js | 59 ++++++++ .../table-of-contents/view/toc.js | 103 ++++++++++++++ src/utils/style.scss | 4 + 7 files changed, 247 insertions(+), 149 deletions(-) delete mode 100644 src/block-library/table-of-contents/view.js create mode 100644 src/block-library/table-of-contents/view/index.js create mode 100644 src/block-library/table-of-contents/view/scroll.js create mode 100644 src/block-library/table-of-contents/view/toc.js diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json index d952c33..c609523 100644 --- a/src/block-library/table-of-contents/block.json +++ b/src/block-library/table-of-contents/block.json @@ -58,6 +58,6 @@ "editorScript": "file:./index.js", "editorStyle": "file:./style.css", "render": "file:./render.php", - "viewScriptModule": "file:./view.js", + "viewScriptModule": "file:./view/index.js", "style": "file:./style-index.css" } diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 551bc32..2b87242 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -1,8 +1,5 @@ import clsx from 'clsx'; -/** - * WordPress dependencies - */ import { __ } from '@wordpress/i18n'; import { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components'; import { @@ -13,10 +10,23 @@ import { export default function TableOfContentEdit( props ) { const { attributes, setAttributes, clientId } = props; - const { maxHeight } = attributes; + const { maxHeight} = attributes; + + const paddingTop = attributes.style?.spacing?.padding?.top || '0'; + const paddingBottom = attributes.style?.spacing?.padding?.bottom || '0'; + + let maxHeightVar = ''; + if ( maxHeight ) { + maxHeightVar += `calc(${ maxHeight } - ${ paddingTop } - ${ paddingBottom })`; + } const blockProps = useBlockProps( { - className: clsx( 'mone-mega-menu' ), + className: clsx( { + [ `has-max-height` ]: maxHeight, + } ), + style: { + '--the-max-height': maxHeightVar, + }, } ); return ( @@ -44,40 +54,60 @@ export default function TableOfContentEdit( props ) {
  1. - 目次エディター プレビュー H2見出し + { __( + '目次エディター プレビュー H2見出し', + 'text-domain' + ) }
    1. - 目次エディター プレビュー H3見出し + { __( + '目次エディター プレビュー H3見出し', + 'text-domain' + ) }
    2. - 目次エディター プレビュー H3見出し + { __( + '目次エディター プレビュー H3見出し', + 'text-domain' + ) }
  2. - 目次エディター プレビュー H2見出し + { __( + '目次エディター プレビュー H2見出し', + 'text-domain' + ) }
    1. - 目次エディター プレビュー H3見出し + { __( + '目次エディター プレビュー H3見出し', + 'text-domain' + ) }
      1. - 目次エディター プレビュー H4見出し + { __( + '目次エディター プレビュー H4見出し', + 'text-domain' + ) }
        1. - 目次エディター プレビュー - H5見出し + { __( + '目次エディター プレビュー H5見出し', + 'text-domain' + ) }
        @@ -88,12 +118,18 @@ export default function TableOfContentEdit( props ) {
      2. - 目次エディター プレビュー H2見出し + { __( + '目次エディター プレビュー H2見出し', + 'text-domain' + ) }
        1. - 目次エディター プレビュー H3見出し + { __( + '目次エディター プレビュー H3見出し', + 'text-domain' + ) }
        diff --git a/src/block-library/table-of-contents/view.js b/src/block-library/table-of-contents/view.js deleted file mode 100644 index 0507e0d..0000000 --- a/src/block-library/table-of-contents/view.js +++ /dev/null @@ -1,133 +0,0 @@ -document.addEventListener( 'DOMContentLoaded', () => { - const entryContent = document.querySelector( '.entry-content' ); - if ( ! entryContent ) { - return console.log( 'entry-content not found' ); - } - - const tocContainers = document.querySelectorAll( - '.wp-block-mone-table-of-contents' - ); - if ( tocContainers.length === 0 ) { - return console.log( 'wp-block-mone-table-of-contents not found' ); - } - - const headings = entryContent.querySelectorAll( 'h2, h3, h4, h5, h6' ); - if ( headings.length === 0 ) { - return console.log( 'No headings found' ); - } - - const idMap = new Map(); - - headings.forEach( ( heading ) => { - let id = - heading.id || - heading.textContent.trim().toLowerCase().replace( /\s+/g, '-' ); - if ( ! heading.id ) { - idMap.set( id, ( idMap.get( id ) || 0 ) + 1 ); - if ( idMap.get( id ) > 1 ) { - id += `-${ idMap.get( id ) }`; - } - heading.id = id; - } - } ); - - tocContainers.forEach( ( tocContainer ) => { - const tocList = document.createElement( 'ol' ); - tocList.classList.add( 'ol-depth-1' ); - let currentLevel = parseInt( headings[ 0 ].tagName.substring( 1 ) ); // 最初の見出しのレベルに設定 - let currentList = tocList; - const listStack = [ tocList ]; - - headings.forEach( ( heading ) => { - const level = parseInt( heading.tagName.substring( 1 ) ); - const listItem = document.createElement( 'li' ); - const link = document.createElement( 'a' ); - link.href = `#${ heading.id }`; - link.textContent = heading.textContent; - listItem.appendChild( link ); - - if ( level > currentLevel ) { - const newList = document.createElement( 'ol' ); - newList.classList.add( `ol-depth-${ level }` ); // 修正: level - 1 から level に変更 - if ( listStack[ listStack.length - 1 ].lastElementChild ) { - listStack[ - listStack.length - 1 - ].lastElementChild.appendChild( newList ); - } else { - listStack[ listStack.length - 1 ].appendChild( newList ); - } - listStack.push( newList ); - currentList = newList; - } else { - while ( level < currentLevel && listStack.length > 1 ) { - listStack.pop(); - currentList = listStack[ listStack.length - 1 ]; - currentLevel--; - } - } - - if ( currentList ) { - currentList.appendChild( listItem ); - } - currentLevel = level; - } ); - - tocContainer.appendChild( tocList ); - console.log( 'Table of contents generated' ); - } ); - - window.addEventListener( 'scroll', () => { - let currentHeading = null; - const offset = - parseFloat( - getComputedStyle( document.documentElement ).getPropertyValue( - '--wp--style--block-gap' - ) - ) * - 16 + - 1.2 * 16; - - headings.forEach( ( heading, index ) => { - const nextHeading = headings[ index + 1 ]; - const rect = heading.getBoundingClientRect(); - const nextRect = nextHeading - ? nextHeading.getBoundingClientRect() - : { top: Infinity }; - if ( rect.top <= offset && nextRect.top > offset ) { - currentHeading = heading; - } - } ); - - tocContainers.forEach( ( tocContainer ) => { - const links = tocContainer.querySelectorAll( 'a' ); - let activeFound = false; - links.forEach( ( link ) => { - const listItem = link.parentElement; - listItem.classList.remove( 'active' ); - if ( listItem.classList.length === 0 ) { - listItem.removeAttribute( 'class' ); - } - if ( - currentHeading && - link.getAttribute( 'href' ) === `#${ currentHeading.id }` - ) { - listItem.classList.add( 'active' ); - activeFound = true; - if ( - tocContainer.classList.contains( 'sidebar' ) && - tocContainer.classList.contains( 'has-max-height' ) && - window.innerWidth >= 781 - ) { - // listItem.scrollIntoView( { - // behavior: 'smooth', - // block: 'nearest', - // } ); - } - } - } ); - if ( ! activeFound && links.length > 0 ) { - links[ 0 ].parentElement.classList.add( 'active' ); - } - } ); - } ); -} ); diff --git a/src/block-library/table-of-contents/view/index.js b/src/block-library/table-of-contents/view/index.js new file mode 100644 index 0000000..035dce9 --- /dev/null +++ b/src/block-library/table-of-contents/view/index.js @@ -0,0 +1,29 @@ +import { + assignHeadingIds, + generateTableOfContents, + setupIntersectionObserver, +} from './toc.js'; + +document.addEventListener( 'DOMContentLoaded', () => { + const entryContent = document.querySelector( '.entry-content' ); + if ( ! entryContent ) { + return console.log( 'entry-content not found' ); + } + + const tocContainers = document.querySelectorAll( + '.wp-block-mone-table-of-contents' + ); + if ( tocContainers.length === 0 ) { + return console.log( 'wp-block-mone-table-of-contents not found' ); + } + + const headings = entryContent.querySelectorAll( 'h2, h3, h4, h5, h6' ); + if ( headings.length === 0 ) { + return console.log( 'No headings found' ); + } + + const idMap = new Map(); + assignHeadingIds( headings, idMap ); + generateTableOfContents( tocContainers, headings ); + setupIntersectionObserver( tocContainers, headings ); +} ); diff --git a/src/block-library/table-of-contents/view/scroll.js b/src/block-library/table-of-contents/view/scroll.js new file mode 100644 index 0000000..a617887 --- /dev/null +++ b/src/block-library/table-of-contents/view/scroll.js @@ -0,0 +1,59 @@ +/* global getComputedStyle */ + +export function handleScroll( headings, tocContainers ) { + let currentHeading = null; + const offset = + parseFloat( + getComputedStyle( document.documentElement ).getPropertyValue( + '--wp--style--block-gap' + ) + ) * + 16 + + 1.2 * 16; + + headings.forEach( ( heading, index ) => { + const nextHeading = headings[ index + 1 ]; + const rect = heading.getBoundingClientRect(); + const nextRect = nextHeading + ? nextHeading.getBoundingClientRect() + : { top: Infinity }; + if ( rect.top <= offset && nextRect.top > offset ) { + currentHeading = heading; + } + } ); + + tocContainers.forEach( ( tocContainer ) => { + const links = tocContainer.querySelectorAll( 'a' ); + let activeFound = false; + const tocRect = tocContainer.getBoundingClientRect(); + + const isTocFullyVisible = + tocRect.top >= 0 && tocRect.bottom <= window.innerHeight; + + links.forEach( ( link ) => { + const listItem = link.parentElement; + listItem.classList.remove( 'active' ); + if ( listItem.classList.length === 0 ) { + listItem.removeAttribute( 'class' ); + } + if ( + currentHeading && + link.getAttribute( 'href' ) === `#${ currentHeading.id }` + ) { + listItem.classList.add( 'active' ); + activeFound = true; + if ( + isTocFullyVisible && + tocContainer.classList.contains( 'sidebar' ) && + tocContainer.classList.contains( 'has-max-height' ) && + window.innerWidth >= 781 + ) { + listItem.scrollIntoView( { block: 'nearest' } ); + } + } + } ); + if ( ! activeFound && links.length > 0 ) { + links[ 0 ].parentElement.classList.add( 'active' ); + } + } ); +} diff --git a/src/block-library/table-of-contents/view/toc.js b/src/block-library/table-of-contents/view/toc.js new file mode 100644 index 0000000..f2ca92d --- /dev/null +++ b/src/block-library/table-of-contents/view/toc.js @@ -0,0 +1,103 @@ +import { handleScroll } from './scroll.js'; + +export function assignHeadingIds( headings, idMap ) { + headings.forEach( ( heading ) => { + let id = + heading.id || + heading.textContent.trim().toLowerCase().replace( /\s+/g, '-' ); + if ( ! heading.id ) { + idMap.set( id, ( idMap.get( id ) || 0 ) + 1 ); + if ( idMap.get( id ) > 1 ) id += `-${ idMap.get( id ) }`; + heading.id = id; + } + } ); +} + +export function generateTableOfContents( tocContainers, headings ) { + tocContainers.forEach( ( tocContainer ) => { + const tocList = document.createElement( 'ol' ); + tocList.classList.add( 'ol-depth-1' ); + let currentLevel = parseInt( headings[ 0 ].tagName.substring( 1 ) ); + let currentList = tocList; + const listStack = [ tocList ]; + + headings.forEach( ( heading ) => { + const level = parseInt( heading.tagName.substring( 1 ) ); + const listItem = createListItem( heading ); + + if ( level > currentLevel ) { + const newList = document.createElement( 'ol' ); + newList.classList.add( `ol-depth-${ level }` ); + appendNewList( listStack, newList ); + listStack.push( newList ); + currentList = newList; + } else { + while ( level < currentLevel && listStack.length > 1 ) { + listStack.pop(); + currentList = listStack[ listStack.length - 1 ]; + currentLevel--; + } + } + + if ( currentList ) { + currentList.appendChild( listItem ); + } + currentLevel = level; + } ); + + tocContainer.appendChild( tocList ); + + // 目次エリアのスクロールイベントを制御 + // tocContainer.addEventListener( 'wheel', ( event ) => { + // if ( tocContainer.matches( ':hover' ) ) { + // event.preventDefault(); + // tocContainer.scrollTop += event.deltaY; + // } + // } ); + } ); +} + +function createListItem( heading ) { + const listItem = document.createElement( 'li' ); + const link = document.createElement( 'a' ); + link.href = `#${ heading.id }`; + link.textContent = heading.textContent; + listItem.appendChild( link ); + return listItem; +} + +function appendNewList( listStack, newList ) { + if ( listStack[ listStack.length - 1 ].lastElementChild ) { + listStack[ listStack.length - 1 ].lastElementChild.appendChild( + newList + ); + } else { + listStack[ listStack.length - 1 ].appendChild( newList ); + } +} + +export function setupIntersectionObserver( tocContainers, headings ) { + const observer = new IntersectionObserver( + ( entries ) => { + entries.forEach( ( entry ) => { + if ( entry.isIntersecting ) { + window.addEventListener( 'scroll', () => + handleScroll( headings, tocContainers ) + ); + } else { + window.removeEventListener( 'scroll', () => + handleScroll( headings, tocContainers ) + ); + } + } ); + }, + { + root: null, + threshold: 1, + } + ); + + tocContainers.forEach( ( tocContainer ) => { + observer.observe( tocContainer ); + } ); +} diff --git a/src/utils/style.scss b/src/utils/style.scss index 392d13f..2a5cc45 100644 --- a/src/utils/style.scss +++ b/src/utils/style.scss @@ -6,3 +6,7 @@ :where(body) { word-break: break-word; } + +html { + scroll-behavior: smooth; +} From 5f752572a6bb28816492c26700f12e835613bb08 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sat, 21 Dec 2024 15:44:16 +0900 Subject: [PATCH 04/23] =?UTF-8?q?=E3=82=88=E3=82=8A=E3=82=B7=E3=83=B3?= =?UTF-8?q?=E3=83=97=E3=83=AB=E3=81=AB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/block-library/table-of-contents/edit.js | 11 ++--------- src/block-library/table-of-contents/index.php | 13 +------------ src/block-library/table-of-contents/style.scss | 6 ++++-- src/utils/style.scss | 4 ---- 4 files changed, 7 insertions(+), 27 deletions(-) diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 2b87242..c50d8ad 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -10,22 +10,15 @@ import { export default function TableOfContentEdit( props ) { const { attributes, setAttributes, clientId } = props; - const { maxHeight} = attributes; + const { maxHeight } = attributes; - const paddingTop = attributes.style?.spacing?.padding?.top || '0'; - const paddingBottom = attributes.style?.spacing?.padding?.bottom || '0'; - - let maxHeightVar = ''; - if ( maxHeight ) { - maxHeightVar += `calc(${ maxHeight } - ${ paddingTop } - ${ paddingBottom })`; - } const blockProps = useBlockProps( { className: clsx( { [ `has-max-height` ]: maxHeight, } ), style: { - '--the-max-height': maxHeightVar, + 'max-height': maxHeight, }, } ); diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index a38370f..19f7a98 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -11,15 +11,6 @@ exit; } -function mone_padding_attributes_to_value( $padding ) { - if ( is_string( $padding ) && str_contains( $padding, 'var:preset|spacing|' ) ) { - $index_to_splice = strrpos( $padding, '|' ) + 1; - $slug = _wp_to_kebab_case( substr( $padding, $index_to_splice ) ); - $padding = "var(--wp--preset--spacing--$slug)"; - } - return $padding; -} - /** * table of contents render callback * @@ -27,14 +18,12 @@ function mone_padding_attributes_to_value( $padding ) { * @return string */ function table_of_contents_render_callback( $attributes ) { - $padding_top = isset( $attributes['style']['spacing']['padding']['top'] ) ? mone_padding_attributes_to_value( $attributes['style']['spacing']['padding']['top'] ) : 0; - $padding_bottom = isset( $attributes['style']['spacing']['padding']['bottom'] ) ? mone_padding_attributes_to_value( $attributes['style']['spacing']['padding']['bottom'] ) : 0; $max_height = $attributes['maxHeight'] ?? false; $style_attribute = ''; $classes = array(); if ( $max_height ) { - $style_attribute .= '--the-max-height: calc(' . $max_height .' - ' . $padding_top . ' - ' . $padding_bottom . ');'; + $style_attribute .= 'max-height: ' . $max_height . ';'; } if ( $max_height ) { $classes[] = 'has-max-height'; diff --git a/src/block-library/table-of-contents/style.scss b/src/block-library/table-of-contents/style.scss index 9f0459e..68f6ab1 100644 --- a/src/block-library/table-of-contents/style.scss +++ b/src/block-library/table-of-contents/style.scss @@ -1,6 +1,8 @@ .wp-block-mone-table-of-contents { - overflow-y: auto; - max-height: var(--the-max-height); + + &.has-max-height { + overflow-y: auto; + } ol { padding: 0; diff --git a/src/utils/style.scss b/src/utils/style.scss index 2a5cc45..392d13f 100644 --- a/src/utils/style.scss +++ b/src/utils/style.scss @@ -6,7 +6,3 @@ :where(body) { word-break: break-word; } - -html { - scroll-behavior: smooth; -} From 5020331650b84934ee9e16e8ab009991713627be Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sun, 22 Dec 2024 12:44:47 +0900 Subject: [PATCH 05/23] up --- src/block-library/table-of-contents/edit.js | 1 - .../table-of-contents/view/hide-element.js | 5 +++++ src/block-library/table-of-contents/view/index.js | 13 ++++++++++--- 3 files changed, 15 insertions(+), 4 deletions(-) create mode 100644 src/block-library/table-of-contents/view/hide-element.js diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index c50d8ad..caf7d12 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -12,7 +12,6 @@ export default function TableOfContentEdit( props ) { const { attributes, setAttributes, clientId } = props; const { maxHeight } = attributes; - const blockProps = useBlockProps( { className: clsx( { [ `has-max-height` ]: maxHeight, diff --git a/src/block-library/table-of-contents/view/hide-element.js b/src/block-library/table-of-contents/view/hide-element.js new file mode 100644 index 0000000..e4e3d8d --- /dev/null +++ b/src/block-library/table-of-contents/view/hide-element.js @@ -0,0 +1,5 @@ +export function hideElementsWithClass( className ) { + document.querySelectorAll( `.${ className }` ).forEach( ( element ) => { + element.style.display = 'none'; + } ); +} diff --git a/src/block-library/table-of-contents/view/index.js b/src/block-library/table-of-contents/view/index.js index 035dce9..7226b3e 100644 --- a/src/block-library/table-of-contents/view/index.js +++ b/src/block-library/table-of-contents/view/index.js @@ -3,23 +3,30 @@ import { generateTableOfContents, setupIntersectionObserver, } from './toc.js'; +import { hideElementsWithClass } from './hide-element'; document.addEventListener( 'DOMContentLoaded', () => { + // Get the entry content element const entryContent = document.querySelector( '.entry-content' ); if ( ! entryContent ) { - return console.log( 'entry-content not found' ); + hideElementsWithClass( 'mone-toc-none' ); + return; } + // Get the table of contents containers const tocContainers = document.querySelectorAll( '.wp-block-mone-table-of-contents' ); if ( tocContainers.length === 0 ) { - return console.log( 'wp-block-mone-table-of-contents not found' ); + hideElementsWithClass( 'mone-toc-none' ); + return; } + // Get all headings in the entry content const headings = entryContent.querySelectorAll( 'h2, h3, h4, h5, h6' ); if ( headings.length === 0 ) { - return console.log( 'No headings found' ); + hideElementsWithClass( 'mone-toc-none' ); + return; } const idMap = new Map(); From ff81ab35b77edf255755b34fe368cc16d8ed2eca Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sun, 22 Dec 2024 20:31:24 +0900 Subject: [PATCH 06/23] add color --- .../table-of-contents/block.json | 19 +++- src/block-library/table-of-contents/edit.js | 92 ++++++++++++++++--- src/block-library/table-of-contents/index.js | 2 + src/block-library/table-of-contents/index.php | 42 +++++++-- .../table-of-contents/style.scss | 33 +++++-- .../table-of-contents/variations.js | 50 ++++++++++ .../table-of-contents/view/toc.js | 9 ++ theme.json | 15 +++ 8 files changed, 232 insertions(+), 30 deletions(-) create mode 100644 src/block-library/table-of-contents/variations.js diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json index c609523..cea3aa8 100644 --- a/src/block-library/table-of-contents/block.json +++ b/src/block-library/table-of-contents/block.json @@ -6,7 +6,22 @@ "description": "Table of contents", "textdomain": "mone", "attributes": { - "title": { + "deactivateTextColor": { + "type": "string" + }, + "customDeactivateTextColor": { + "type": "string" + }, + "circleColor": { + "type": "string" + }, + "customCircleColor": { + "type": "string" + }, + "lineColor": { + "type": "string" + }, + "customLineColor": { "type": "string" }, "maxHeight": { @@ -27,8 +42,6 @@ "padding": true }, "typography": { - "fontSize": true, - "lineHeight": true, "__experimentalFontFamily": true, "__experimentalFontWeight": true, "__experimentalFontStyle": true, diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index caf7d12..eb83011 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -6,23 +6,82 @@ import { InspectorControls, useBlockProps, HeightControl, + withColors, + __experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown, + __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients, } from '@wordpress/block-editor'; -export default function TableOfContentEdit( props ) { - const { attributes, setAttributes, clientId } = props; +function TableOfContentEdit( props ) { + const { + attributes, + setAttributes, + clientId, + deactivateTextColor, + setDeactivateTextColor, + circleColor, + setCircleColor, + lineColor, + setLineColor, + } = props; const { maxHeight } = attributes; const blockProps = useBlockProps( { className: clsx( { [ `has-max-height` ]: maxHeight, + [ `has-deactivate-text-color` ]: !! deactivateTextColor.color, + [ `has-circle-color` ]: !! circleColor.color, + [ `has-line-color` ]: !! lineColor.color, } ), style: { - 'max-height': maxHeight, + maxHeight, + '--the-deactivate-text-color': !! deactivateTextColor?.slug + ? `var(--wp--preset--color--${ deactivateTextColor.slug })` + : deactivateTextColor?.color, + '--the-circle-color': !! circleColor?.slug + ? `var(--wp--preset--color--${ circleColor.slug })` + : circleColor?.color, + '--the-line-color': !! lineColor?.slug + ? `var(--wp--preset--color--${ lineColor.slug })` + : lineColor?.color, }, } ); return ( <> + + setDeactivateTextColor(), + isShownByDefault: false, + enableAlpha: true, + }, + { + label: __( 'Circle Color', 'mone' ), + colorValue: circleColor.color, + onColorChange: setCircleColor, + resetAllFilter: () => setCircleColor(), + isShownByDefault: true, + enableAlpha: true, + }, + { + label: __( 'Line Color', 'mone' ), + colorValue: lineColor.color, + onColorChange: setLineColor, + resetAllFilter: () => setLineColor(), + isShownByDefault: false, + enableAlpha: true, + }, + ] } + panelId={ clientId } + { ...useMultipleOriginColorsAndGradients() } + disableCustomGradients + /> + maxHeight !== undefined } @@ -32,6 +91,9 @@ export default function TableOfContentEdit( props ) { } isShownByDefault={ true } panelId={ clientId } + resetAllFilter={ () => { + setAttributes( { maxHeight: undefined } ); + } } > { __( '目次エディター プレビュー H2見出し', - 'text-domain' + 'mone' ) }
          @@ -56,7 +118,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H3見出し', - 'text-domain' + 'mone' ) } @@ -64,7 +126,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H3見出し', - 'text-domain' + 'mone' ) } @@ -74,7 +136,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H2見出し', - 'text-domain' + 'mone' ) }
            @@ -82,7 +144,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H3見出し', - 'text-domain' + 'mone' ) }
              @@ -90,7 +152,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H4見出し', - 'text-domain' + 'mone' ) }
                @@ -98,7 +160,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H5見出し', - 'text-domain' + 'mone' ) } @@ -112,7 +174,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H2見出し', - 'text-domain' + 'mone' ) }
                  @@ -120,7 +182,7 @@ export default function TableOfContentEdit( props ) { { __( '目次エディター プレビュー H3見出し', - 'text-domain' + 'mone' ) } @@ -131,3 +193,9 @@ export default function TableOfContentEdit( props ) { ); } + +export default withColors( { + deactivateTextColor: 'color', + circleColor: 'color', + lineColor: 'color', +} )( TableOfContentEdit ); diff --git a/src/block-library/table-of-contents/index.js b/src/block-library/table-of-contents/index.js index d03b17a..1a82931 100644 --- a/src/block-library/table-of-contents/index.js +++ b/src/block-library/table-of-contents/index.js @@ -10,6 +10,7 @@ import { blockCategoryIcon as icon } from '../../icons'; import metadata from './block.json'; import edit from './edit'; import './style.scss'; +import variations from './variations'; const { name } = metadata; @@ -18,4 +19,5 @@ export { metadata, name }; registerBlockType( name, { icon, edit, + variations, } ); diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index 19f7a98..e0f0733 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -14,19 +14,47 @@ /** * table of contents render callback * - * @param array $attributes Block attributes. + * @param array $attributes Block attributes. * @return string */ function table_of_contents_render_callback( $attributes ) { - $max_height = $attributes['maxHeight'] ?? false; + $max_height = $attributes['maxHeight'] ?? false; + $deactivate_text_color = isset( $attributes['deactivateTextColor'] ) ? $attributes['deactivateTextColor'] : null; + $custom_deactivate_textColor = isset( $attributes['customDeactivateTextColor'] ) ? $attributes['customDeactivateTextColor'] : null; + $circle_color = isset( $attributes['circleColor'] ) ? $attributes['circleColor'] : null; + $custom_circle_color = isset( $attributes['customCircleColor'] ) ? $attributes['customCircleColor'] : null; + $line_color = isset( $attributes['lineColor'] ) ? $attributes['lineColor'] : null; + $custom_line_color = isset( $attributes['customLineColor'] ) ? $attributes['customLineColor'] : null; + $classes = array(); $style_attribute = ''; - $classes = array(); if ( $max_height ) { - $style_attribute .= 'max-height: ' . $max_height . ';'; + $classes[] = 'has-max-height'; + $style_attribute .= 'max-height:' . $max_height . ';'; } - if ( $max_height ) { - $classes[] = 'has-max-height'; + if ( ! empty( $deactivate_text_color ) ) { + $classes[] = 'has-deactivate-text-color'; + $style_attribute .= '--the-deactivate-text-color:var(--wp--preset--color--' . $deactivate_text_color . ');'; + } + if ( ! empty( $custom_deactivate_textColor ) ) { + $classes[] = 'has-deactivate-text-color'; + $style_attribute .= '--the-deactivate-text-color:' . $custom_deactivate_textColor . ';'; + } + if ( ! empty( $circle_color ) ) { + $classes[] = 'has-circle-color'; + $style_attribute .= '--the-circle-color:var(--wp--preset--color--' . $circle_color . ');'; + } + if ( ! empty( $custom_circle_color ) ) { + $classes[] = 'has-circle-color'; + $style_attribute .= '--the-circle-color:' . $custom_circle_color . ';'; + } + if ( ! empty( $line_color ) ) { + $classes[] = 'has-line-color'; + $style_attribute .= '--the-line-color:var(--wp--preset--color--' . $line_color . ');'; + } + if ( ! empty( $custom_line_color ) ) { + $classes[] = 'has-line-color'; + $style_attribute .= '--the-line-color:' . $custom_line_color . ';'; } $wrapper_attributes = get_block_wrapper_attributes( @@ -55,4 +83,4 @@ function register_block_table_of_contents() { ) ); } -add_action( 'init', __NAMESPACE__ . '\register_block_table_of_contents' ); \ No newline at end of file +add_action( 'init', __NAMESPACE__ . '\register_block_table_of_contents' ); diff --git a/src/block-library/table-of-contents/style.scss b/src/block-library/table-of-contents/style.scss index 68f6ab1..c6c21e2 100644 --- a/src/block-library/table-of-contents/style.scss +++ b/src/block-library/table-of-contents/style.scss @@ -9,11 +9,11 @@ list-style: none; position: relative; a { - color: var(--wp--preset--color--content-contrast-2); text-decoration: none; margin: 8px 0; display: block; line-height: 1.5; + transition: color 0.3s ease-in-out; } } @@ -39,7 +39,15 @@ left: 7px; width: 2px; content: ""; - background: var(--wp--preset--color--heading-bg); + } + + &:not(.has-line-color) { + .ol-depth-1:before { + background: var(--wp--preset--color--mone-border); + } + } + .ol-depth-1:before { + background: var(--the-line-color, var(--wp--preset--color--mone-border)); } .ol-depth-1>li { @@ -52,14 +60,23 @@ .ol-depth-4>li.active:before, .ol-depth-5>li.active:before, .ol-depth-6>li.active:before { - background: var(--wp--preset--color--key-2); + background: var(--the-circle-color, var(--wp--preset--color--key-2)); transition: background-color 0.3s ease-in-out; } - .active { - > a { - color: var(--wp--preset--color--content-contrast); - transition: color 0.3s ease-in-out; + &.has-deactivate-text-color { + li:not(.active) { + > a { + color: var(--the-deactivate-text-color,var(--wp--preset--color--content-contrast-2)); + } + } + } + + &:not(.has-deactivate-text-color) { + li:not(.active) { + > a { + color: color-mix(in srgb, currentColor 60%, #fff); + } } } @@ -69,7 +86,7 @@ li:before { top: 6px; - background: #d9eafb; + background: color-mix(in srgb, var(--the-circle-color, var(--wp--preset--color--key-2)) 40%, #fff); position: absolute; content: ""; border-radius: 100%; diff --git a/src/block-library/table-of-contents/variations.js b/src/block-library/table-of-contents/variations.js new file mode 100644 index 0000000..bec0492 --- /dev/null +++ b/src/block-library/table-of-contents/variations.js @@ -0,0 +1,50 @@ +/** + * WordPress dependencies + */ +import { __ } from '@wordpress/i18n'; +import { getPath } from '@wordpress/url'; + +/** + * Internal dependencies + */ +import { blockCategoryIcon } from '../../icons'; + +const isSiteEditor = getPath( window.location.href )?.includes( + 'site-editor.php' +); + +const variations = [ + { + name: 'default-toc', + title: __( '目次', 'block-library' ), + attributes: { + style: { + border: { + color: '#6f00ff', + }, + }, + }, + innerBlocks: [], + icon: blockCategoryIcon, + scope: [ 'inserter', 'transform' ], + isDefault: true, + }, + { + name: 'side-toc', + title: __( '目次(サイド)', 'block-library' ), + attributes: { + isLink: true, + linkTarget: '_blank', + style: { + border: { + color: '#ff0000', + }, + }, + }, + innerBlocks: [], + icon: blockCategoryIcon, + scope: [ isSiteEditor && 'inserter', 'transform' ], + }, +]; + +export default variations; diff --git a/src/block-library/table-of-contents/view/toc.js b/src/block-library/table-of-contents/view/toc.js index f2ca92d..9eb0610 100644 --- a/src/block-library/table-of-contents/view/toc.js +++ b/src/block-library/table-of-contents/view/toc.js @@ -54,6 +54,15 @@ export function generateTableOfContents( tocContainers, headings ) { // tocContainer.scrollTop += event.deltaY; // } // } ); + + // activeクラスが存在しない場合は最初のliをactiveにする + const activeItems = tocContainer.querySelectorAll( 'li.active' ); + if ( activeItems.length === 0 ) { + const firstListItem = tocContainer.querySelector( 'li' ); + if ( firstListItem ) { + firstListItem.classList.add( 'active' ); + } + } } ); } diff --git a/theme.json b/theme.json index ac16e3d..5de2e86 100644 --- a/theme.json +++ b/theme.json @@ -603,6 +603,21 @@ "color": { "text": "#6f6f6f" } + }, + "mone/table-of-contents": { + "spacing": { + "padding": { + "bottom": "var:preset|spacing|10", + "left": "var:preset|spacing|10", + "right": "var:preset|spacing|10", + "top": "var:preset|spacing|10" + } + }, + "border": { + "color": "var(--wp--preset--color--mone-border)", + "style": "solid", + "width": "1px" + } } }, "color": { From 94c32cc4bd4c9a7c48415fba30c581110726b609 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Mon, 23 Dec 2024 08:23:02 +0900 Subject: [PATCH 07/23] up --- .../table-of-contents/block.json | 2 +- src/block-library/table-of-contents/edit.js | 66 +++++++++++++++---- src/block-library/table-of-contents/index.php | 19 +++++- .../table-of-contents/style.scss | 56 ++++++++++++++-- .../table-of-contents/variations.js | 20 ++---- 5 files changed, 130 insertions(+), 33 deletions(-) diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json index cea3aa8..650e614 100644 --- a/src/block-library/table-of-contents/block.json +++ b/src/block-library/table-of-contents/block.json @@ -3,7 +3,7 @@ "name": "mone/table-of-contents", "category": "mone-block-cat", "title": "Table of contents", - "description": "Table of contents", + "description": "A table of contents is automatically created by retrieving headings from the content.A preview is displayed in the editor.", "textdomain": "mone", "attributes": { "deactivateTextColor": { diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index eb83011..92e5c3e 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -11,6 +11,8 @@ import { __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients, } from '@wordpress/block-editor'; +import { classStringToClassArray } from '../../utils-func/class-name/classAttribute.js'; + function TableOfContentEdit( props ) { const { attributes, @@ -23,7 +25,11 @@ function TableOfContentEdit( props ) { lineColor, setLineColor, } = props; - const { maxHeight } = attributes; + const { maxHeight, className } = attributes; + const classArray = classStringToClassArray( className ); + const hasDefaultTocStyle = classArray.includes( + 'is-style-mone-default-toc' + ); const blockProps = useBlockProps( { className: clsx( { @@ -31,9 +37,11 @@ function TableOfContentEdit( props ) { [ `has-deactivate-text-color` ]: !! deactivateTextColor.color, [ `has-circle-color` ]: !! circleColor.color, [ `has-line-color` ]: !! lineColor.color, + [ `mone-toc` ]: ! hasDefaultTocStyle, } ), style: { maxHeight, + overflowY: maxHeight ? 'auto' : undefined, '--the-deactivate-text-color': !! deactivateTextColor?.slug ? `var(--wp--preset--color--${ deactivateTextColor.slug })` : deactivateTextColor?.color, @@ -57,25 +65,31 @@ function TableOfContentEdit( props ) { colorValue: deactivateTextColor.color, onColorChange: setDeactivateTextColor, resetAllFilter: () => setDeactivateTextColor(), - isShownByDefault: false, + isShownByDefault: true, enableAlpha: true, }, { - label: __( 'Circle Color', 'mone' ), + label: hasDefaultTocStyle + ? __( 'Circle Color', 'mone' ) + : __( 'Number Color', 'mone' ), colorValue: circleColor.color, onColorChange: setCircleColor, resetAllFilter: () => setCircleColor(), isShownByDefault: true, enableAlpha: true, }, - { - label: __( 'Line Color', 'mone' ), - colorValue: lineColor.color, - onColorChange: setLineColor, - resetAllFilter: () => setLineColor(), - isShownByDefault: false, - enableAlpha: true, - }, + ...( hasDefaultTocStyle + ? [ + { + label: __( 'Line Color', 'mone' ), + colorValue: lineColor.color, + onColorChange: setLineColor, + resetAllFilter: () => setLineColor(), + isShownByDefault: true, + enableAlpha: true, + }, + ] + : [] ), ] } panelId={ clientId } { ...useMultipleOriginColorsAndGradients() } @@ -169,6 +183,36 @@ function TableOfContentEdit( props ) {
              +
                +
              1. + + { __( + '目次エディター プレビュー H3見出し', + 'mone' + ) } + +
                  +
                1. + + { __( + '目次エディター プレビュー H4見出し', + 'mone' + ) } + +
                    +
                  1. + + { __( + '目次エディター プレビュー H5見出し', + 'mone' + ) } + +
                    2. +
                  +
                  2. +
                +
                2. +
            1. diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index e0f0733..6881e54 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -25,12 +25,17 @@ function table_of_contents_render_callback( $attributes ) { $custom_circle_color = isset( $attributes['customCircleColor'] ) ? $attributes['customCircleColor'] : null; $line_color = isset( $attributes['lineColor'] ) ? $attributes['lineColor'] : null; $custom_line_color = isset( $attributes['customLineColor'] ) ? $attributes['customLineColor'] : null; + $class_name = $attributes['className'] ?? ''; + $class_array = explode( ' ', $class_name ); $classes = array(); $style_attribute = ''; + if ( ! in_array( 'is-style-mone-default-toc', $class_array, true ) ) { + $classes[] = 'mone-toc'; + } if ( $max_height ) { $classes[] = 'has-max-height'; - $style_attribute .= 'max-height:' . $max_height . ';'; + $style_attribute .= 'max-height:' . $max_height . '; overflow-y: auto;'; } if ( ! empty( $deactivate_text_color ) ) { $classes[] = 'has-deactivate-text-color'; @@ -76,6 +81,18 @@ function table_of_contents_render_callback( $attributes ) { * @return void */ function register_block_table_of_contents() { + + register_block_style( + 'mone/table-of-contents', + array( + 'name' => 'mone-default-toc', + 'label' => __( 'Mone table of contents', 'mone' ), + 'style_data' => array( + 'css' => '', + ), + ) + ); + register_block_type( __DIR__, array( diff --git a/src/block-library/table-of-contents/style.scss b/src/block-library/table-of-contents/style.scss index c6c21e2..84a7004 100644 --- a/src/block-library/table-of-contents/style.scss +++ b/src/block-library/table-of-contents/style.scss @@ -1,8 +1,4 @@ -.wp-block-mone-table-of-contents { - - &.has-max-height { - overflow-y: auto; - } +.wp-block-mone-table-of-contents.is-style-mone-default-toc { ol { padding: 0; @@ -107,4 +103,54 @@ width: 8px; height: 8px; } +} + +// デフォルトのスタイルの時 +.wp-block-mone-table-of-contents.mone-toc { + ol { + list-style: none; + counter-reset: item; + padding-inline-start: 1.5rem; + + a { + transition: color 0.3s ease-in-out; + } + + &:first-child { + padding: 0; + } + + li { + counter-increment: item; + margin: 8px 0; + line-height: 1.5; + &:first-child { + counter-reset: toc; + } + &:before { + content: counters(item, "."); + margin-right: 0.5em; + } + + ol { + counter-reset: item; + } + } + } + + &.has-circle-color { + ol li { + &::before { + color: var(--the-circle-color, var(--wp--preset--color--key-2)); + } + } + } + + &.has-deactivate-text-color { + li:not(.active) { + > a { + color: var(--the-deactivate-text-color,var(--wp--preset--color--content-contrast-2)); + } + } + } } \ No newline at end of file diff --git a/src/block-library/table-of-contents/variations.js b/src/block-library/table-of-contents/variations.js index bec0492..57cb968 100644 --- a/src/block-library/table-of-contents/variations.js +++ b/src/block-library/table-of-contents/variations.js @@ -15,14 +15,10 @@ const isSiteEditor = getPath( window.location.href )?.includes( const variations = [ { - name: 'default-toc', - title: __( '目次', 'block-library' ), + name: 'mone-default-toc', + title: __( 'Table of contents', 'block-library' ), attributes: { - style: { - border: { - color: '#6f00ff', - }, - }, + className: 'is-style-mone-default-toc', }, innerBlocks: [], icon: blockCategoryIcon, @@ -31,15 +27,9 @@ const variations = [ }, { name: 'side-toc', - title: __( '目次(サイド)', 'block-library' ), + title: __( 'ドット', 'block-library' ), attributes: { - isLink: true, - linkTarget: '_blank', - style: { - border: { - color: '#ff0000', - }, - }, + className: 'is-style-mone-side-toc', }, innerBlocks: [], icon: blockCategoryIcon, From a17277f921d17d823ef5c6f1aa5e364d6f4451dd Mon Sep 17 00:00:00 2001 From: shimotmk Date: Mon, 23 Dec 2024 21:01:23 +0900 Subject: [PATCH 08/23] up --- .../table-of-contents/block.json | 10 +- src/block-library/table-of-contents/edit.js | 144 +++++++++++++++--- src/block-library/table-of-contents/index.php | 44 ++++-- .../table-of-contents/style.scss | 69 ++++++--- .../table-of-contents/variations.js | 15 +- .../table-of-contents/view/scroll.js | 31 +++- 6 files changed, 243 insertions(+), 70 deletions(-) diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json index 650e614..a5ccaef 100644 --- a/src/block-library/table-of-contents/block.json +++ b/src/block-library/table-of-contents/block.json @@ -12,10 +12,16 @@ "customDeactivateTextColor": { "type": "string" }, - "circleColor": { + "beforeColor": { "type": "string" }, - "customCircleColor": { + "customBeforeColor": { + "type": "string" + }, + "beforeDeactivateColor": { + "type": "string" + }, + "customBeforeDeactivateColor": { "type": "string" }, "lineColor": { diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 92e5c3e..7a4c712 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -1,7 +1,11 @@ import clsx from 'clsx'; import { __ } from '@wordpress/i18n'; -import { __experimentalToolsPanelItem as ToolsPanelItem } from '@wordpress/components'; +import { + __experimentalToolsPanelItem as ToolsPanelItem, + ToggleControl, + __experimentalToolsPanel as ToolsPanel, +} from '@wordpress/components'; import { InspectorControls, useBlockProps, @@ -11,17 +15,26 @@ import { __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients, } from '@wordpress/block-editor'; -import { classStringToClassArray } from '../../utils-func/class-name/classAttribute.js'; +import { + classStringToClassArray, + setClassName, + existsClass, + deleteClass, +} from '../../utils-func/class-name/classAttribute.js'; +import { useToolsPanelDropdownMenuProps } from '../../utils-func/use-tools-panel-dropdown'; function TableOfContentEdit( props ) { + const dropdownMenuProps = useToolsPanelDropdownMenuProps(); const { attributes, setAttributes, clientId, deactivateTextColor, setDeactivateTextColor, - circleColor, - setCircleColor, + beforeColor, + setBeforeColor, + beforeDeactivateColor, + setBeforeDeactivateColor, lineColor, setLineColor, } = props; @@ -30,24 +43,37 @@ function TableOfContentEdit( props ) { const hasDefaultTocStyle = classArray.includes( 'is-style-mone-default-toc' ); + const scrollAnimationClassName = 'mone-is-scroll-animation'; const blockProps = useBlockProps( { className: clsx( { [ `has-max-height` ]: maxHeight, - [ `has-deactivate-text-color` ]: !! deactivateTextColor.color, - [ `has-circle-color` ]: !! circleColor.color, + [ `has-deactivate-text-color` ]: + existsClass( className, scrollAnimationClassName ) && + !! deactivateTextColor.color, + [ `has-before-color` ]: !! beforeColor.color, + [ `has-before-deactivate-color` ]: + existsClass( className, scrollAnimationClassName ) && + !! beforeDeactivateColor.color, [ `has-line-color` ]: !! lineColor.color, [ `mone-toc` ]: ! hasDefaultTocStyle, } ), style: { maxHeight, overflowY: maxHeight ? 'auto' : undefined, - '--the-deactivate-text-color': !! deactivateTextColor?.slug - ? `var(--wp--preset--color--${ deactivateTextColor.slug })` - : deactivateTextColor?.color, - '--the-circle-color': !! circleColor?.slug - ? `var(--wp--preset--color--${ circleColor.slug })` - : circleColor?.color, + '--the-deactivate-text-color': + existsClass( className, scrollAnimationClassName ) && + ( !! deactivateTextColor?.slug + ? `var(--wp--preset--color--${ deactivateTextColor.slug })` + : deactivateTextColor?.color ), + '--the-before-color': !! beforeColor?.slug + ? `var(--wp--preset--color--${ beforeColor.slug })` + : beforeColor?.color, + '--the-before-deactivate-color': + existsClass( className, scrollAnimationClassName ) && + ( !! beforeDeactivateColor?.slug + ? `var(--wp--preset--color--${ beforeDeactivateColor.slug })` + : beforeDeactivateColor?.color ), '--the-line-color': !! lineColor?.slug ? `var(--wp--preset--color--${ lineColor.slug })` : lineColor?.color, @@ -56,28 +82,97 @@ function TableOfContentEdit( props ) { return ( <> + + { + deleteClass( + scrollAnimationClassName, + className, + setAttributes + ); + } } + dropdownMenuProps={ dropdownMenuProps } + > + + existsClass( className, scrollAnimationClassName ) + } + onDeselect={ () => + deleteClass( + scrollAnimationClassName, + className, + setAttributes + ) + } + > + { + setClassName( + scrollAnimationClassName, + className, + setAttributes + ); + } } + __nextHasNoMarginBottom + /> + + + setDeactivateTextColor(), - isShownByDefault: true, - enableAlpha: true, - }, { label: hasDefaultTocStyle ? __( 'Circle Color', 'mone' ) : __( 'Number Color', 'mone' ), - colorValue: circleColor.color, - onColorChange: setCircleColor, - resetAllFilter: () => setCircleColor(), + colorValue: beforeColor.color, + onColorChange: setBeforeColor, + resetAllFilter: () => setBeforeColor(), isShownByDefault: true, enableAlpha: true, }, + ...( existsClass( className, scrollAnimationClassName ) + ? [ + { + label: __( + 'Deactivate text Color', + 'mone' + ), + colorValue: deactivateTextColor.color, + onColorChange: setDeactivateTextColor, + resetAllFilter: () => + setDeactivateTextColor(), + isShownByDefault: true, + enableAlpha: true, + }, + { + label: hasDefaultTocStyle + ? __( + 'Circle deactivate Color', + 'mone' + ) + : __( + 'Number deactivate Color', + 'mone' + ), + colorValue: beforeDeactivateColor.color, + onColorChange: setBeforeDeactivateColor, + resetAllFilter: () => + setBeforeDeactivateColor(), + isShownByDefault: true, + enableAlpha: true, + }, + ] + : [] ), ...( hasDefaultTocStyle ? [ { @@ -240,6 +335,7 @@ function TableOfContentEdit( props ) { export default withColors( { deactivateTextColor: 'color', - circleColor: 'color', + beforeColor: 'color', + beforeDeactivateColor: 'color', lineColor: 'color', } )( TableOfContentEdit ); diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index 6881e54..1cc210b 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -21,8 +21,10 @@ function table_of_contents_render_callback( $attributes ) { $max_height = $attributes['maxHeight'] ?? false; $deactivate_text_color = isset( $attributes['deactivateTextColor'] ) ? $attributes['deactivateTextColor'] : null; $custom_deactivate_textColor = isset( $attributes['customDeactivateTextColor'] ) ? $attributes['customDeactivateTextColor'] : null; - $circle_color = isset( $attributes['circleColor'] ) ? $attributes['circleColor'] : null; - $custom_circle_color = isset( $attributes['customCircleColor'] ) ? $attributes['customCircleColor'] : null; + $before_color = isset( $attributes['beforeColor'] ) ? $attributes['beforeColor'] : null; + $custom_before_color = isset( $attributes['customBeforeColor'] ) ? $attributes['customBeforeColor'] : null; + $before_deactivate_color = isset( $attributes['beforeDeactivateColor'] ) ? $attributes['beforeDeactivateColor'] : null; + $custom_before_deactivate_color = isset( $attributes['customBeforeDeactivateColor'] ) ? $attributes['customBeforeDeactivateColor'] : null; $line_color = isset( $attributes['lineColor'] ) ? $attributes['lineColor'] : null; $custom_line_color = isset( $attributes['customLineColor'] ) ? $attributes['customLineColor'] : null; $class_name = $attributes['className'] ?? ''; @@ -37,21 +39,33 @@ function table_of_contents_render_callback( $attributes ) { $classes[] = 'has-max-height'; $style_attribute .= 'max-height:' . $max_height . '; overflow-y: auto;'; } - if ( ! empty( $deactivate_text_color ) ) { - $classes[] = 'has-deactivate-text-color'; - $style_attribute .= '--the-deactivate-text-color:var(--wp--preset--color--' . $deactivate_text_color . ');'; - } - if ( ! empty( $custom_deactivate_textColor ) ) { - $classes[] = 'has-deactivate-text-color'; - $style_attribute .= '--the-deactivate-text-color:' . $custom_deactivate_textColor . ';'; + if ( in_array( 'mone-is-scroll-animation', $class_array, true ) ) { + if ( ! empty( $deactivate_text_color ) ) { + $classes[] = 'has-deactivate-text-color'; + $style_attribute .= '--the-deactivate-text-color:var(--wp--preset--color--' . $deactivate_text_color . ');'; + } + if ( ! empty( $custom_deactivate_textColor ) ) { + $classes[] = 'has-deactivate-text-color'; + $style_attribute .= '--the-deactivate-text-color:' . $custom_deactivate_textColor . ';'; + } + } + if ( ! empty( $before_color ) ) { + $classes[] = 'has-before-color'; + $style_attribute .= '--the-before-color:var(--wp--preset--color--' . $before_color . ');'; } - if ( ! empty( $circle_color ) ) { - $classes[] = 'has-circle-color'; - $style_attribute .= '--the-circle-color:var(--wp--preset--color--' . $circle_color . ');'; + if ( ! empty( $custom_before_color ) ) { + $classes[] = 'has-before-color'; + $style_attribute .= '--the-before-color:' . $custom_before_color . ';'; } - if ( ! empty( $custom_circle_color ) ) { - $classes[] = 'has-circle-color'; - $style_attribute .= '--the-circle-color:' . $custom_circle_color . ';'; + if ( in_array( 'mone-is-scroll-animation', $class_array, true ) ) { + if ( ! empty( $before_deactivate_color ) ) { + $classes[] = 'has-before-deactivate-color'; + $style_attribute .= '--the-before-deactivate-color:var(--wp--preset--color--' . $before_deactivate_color . ');'; + } + if ( ! empty( $custom_before_deactivate_color ) ) { + $classes[] = 'has-before-deactivate-color'; + $style_attribute .= '--the-before-deactivate-color:' . $custom_before_deactivate_color . ';'; + } } if ( ! empty( $line_color ) ) { $classes[] = 'has-line-color'; diff --git a/src/block-library/table-of-contents/style.scss b/src/block-library/table-of-contents/style.scss index 84a7004..734f78e 100644 --- a/src/block-library/table-of-contents/style.scss +++ b/src/block-library/table-of-contents/style.scss @@ -50,25 +50,14 @@ position: relative; } - .ol-depth-1>li.active:before, - .ol-depth-2>li.active:before, - .ol-depth-3>li.active:before, - .ol-depth-4>li.active:before, - .ol-depth-5>li.active:before, - .ol-depth-6>li.active:before { - background: var(--the-circle-color, var(--wp--preset--color--key-2)); - transition: background-color 0.3s ease-in-out; - } - - &.has-deactivate-text-color { + &.mone-is-scroll-animation.has-deactivate-text-color { li:not(.active) { > a { - color: var(--the-deactivate-text-color,var(--wp--preset--color--content-contrast-2)); + color: var(--the-deactivate-text-color, currentColor); } } } - - &:not(.has-deactivate-text-color) { + &.mone-is-scroll-animation:not(.has-deactivate-text-color) { li:not(.active) { > a { color: color-mix(in srgb, currentColor 60%, #fff); @@ -82,12 +71,39 @@ li:before { top: 6px; - background: color-mix(in srgb, var(--the-circle-color, var(--wp--preset--color--key-2)) 40%, #fff); position: absolute; content: ""; border-radius: 100%; } + .ol-depth-1>li.active:before, + .ol-depth-2>li.active:before, + .ol-depth-3>li.active:before, + .ol-depth-4>li.active:before, + .ol-depth-5>li.active:before, + .ol-depth-6>li.active:before { + background: var(--the-before-color, var(--wp--preset--color--key-2)); + transition: background-color 0.3s ease-in-out; + } + + &.mone-is-scroll-animation { + &.has-before-deactivate-color { + li:not(.active):before { + background: var(--the-before-deactivate-color); + } + } + &:not(.has-before-deactivate-color) li:not(.active):before { + background: color-mix(in srgb, var(--the-before-color, var(--wp--preset--color--key-2)) 40%, #fff); + } + } + + &:not(.mone-is-scroll-animation) { + &:not(.has-before-deactivate-color) li:not(.active):before { + background: var(--the-before-color, var(--wp--preset--color--key-2)); + } + } + + .ol-depth-1>li:before { width: 12px; height: 12px; @@ -138,19 +154,36 @@ } } - &.has-circle-color { + &.mone-is-scroll-animation:not(.has-deactivate-text-color) { + li:not(.active) { + > a { + color: color-mix(in srgb, currentColor 60%, #fff); + } + } + } + + &.has-before-color { ol li { &::before { - color: var(--the-circle-color, var(--wp--preset--color--key-2)); + color: var(--the-before-color, var(--wp--preset--color--key-2)); } } } - &.has-deactivate-text-color { + &.mone-is-scroll-animation.has-deactivate-text-color { li:not(.active) { > a { color: var(--the-deactivate-text-color,var(--wp--preset--color--content-contrast-2)); } } } + + &.mone-is-scroll-animation.has-before-deactivate-color { + ol li:not(.active) { + &::before { + color: var(--the-before-deactivate-color, var(--wp--preset--color--key-2)); + } + } + } + } \ No newline at end of file diff --git a/src/block-library/table-of-contents/variations.js b/src/block-library/table-of-contents/variations.js index 57cb968..67ca556 100644 --- a/src/block-library/table-of-contents/variations.js +++ b/src/block-library/table-of-contents/variations.js @@ -16,24 +16,23 @@ const isSiteEditor = getPath( window.location.href )?.includes( const variations = [ { name: 'mone-default-toc', - title: __( 'Table of contents', 'block-library' ), - attributes: { - className: 'is-style-mone-default-toc', - }, + title: __( 'Table of contents', 'mone' ), + attributes: {}, innerBlocks: [], icon: blockCategoryIcon, - scope: [ 'inserter', 'transform' ], + scope: [ 'inserter' ], isDefault: true, }, { name: 'side-toc', - title: __( 'ドット', 'block-library' ), + title: __( '目次(ドット)', 'mone' ), attributes: { - className: 'is-style-mone-side-toc', + maxHeight: '80vh', + className: 'mone-is-scroll-animation is-style-mone-default-toc', }, innerBlocks: [], icon: blockCategoryIcon, - scope: [ isSiteEditor && 'inserter', 'transform' ], + scope: [ isSiteEditor && 'inserter' ], }, ]; diff --git a/src/block-library/table-of-contents/view/scroll.js b/src/block-library/table-of-contents/view/scroll.js index a617887..c797446 100644 --- a/src/block-library/table-of-contents/view/scroll.js +++ b/src/block-library/table-of-contents/view/scroll.js @@ -30,7 +30,7 @@ export function handleScroll( headings, tocContainers ) { const isTocFullyVisible = tocRect.top >= 0 && tocRect.bottom <= window.innerHeight; - links.forEach( ( link ) => { + links.forEach( ( link, index ) => { const listItem = link.parentElement; listItem.classList.remove( 'active' ); if ( listItem.classList.length === 0 ) { @@ -44,11 +44,36 @@ export function handleScroll( headings, tocContainers ) { activeFound = true; if ( isTocFullyVisible && - tocContainer.classList.contains( 'sidebar' ) && + tocContainer.classList.contains( + 'mone-is-scroll-animation' + ) && tocContainer.classList.contains( 'has-max-height' ) && window.innerWidth >= 781 ) { - listItem.scrollIntoView( { block: 'nearest' } ); + const listItemRect = listItem.getBoundingClientRect(); + const tocContainerRect = + tocContainer.getBoundingClientRect(); + + if ( index === 0 ) { + // 先頭にスクロール + tocContainer.scrollTop = 0; + } else if ( index === links.length - 1 ) { + // 最下部にスクロール + tocContainer.scrollTop = tocContainer.scrollHeight; + } else if ( listItemRect.top < tocContainerRect.top ) { + // 通常のスクロール（上方向） + tocContainer.scrollTop -= + tocContainerRect.top - listItemRect.top; + } else if ( + listItemRect.bottom > tocContainerRect.bottom + ) { + // 通常のスクロール（下方向） + tocContainer.scrollTop += + listItemRect.bottom - tocContainerRect.bottom; + } else { + // 通常のスクロール + listItem.scrollIntoView( { block: 'nearest' } ); + } } } } ); From 73585e1d093714c619a2b9e90bc79f61ec26201b Mon Sep 17 00:00:00 2001 From: shimotmk Date: Mon, 23 Dec 2024 21:04:44 +0900 Subject: [PATCH 09/23] up --- src/block-library/table-of-contents/view/toc.js | 13 ++++--------- 1 file changed, 4 insertions(+), 9 deletions(-) diff --git a/src/block-library/table-of-contents/view/toc.js b/src/block-library/table-of-contents/view/toc.js index 9eb0610..231a335 100644 --- a/src/block-library/table-of-contents/view/toc.js +++ b/src/block-library/table-of-contents/view/toc.js @@ -1,4 +1,5 @@ import { handleScroll } from './scroll.js'; +/* global IntersectionObserver */ export function assignHeadingIds( headings, idMap ) { headings.forEach( ( heading ) => { @@ -7,7 +8,9 @@ export function assignHeadingIds( headings, idMap ) { heading.textContent.trim().toLowerCase().replace( /\s+/g, '-' ); if ( ! heading.id ) { idMap.set( id, ( idMap.get( id ) || 0 ) + 1 ); - if ( idMap.get( id ) > 1 ) id += `-${ idMap.get( id ) }`; + if ( idMap.get( id ) > 1 ) { + id += `-${ idMap.get( id ) }`; + } heading.id = id; } } ); @@ -47,14 +50,6 @@ export function generateTableOfContents( tocContainers, headings ) { tocContainer.appendChild( tocList ); - // 目次エリアのスクロールイベントを制御 - // tocContainer.addEventListener( 'wheel', ( event ) => { - // if ( tocContainer.matches( ':hover' ) ) { - // event.preventDefault(); - // tocContainer.scrollTop += event.deltaY; - // } - // } ); - // activeクラスが存在しない場合は最初のliをactiveにする const activeItems = tocContainer.querySelectorAll( 'li.active' ); if ( activeItems.length === 0 ) { From 44331110e8555fe17e8499e25bc53e6b1d2e6421 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Mon, 23 Dec 2024 21:09:01 +0900 Subject: [PATCH 10/23] up --- src/block-library/table-of-contents/index.php | 37 +++++++++---------- 1 file changed, 17 insertions(+), 20 deletions(-) diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index 1cc210b..83c26f1 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -12,29 +12,29 @@ } /** - * table of contents render callback + * Table of contents render callback * * @param array $attributes Block attributes. * @return string */ function table_of_contents_render_callback( $attributes ) { - $max_height = $attributes['maxHeight'] ?? false; - $deactivate_text_color = isset( $attributes['deactivateTextColor'] ) ? $attributes['deactivateTextColor'] : null; - $custom_deactivate_textColor = isset( $attributes['customDeactivateTextColor'] ) ? $attributes['customDeactivateTextColor'] : null; - $before_color = isset( $attributes['beforeColor'] ) ? $attributes['beforeColor'] : null; - $custom_before_color = isset( $attributes['customBeforeColor'] ) ? $attributes['customBeforeColor'] : null; - $before_deactivate_color = isset( $attributes['beforeDeactivateColor'] ) ? $attributes['beforeDeactivateColor'] : null; - $custom_before_deactivate_color = isset( $attributes['customBeforeDeactivateColor'] ) ? $attributes['customBeforeDeactivateColor'] : null; - $line_color = isset( $attributes['lineColor'] ) ? $attributes['lineColor'] : null; - $custom_line_color = isset( $attributes['customLineColor'] ) ? $attributes['customLineColor'] : null; - $class_name = $attributes['className'] ?? ''; - $class_array = explode( ' ', $class_name ); + $max_height = $attributes['maxHeight'] ?? false; + $deactivate_text_color = isset( $attributes['deactivateTextColor'] ) ? $attributes['deactivateTextColor'] : null; + $custom_deactivate_text_color = isset( $attributes['customDeactivateTextColor'] ) ? $attributes['customDeactivateTextColor'] : null; + $before_color = isset( $attributes['beforeColor'] ) ? $attributes['beforeColor'] : null; + $custom_before_color = isset( $attributes['customBeforeColor'] ) ? $attributes['customBeforeColor'] : null; + $before_deactivate_color = isset( $attributes['beforeDeactivateColor'] ) ? $attributes['beforeDeactivateColor'] : null; + $custom_before_deactivate_color = isset( $attributes['customBeforeDeactivateColor'] ) ? $attributes['customBeforeDeactivateColor'] : null; + $line_color = isset( $attributes['lineColor'] ) ? $attributes['lineColor'] : null; + $custom_line_color = isset( $attributes['customLineColor'] ) ? $attributes['customLineColor'] : null; + $class_name = $attributes['className'] ?? ''; + $class_array = explode( ' ', $class_name ); $classes = array(); $style_attribute = ''; if ( ! in_array( 'is-style-mone-default-toc', $class_array, true ) ) { - $classes[] = 'mone-toc'; - } + $classes[] = 'mone-toc'; + } if ( $max_height ) { $classes[] = 'has-max-height'; $style_attribute .= 'max-height:' . $max_height . '; overflow-y: auto;'; @@ -44,11 +44,11 @@ function table_of_contents_render_callback( $attributes ) { $classes[] = 'has-deactivate-text-color'; $style_attribute .= '--the-deactivate-text-color:var(--wp--preset--color--' . $deactivate_text_color . ');'; } - if ( ! empty( $custom_deactivate_textColor ) ) { + if ( ! empty( $custom_deactivate_text_color ) ) { $classes[] = 'has-deactivate-text-color'; - $style_attribute .= '--the-deactivate-text-color:' . $custom_deactivate_textColor . ';'; + $style_attribute .= '--the-deactivate-text-color:' . $custom_deactivate_text_color . ';'; } - } + } if ( ! empty( $before_color ) ) { $classes[] = 'has-before-color'; $style_attribute .= '--the-before-color:var(--wp--preset--color--' . $before_color . ');'; @@ -101,9 +101,6 @@ function register_block_table_of_contents() { array( 'name' => 'mone-default-toc', 'label' => __( 'Mone table of contents', 'mone' ), - 'style_data' => array( - 'css' => '', - ), ) ); From e5dab8d7d232b396324786eefdcb10ce46dea260 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Mon, 23 Dec 2024 21:20:15 +0900 Subject: [PATCH 11/23] format --- src/block-library/table-of-contents/index.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index 83c26f1..b439512 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -99,8 +99,8 @@ function register_block_table_of_contents() { register_block_style( 'mone/table-of-contents', array( - 'name' => 'mone-default-toc', - 'label' => __( 'Mone table of contents', 'mone' ), + 'name' => 'mone-default-toc', + 'label' => __( 'Mone table of contents', 'mone' ), ) ); From 440bcfdbe732a3ba11bcb7feb0365964fdf1db4e Mon Sep 17 00:00:00 2001 From: shimotmk Date: Mon, 23 Dec 2024 21:43:57 +0900 Subject: [PATCH 12/23] up --- src/block-library/table-of-contents/edit.js | 24 +++++++++---------- .../table-of-contents/variations.js | 2 +- 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 7a4c712..6818635 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -218,7 +218,7 @@ function TableOfContentEdit( props ) {
            2. { __( - '目次エディター プレビュー H2見出し', + 'Table of Contents Editor Preview H2 Heading', 'mone' ) } @@ -226,7 +226,7 @@ function TableOfContentEdit( props ) {
            3. { __( - '目次エディター プレビュー H3見出し', + 'Table of Contents Editor Preview H3 Heading', 'mone' ) } @@ -234,7 +234,7 @@ function TableOfContentEdit( props ) {
            4. { __( - '目次エディター プレビュー H3見出し', + 'Table of Contents Editor Preview H3 Heading', 'mone' ) } @@ -244,7 +244,7 @@ function TableOfContentEdit( props ) {
            5. { __( - '目次エディター プレビュー H2見出し', + 'Table of Contents Editor Preview H2 Heading', 'mone' ) } @@ -252,7 +252,7 @@ function TableOfContentEdit( props ) {
            6. { __( - '目次エディター プレビュー H3見出し', + 'Table of Contents Editor Preview H3 Heading', 'mone' ) } @@ -260,7 +260,7 @@ function TableOfContentEdit( props ) {
            7. { __( - '目次エディター プレビュー H4見出し', + 'Table of Contents Editor Preview H4 Heading', 'mone' ) } @@ -268,7 +268,7 @@ function TableOfContentEdit( props ) {
            8. { __( - '目次エディター プレビュー H5見出し', + 'Table of Contents Editor Preview H5 Heading', 'mone' ) } @@ -282,7 +282,7 @@ function TableOfContentEdit( props ) {
            9. { __( - '目次エディター プレビュー H3見出し', + 'Table of Contents Editor Preview H3 Heading', 'mone' ) } @@ -290,7 +290,7 @@ function TableOfContentEdit( props ) {
            10. { __( - '目次エディター プレビュー H4見出し', + 'Table of Contents Editor Preview H4 Heading', 'mone' ) } @@ -298,7 +298,7 @@ function TableOfContentEdit( props ) {
            11. { __( - '目次エディター プレビュー H5見出し', + 'Table of Contents Editor Preview H5 Heading', 'mone' ) } @@ -312,7 +312,7 @@ function TableOfContentEdit( props ) {
            12. { __( - '目次エディター プレビュー H2見出し', + 'Table of Contents Editor Preview H2 Heading', 'mone' ) } @@ -320,7 +320,7 @@ function TableOfContentEdit( props ) {
            13. { __( - '目次エディター プレビュー H3見出し', + 'Table of Contents Editor Preview H3 Heading', 'mone' ) } diff --git a/src/block-library/table-of-contents/variations.js b/src/block-library/table-of-contents/variations.js index 67ca556..af0ad35 100644 --- a/src/block-library/table-of-contents/variations.js +++ b/src/block-library/table-of-contents/variations.js @@ -25,7 +25,7 @@ const variations = [ }, { name: 'side-toc', - title: __( '目次(ドット)', 'mone' ), + title: __( 'Table of Contents (dot)', 'mone' ), attributes: { maxHeight: '80vh', className: 'mone-is-scroll-animation is-style-mone-default-toc', From db2bf91c7bef55e8f4a882b8bf1d07da9cf42157 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Tue, 24 Dec 2024 13:10:23 +0900 Subject: [PATCH 13/23] position --- src/block-editor/position/index.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/block-editor/position/index.js b/src/block-editor/position/index.js index 52ecca4..83ea79f 100644 --- a/src/block-editor/position/index.js +++ b/src/block-editor/position/index.js @@ -49,7 +49,10 @@ function addInspectorControls( BlockEdit ) { if ( ( style?.position?.type === 'sticky' || style?.position?.type === 'fixed' ) && - style?.position?.top === undefined + style?.position?.top === undefined && + style?.position?.left === undefined && + style?.position?.right === undefined && + style?.position?.bottom === undefined ) { const newStyle = { ...style, From 703fc78c20de9630438459485fd1762fd533ad1f Mon Sep 17 00:00:00 2001 From: shimotmk Date: Tue, 24 Dec 2024 21:52:12 +0900 Subject: [PATCH 14/23] up --- .../table-of-contents/block.json | 3 - src/block-library/table-of-contents/edit.js | 31 +------- src/block-library/table-of-contents/index.php | 5 +- .../table-of-contents/style.scss | 11 +++ .../view/calculate-height.js | 75 +++++++++++++++++++ .../table-of-contents/view/index.js | 6 ++ .../table-of-contents/view/scroll.js | 1 - 7 files changed, 97 insertions(+), 35 deletions(-) create mode 100644 src/block-library/table-of-contents/view/calculate-height.js diff --git a/src/block-library/table-of-contents/block.json b/src/block-library/table-of-contents/block.json index a5ccaef..005de21 100644 --- a/src/block-library/table-of-contents/block.json +++ b/src/block-library/table-of-contents/block.json @@ -29,9 +29,6 @@ }, "customLineColor": { "type": "string" - }, - "maxHeight": { - "type": "string" } }, "supports": { diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 6818635..08c15db 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -9,7 +9,6 @@ import { import { InspectorControls, useBlockProps, - HeightControl, withColors, __experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown, __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients, @@ -38,7 +37,7 @@ function TableOfContentEdit( props ) { lineColor, setLineColor, } = props; - const { maxHeight, className } = attributes; + const { className } = attributes; const classArray = classStringToClassArray( className ); const hasDefaultTocStyle = classArray.includes( 'is-style-mone-default-toc' @@ -47,7 +46,6 @@ function TableOfContentEdit( props ) { const blockProps = useBlockProps( { className: clsx( { - [ `has-max-height` ]: maxHeight, [ `has-deactivate-text-color` ]: existsClass( className, scrollAnimationClassName ) && !! deactivateTextColor.color, @@ -59,8 +57,9 @@ function TableOfContentEdit( props ) { [ `mone-toc` ]: ! hasDefaultTocStyle, } ), style: { - maxHeight, - overflowY: maxHeight ? 'auto' : undefined, + overflowY: existsClass( className, scrollAnimationClassName ) + ? 'auto' + : undefined, '--the-deactivate-text-color': existsClass( className, scrollAnimationClassName ) && ( !! deactivateTextColor?.slug @@ -191,28 +190,6 @@ function TableOfContentEdit( props ) { disableCustomGradients /> - - maxHeight !== undefined } - label={ __( 'Max height', 'mone' ) } - onDeselect={ () => - setAttributes( { maxHeight: undefined } ) - } - isShownByDefault={ true } - panelId={ clientId } - resetAllFilter={ () => { - setAttributes( { maxHeight: undefined } ); - } } - > - - setAttributes( { maxHeight: value } ) - } - /> - -
              1. diff --git a/src/block-library/table-of-contents/index.php b/src/block-library/table-of-contents/index.php index b439512..fe42703 100644 --- a/src/block-library/table-of-contents/index.php +++ b/src/block-library/table-of-contents/index.php @@ -35,11 +35,8 @@ function table_of_contents_render_callback( $attributes ) { if ( ! in_array( 'is-style-mone-default-toc', $class_array, true ) ) { $classes[] = 'mone-toc'; } - if ( $max_height ) { - $classes[] = 'has-max-height'; - $style_attribute .= 'max-height:' . $max_height . '; overflow-y: auto;'; - } if ( in_array( 'mone-is-scroll-animation', $class_array, true ) ) { + $style_attribute .= 'overflow-y: auto;'; if ( ! empty( $deactivate_text_color ) ) { $classes[] = 'has-deactivate-text-color'; $style_attribute .= '--the-deactivate-text-color:var(--wp--preset--color--' . $deactivate_text_color . ');'; diff --git a/src/block-library/table-of-contents/style.scss b/src/block-library/table-of-contents/style.scss index 734f78e..f91ba4a 100644 --- a/src/block-library/table-of-contents/style.scss +++ b/src/block-library/table-of-contents/style.scss @@ -22,6 +22,17 @@ font-size: var(--wp--preset--font-size--medium); } + >li:first-child > a{ + &:first-child { + margin-top: 0; + } + } + >li:last-child a{ + &:last-child { + margin-bottom: 0; + } + } + ol li a { font-weight: 400; font-size: var(--wp--preset--font-size--small); diff --git a/src/block-library/table-of-contents/view/calculate-height.js b/src/block-library/table-of-contents/view/calculate-height.js new file mode 100644 index 0000000..217ca45 --- /dev/null +++ b/src/block-library/table-of-contents/view/calculate-height.js @@ -0,0 +1,75 @@ +/* global getComputedStyle */ + +export const calculateHeight = ( tocContainers ) => { + tocContainers.forEach( ( tocContainer ) => { + if ( tocContainer.classList.contains( 'mone-is-scroll-animation' ) ) { + const stickyParent = tocContainer.closest( '.is-position-sticky' ); + if ( stickyParent ) { + const stickyParentStyle = + window.getComputedStyle( stickyParent ); + const paddingTop = + parseFloat( stickyParentStyle.paddingTop ) || 0; + const paddingBottom = + parseFloat( stickyParentStyle.paddingBottom ) || 0; + const top = parseFloat( stickyParentStyle.top ) || 0; + const gap = parseFloat( stickyParentStyle.gap ) || 0; + + const otherElementsHeight = Array.from( stickyParent.children ) + .filter( ( child ) => child !== tocContainer ) + .reduce( ( total, child ) => { + const childStyle = window.getComputedStyle( child ); + const childHeight = + child.getBoundingClientRect().height; + const marginTop = + parseFloat( childStyle.marginTop ) || 0; + const marginBottom = + parseFloat( childStyle.marginBottom ) || 0; + const childBorderTop = + parseFloat( childStyle.borderTopWidth ) || 0; + const childBorderBottom = + parseFloat( childStyle.borderBottomWidth ) || 0; + return ( + total + + childHeight + + marginTop + + marginBottom + + gap + + childBorderTop + + childBorderBottom + ); + }, 0 ); + + const tocStyle = window.getComputedStyle( tocContainer ); + const tocPaddingTop = parseFloat( tocStyle.paddingTop ) || 0; + const tocPaddingBottom = + parseFloat( tocStyle.paddingBottom ) || 0; + const tocBorderTop = parseFloat( tocStyle.borderTopWidth ) || 0; + const tocBorderBottom = + parseFloat( tocStyle.borderBottomWidth ) || 0; + + const adminBarOffset = + parseFloat( + getComputedStyle( + document.documentElement + ).getPropertyValue( + '--wp-admin--admin-bar--position-offset' + ) + ) || 0; + + const availableHeight = + window.innerHeight - + stickyParent.getBoundingClientRect().top - + paddingTop - + paddingBottom - + otherElementsHeight - + tocPaddingTop - + tocPaddingBottom - + tocBorderTop - + tocBorderBottom - + 2 * top + + adminBarOffset; + tocContainer.style.maxHeight = `calc(${ availableHeight }px + ( var(--wp-admin--admin-bar--position-offset, 0px) * 2 ) )`; + } + } + } ); +}; diff --git a/src/block-library/table-of-contents/view/index.js b/src/block-library/table-of-contents/view/index.js index 7226b3e..b2e72ff 100644 --- a/src/block-library/table-of-contents/view/index.js +++ b/src/block-library/table-of-contents/view/index.js @@ -4,6 +4,7 @@ import { setupIntersectionObserver, } from './toc.js'; import { hideElementsWithClass } from './hide-element'; +import { calculateHeight } from './calculate-height'; document.addEventListener( 'DOMContentLoaded', () => { // Get the entry content element @@ -29,8 +30,13 @@ document.addEventListener( 'DOMContentLoaded', () => { return; } + calculateHeight( tocContainers ); + window.addEventListener( 'resize', () => calculateHeight( tocContainers ) ); + window.addEventListener( 'scroll', () => calculateHeight( tocContainers ) ); + const idMap = new Map(); assignHeadingIds( headings, idMap ); generateTableOfContents( tocContainers, headings ); setupIntersectionObserver( tocContainers, headings ); + } ); diff --git a/src/block-library/table-of-contents/view/scroll.js b/src/block-library/table-of-contents/view/scroll.js index c797446..4984683 100644 --- a/src/block-library/table-of-contents/view/scroll.js +++ b/src/block-library/table-of-contents/view/scroll.js @@ -47,7 +47,6 @@ export function handleScroll( headings, tocContainers ) { tocContainer.classList.contains( 'mone-is-scroll-animation' ) && - tocContainer.classList.contains( 'has-max-height' ) && window.innerWidth >= 781 ) { const listItemRect = listItem.getBoundingClientRect(); From 0e4c3775d8691323ca7161464b208e2940e99d43 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Wed, 25 Dec 2024 08:09:07 +0900 Subject: [PATCH 15/23] up --- .../view/calculate-height.js | 21 +++++++------------ 1 file changed, 7 insertions(+), 14 deletions(-) diff --git a/src/block-library/table-of-contents/view/calculate-height.js b/src/block-library/table-of-contents/view/calculate-height.js index 217ca45..556aeaf 100644 --- a/src/block-library/table-of-contents/view/calculate-height.js +++ b/src/block-library/table-of-contents/view/calculate-height.js @@ -3,7 +3,9 @@ export const calculateHeight = ( tocContainers ) => { tocContainers.forEach( ( tocContainer ) => { if ( tocContainer.classList.contains( 'mone-is-scroll-animation' ) ) { - const stickyParent = tocContainer.closest( '.is-position-sticky' ); + const stickyParent = tocContainer.closest( + '.is-position-sticky, .is-position-fixed' + ); if ( stickyParent ) { const stickyParentStyle = window.getComputedStyle( stickyParent ); @@ -40,6 +42,7 @@ export const calculateHeight = ( tocContainers ) => { }, 0 ); const tocStyle = window.getComputedStyle( tocContainer ); + const tocMarginTop = parseFloat( tocStyle.marginTop ) || 0; const tocPaddingTop = parseFloat( tocStyle.paddingTop ) || 0; const tocPaddingBottom = parseFloat( tocStyle.paddingBottom ) || 0; @@ -47,28 +50,18 @@ export const calculateHeight = ( tocContainers ) => { const tocBorderBottom = parseFloat( tocStyle.borderBottomWidth ) || 0; - const adminBarOffset = - parseFloat( - getComputedStyle( - document.documentElement - ).getPropertyValue( - '--wp-admin--admin-bar--position-offset' - ) - ) || 0; - const availableHeight = window.innerHeight - - stickyParent.getBoundingClientRect().top - paddingTop - paddingBottom - otherElementsHeight - + tocMarginTop - tocPaddingTop - tocPaddingBottom - tocBorderTop - tocBorderBottom - - 2 * top + - adminBarOffset; - tocContainer.style.maxHeight = `calc(${ availableHeight }px + ( var(--wp-admin--admin-bar--position-offset, 0px) * 2 ) )`; + 2 * top; + tocContainer.style.maxHeight = `calc(${ availableHeight }px + ( var(--wp-admin--admin-bar--position-offset, 0px) ) )`; } } } ); From 0a9e3e5b0b3aa5ade796cb2f3632aa60d569ac8a Mon Sep 17 00:00:00 2001 From: shimotmk Date: Wed, 25 Dec 2024 22:29:48 +0900 Subject: [PATCH 16/23] up --- src/block-library/table-of-contents/view/calculate-height.js | 2 -- src/block-library/table-of-contents/view/index.js | 1 - 2 files changed, 3 deletions(-) diff --git a/src/block-library/table-of-contents/view/calculate-height.js b/src/block-library/table-of-contents/view/calculate-height.js index 556aeaf..59f4e10 100644 --- a/src/block-library/table-of-contents/view/calculate-height.js +++ b/src/block-library/table-of-contents/view/calculate-height.js @@ -1,5 +1,3 @@ -/* global getComputedStyle */ - export const calculateHeight = ( tocContainers ) => { tocContainers.forEach( ( tocContainer ) => { if ( tocContainer.classList.contains( 'mone-is-scroll-animation' ) ) { diff --git a/src/block-library/table-of-contents/view/index.js b/src/block-library/table-of-contents/view/index.js index b2e72ff..249a348 100644 --- a/src/block-library/table-of-contents/view/index.js +++ b/src/block-library/table-of-contents/view/index.js @@ -38,5 +38,4 @@ document.addEventListener( 'DOMContentLoaded', () => { assignHeadingIds( headings, idMap ); generateTableOfContents( tocContainers, headings ); setupIntersectionObserver( tocContainers, headings ); - } ); From e83cc50d4ecef27f302bc4d52909a91c6fd26b75 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Thu, 26 Dec 2024 20:52:35 +0900 Subject: [PATCH 17/23] up --- src/block-hook/group/style.scss | 6 ++++++ src/block-library/table-of-contents/view/index.js | 2 +- theme.json | 3 ++- 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/block-hook/group/style.scss b/src/block-hook/group/style.scss index c3e5837..47ab065 100644 --- a/src/block-hook/group/style.scss +++ b/src/block-hook/group/style.scss @@ -62,5 +62,11 @@ .wp-block-group.mone_wrap-on-mobile.is-layout-grid { grid-template-columns: 1fr; column-gap: 0; + + // とても細くした時に横スクロールするのを防ぐ + // https://coliss.com/articles/build-websites/operation/css/minimum-content-size-in-css-grid.html + > * { + min-width: 0; + } } } diff --git a/src/block-library/table-of-contents/view/index.js b/src/block-library/table-of-contents/view/index.js index 249a348..490c90e 100644 --- a/src/block-library/table-of-contents/view/index.js +++ b/src/block-library/table-of-contents/view/index.js @@ -25,7 +25,7 @@ document.addEventListener( 'DOMContentLoaded', () => { // Get all headings in the entry content const headings = entryContent.querySelectorAll( 'h2, h3, h4, h5, h6' ); - if ( headings.length === 0 ) { + if ( headings.length < 2 ) { hideElementsWithClass( 'mone-toc-none' ); return; } diff --git a/theme.json b/theme.json index 5de2e86..1a8642c 100644 --- a/theme.json +++ b/theme.json @@ -597,7 +597,8 @@ "border": { "color": "var(--wp--preset--color--mone-border)", "width": "1px" - } + }, + "css": "& .wp-block-search__inside-wrapper { padding: 0; }" }, "core/site-tagline": { "color": { From 1575f1cb0b8964a6dffadb1487711a2f4de98f87 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Thu, 26 Dec 2024 21:04:53 +0900 Subject: [PATCH 18/23] up --- src/block-library/table-of-contents/edit.js | 80 ++++++++++++--------- 1 file changed, 45 insertions(+), 35 deletions(-) diff --git a/src/block-library/table-of-contents/edit.js b/src/block-library/table-of-contents/edit.js index 08c15db..8a1d51b 100644 --- a/src/block-library/table-of-contents/edit.js +++ b/src/block-library/table-of-contents/edit.js @@ -13,6 +13,7 @@ import { __experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown, __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients, } from '@wordpress/block-editor'; +import { getPath } from '@wordpress/url'; import { classStringToClassArray, @@ -22,6 +23,10 @@ import { } from '../../utils-func/class-name/classAttribute.js'; import { useToolsPanelDropdownMenuProps } from '../../utils-func/use-tools-panel-dropdown'; +const isSiteEditor = getPath( window.location.href )?.includes( + 'site-editor.php' +); + function TableOfContentEdit( props ) { const dropdownMenuProps = useToolsPanelDropdownMenuProps(); const { @@ -81,50 +86,55 @@ function TableOfContentEdit( props ) { return ( <> - - { - deleteClass( - scrollAnimationClassName, - className, - setAttributes - ); - } } - dropdownMenuProps={ dropdownMenuProps } - > - - existsClass( className, scrollAnimationClassName ) - } - onDeselect={ () => + { isSiteEditor && ( + + { deleteClass( scrollAnimationClassName, className, setAttributes - ) - } + ); + } } + dropdownMenuProps={ dropdownMenuProps } > - { - setClassName( + isShownByDefault + hasValue={ () => + existsClass( + className, + scrollAnimationClassName + ) + } + onDeselect={ () => + deleteClass( scrollAnimationClassName, className, setAttributes - ); - } } - __nextHasNoMarginBottom - /> - - - + ) + } + > + { + setClassName( + scrollAnimationClassName, + className, + setAttributes + ); + } } + __nextHasNoMarginBottom + /> + + + + ) } Date: Thu, 26 Dec 2024 21:10:02 +0900 Subject: [PATCH 19/23] fix --- src/block-library/table-of-contents/variations.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/block-library/table-of-contents/variations.js b/src/block-library/table-of-contents/variations.js index af0ad35..d48c9ea 100644 --- a/src/block-library/table-of-contents/variations.js +++ b/src/block-library/table-of-contents/variations.js @@ -25,9 +25,8 @@ const variations = [ }, { name: 'side-toc', - title: __( 'Table of Contents (dot)', 'mone' ), + title: __( 'Sidebar Table of Contents', 'mone' ), attributes: { - maxHeight: '80vh', className: 'mone-is-scroll-animation is-style-mone-default-toc', }, innerBlocks: [], From b2acae561b4af6c30073520cd152655a96861015 Mon Sep 17 00:00:00 2001 From: shimotmk Date: Thu, 26 Dec 2024 21:22:53 +0900 Subject: [PATCH 20/23] up --- src/block-editor/position/index.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/block-editor/position/index.js b/src/block-editor/position/index.js index 83ea79f..365f066 100644 --- a/src/block-editor/position/index.js +++ b/src/block-editor/position/index.js @@ -134,10 +134,11 @@ function addInspectorControls( BlockEdit ) { label: __( 'Sticky', 'mone' ), value: 'sticky', }, - { - label: __( 'Fixed', 'mone' ), - value: 'fixed', - }, + // fixedはtocで調整が必要 + // { + // label: __( 'Fixed', 'mone' ), + // value: 'fixed', + // }, ] } /> From 7230fc0ca4b77e4b149bc62a599075e85a27ab7c Mon Sep 17 00:00:00 2001 From: shimotmk Date: Fri, 27 Dec 2024 04:54:41 +0900 Subject: [PATCH 21/23] =?UTF-8?q?=E7=BF=BB=E8=A8=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- languages/ja.l10n.php | 2 +- languages/ja.mo | Bin 27252 -> 28574 bytes languages/ja.po | 87 +++++++++++++ ...e-ja-b3219700b482574310e9f3d466c763fd.json | 2 +- languages/mone.pot | 120 +++++++++++++++--- 5 files changed, 189 insertions(+), 22 deletions(-) diff --git a/languages/ja.l10n.php b/languages/ja.l10n.php index 7acafdd..33ba167 100644 --- a/languages/ja.l10n.php +++ b/languages/ja.l10n.php @@ -1,2 +1,2 @@ 'mone','plural-forms'=>NULL,'language'=>'ja','project-id-version'=>'Mone 0.0.19','pot-creation-date'=>'2024-10-26T05:32:38+00:00','po-revision-date'=>'2024-11-30 18:18+0900','x-generator'=>'Poedit 3.5','messages'=>['Mone'=>'Mone','https://mone-wp.com'=>'https://mone-wp.com','WordPress theme for mone.'=>'WordPressテーマ Mone.','Tomoki Shimomura'=>'しもむら ともき','URL copied!'=>'URLがコピーされました!','Copy to clipboard'=>'クリップボードにコピー','Code copied!'=>'コードをコピーしました!','Copied'=>'コピーしました','Plane'=>'プレーン','Mone Option Overrides'=>'Mone オプションのオーバーライド','Mone List'=>'Mone リスト','Once you create a template part, you can select it in the mega menu..'=>'テンプレートパーツを作成するとメガメニューで選択できます。','Menu'=>'メニュー','Mone Settings'=>'Mone設定','Icon URL'=>'アイコンURL','Select an image'=>'画像を選択する','delete'=>'削除','Activate'=>'アクティベーション','User email is required.'=>'メールアドレスは必須です。','User email saved successfully.'=>'メールアドレスを保存しました。','Saved'=>'保存されました','An error has occurred'=>'エラーが発生しました','Activate Mone'=>'Mone アクティベート','Email Address'=>'メールアドレス','Activate Code'=>'コードを有効化する','Please enter a valid email address'=>'有効なメールアドレスを入力してください','Mone blocks'=>'Mone blocks',404=>'404','Mega menu'=>'Mega menu','Label for the copyright placeholder in the editor© YEAR'=>'© YEAR','%1$s %2$s'=>'%1$s, %2$s','Home'=>'ホーム','Category'=>'カテゴリー','Custom Link'=>'カスタムリンク','Mone User Authenticationhas not been completed. Version update functionality is limited.'=>'Moneユーザー認証が完了していません。バージョンアップデート機能が制限されてます。','Mone user authenticationhas not been completed. If your email address and the authentication URL on yourMy Pageare correct, anauthentication checkplease perform '=>'Moneユーザー認証が完了していません。メールアドレスとマイページの認証URLが正しい場合は認証チェックを行なってください','Pattern titleAlert Red'=>'アラート レッド','Pattern descriptionAdd Alert Red.'=>'アラートレッドを追加する.','Write your text here!'=>'こんにちは、ここに文章を書きましょう！','Pattern titlecomments'=>'コメント','Pattern titlefooter'=>'フッター','About me!'=>'About me!','Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text'=>'プロフィール テキスト プロフィール テキスト プロフィール テキスト プロフィール テキスト','Portfolio'=>'Portfolio','List１'=>'リスト1','List２'=>'リスト2','List３'=>'リスト3','List４'=>'リスト4','List５'=>'リスト5','Created by'=>'Created by','WordPress theme Mone logo'=>'WordPressテーマMoneロゴ','Copyright'=>'Copyright','All Rights Reserved.'=>'All Rights Reserved.','Pattern titleHeader row'=>'ヘッダー 横並び','Written by Mone Creators'=>'Written by Mone Creators','Pattern titleHidden 404'=>'404','Pattern description404 page template'=>'404ページテンプレート','Service 1'=>'サービス 1','List 1'=>'リスト 1','List 2'=>'リスト 2','List 3'=>'リスト 3','List 4'=>'リスト 4','Service 2'=>'サービス 2','Service 3'=>'サービス 3','Service 4'=>'サービス 4','This page could not be found.'=>'ページが見つかりませんでした。','Pattern titleHidden No Results Content'=>'非表示の結果なしコンテンツ','Message explaining that there are no results returned from a searchSorry, but nothing matched your search terms. Please try again with some different keywords.'=>'申し訳ありませんが、検索条件に一致するものはありません。 別のキーワードでもう一度お試しください。','Search'=>'検索','Search for...'=>'検索...','Pattern titleMega menu'=>'メガメニュー','Pattern descriptionmenu'=>'メニュー','Pattern titleLatest Articles'=>'最新記事','New Posts'=>'新着記事','Pattern titlePost Foot Meta'=>'投稿フットメタ','Pattern titlePost Head Meta'=>'投稿ヘッドメタ','Last Updated'=>'更新日','Pattern titleRelated Posts'=>'関連記事','Related Posts'=>'関連記事','Pattern titlesidebar'=>'サイドバー','Mone Creators'=>'Mone Creators','Most Read Articles'=>'よく読まれている記事','Archive'=>'Archive','Pattern titleSNS Menu'=>'SNSメニュー','Pattern descriptionAdd SNS Box Menu.'=>'SNSボックスメニューを追加。','Pattern titleSNS share buttons simple'=>'シンプルなSNSシェアボタン','Pattern descriptionAdd SNS share buttons.'=>'SNSシェアボタンを追加します。','Pattern titleSNS share buttons'=>'SNSシェアボタン','Pattern titleList of posts, 1 column'=>'投稿のリスト、1コラム','Pattern descriptionA list of posts, 1 column, with featured image and post date.'=>'投稿のリスト、1 列、アイキャッチ画像と投稿日。','Please add text or a block to display when the query returns no results.'=>'クエリが結果を返さないときに表示するテキストまたはブロックを追加してください。','No results found'=>'記事が見つかりませんでした','Pattern titlePickup article'=>'ピックアップ記事','Previous Post'=>'前のページ','Next Post'=>'次のページ','user email saved successfully'=>'ユーザーメールアドレスを保存しました','An error occurred while saving the user email.'=>'ユーザーのメールを保存中にエラーが発生しました。','Mone Activation Settings'=>'Mone アクティベート設定','Step 1'=>'ステップ１','Register the domain you want to authenticate on your Mone My Page'=>'Moneマイページで認証したいドメインを登録する','Mone Mypage'=>'Moneマイページ','Please register the following domains'=>'で以下のドメインを登録してください','Copied!'=>'コピー完了!','Copy'=>'コピー','Step 2'=>'ステップ２','Mone user Enter your email address'=>'Moneユーザー メールアドレスを入力','Enter your Mone user email address below and save'=>'以下にMoneユーザーのメールアドレスを入力して保存してください','Save'=>'保存','Step 3'=>'ステップ３','Authentication Check'=>'認証チェック','If you press the button below and no alert appears, authentication is complete.'=>'以下のボタンを押してアラートが出なければ認証完了です。','Check authentication'=>'認証チェック','Using the selector, it can be rewritten to a block-specific class.'=>'selectorを使用して、ブロック固有のクラスに書き換えることができます。','Additional CSS'=>'追加CSS','Hide settings'=>'非表示設定','Media Query'=>'メディアクエリー','Hide on PC'=>'PC 非表示','Hide on mobile'=>'モバイル 非表示','Post Type'=>'投稿タイプ','Hide on %s'=>'%s 非表示','Table Of Contents'=>'目次','Hide if no table of contents'=>'目次がない場合は非表示','Position'=>'位置','Type'=>'タイプ','Default'=>'デフォルト','Sticky'=>'張り付き','Fixed'=>'固定','Top'=>'上','Right'=>'右','Bottom'=>'下','Left'=>'左','Unlock content only'=>'コンテンツ ロック 解除','Lock content only'=>'コンテンツ ロック','Archives List Unstyled'=>'アーカイブ リストスタイルなし','None'=>'なし','Facebook'=>'Facebook','X'=>'X','Hatena'=>'はてな','Pocket'=>'Pocket','LINE'=>'LINE','Share Settings'=>'共有設定','Share Button Provider'=>'シェアボタン種類','Add image'=>'画像を新規追加','Click animation image'=>'アニメーション画像をクリック','Code Settings'=>'コード設定','Code Language'=>'コード言語','Height'=>'高さ','Pattern titleAmazon Rakuten product card'=>'Amazon 楽天商品 カード','Pattern descriptionThis block is ideal for showcasing products from Amazon and Rakuten.'=>'Amazon,楽天の商品紹介用カードです。','Product name'=>'製品名','View on Amazon'=>'Amazonで見る','View on Kindle'=>'Kindleで見る','View on Rakuten'=>'楽天で見る','Fold backwards on mobile'=>'モバイルで逆順に並べる','Mark as nofollow'=>'nofollow をマーク','Hover Background'=>'ホバー背景','Link'=>'リンク','Applause Button'=>'拍手ボタン','Applause button and counter that can be pressed multiple times without logging in'=>'ログインせずに複数回押せる拍手ボタンとカウンター','Hand'=>'ハンド','Balloon'=>'吹き出し','Balloon icon'=>'吹き出しアイコン','Hello, write your sentence here!'=>'こんにちは、ここに文章を書きましょう！','Box Menu'=>'ボックスメニュー','Vertical layout on mobile'=>'モバイルでは縦に並べる','List style none'=>'リストスタイルなし','スタイル'=>'スタイル','チェック'=>'チェック','info'=>'情報','Mone prefix suffix'=>'Mone接頭辞','Horizontal scrolling'=>'横スクロール','Scroll Snap'=>'スクロールスナップ','Snap placement'=>'スナップ配置','Recommend an odd number of columns for snap scrolling.'=>'スナップスクロールのカラム数は奇数がおすすめです。','Tags'=>'タグ','Pre scrollable'=>'スクロール可能','Next Article'=>'次の記事','Previous article'=>'前の記事','Include Posts'=>'ピックアップ記事','Post Ids'=>'投稿IDs','Example: 1,4,7'=>'例: 1,4,7','*Please enter with commas.'=>'*カンマ区切りで入力してください。','Shows the most read articles'=>'最も読まれた記事を表示します','Related articles'=>'関連記事','Displays random articles from the same category as the post.'=>'投稿と同じカテゴリの記事をランダムに表示します。','Pick Up Articles'=>'ピックアップ記事','Display the selected article.'=>'選択した記事を表示します。','You cannot select multiple cells from different sections.'=>'異なるセクションから複数のセルを選択することはできません。','Merging and splitting cells'=>'セルの結合と分割','Merge Cells'=>'セルの結合','Split Cell'=>'セルを分割','The cell was repaired'=>'セルは修復されました','No cells to repair'=>'修復するセルはありません','Repairing broken cells'=>'壊れたセルの修復','Clear Selection'=>'選択を解除','Link to URL'=>'URLへのリンク','Link to home page'=>'トップページへのリンク','Choose a pattern. The original block settings will be cleared.'=>'パターンを選択します。元のブロック設定がクリアされます。','Blog card'=>'ブログカード','Top image'=>'トップ画像','Please set your Github token.'=>'Githubトークンを設定してください。','If the data is old, please clear the cache. It is usually updated every day.'=>'データが古い場合はキャッシュをクリアしてください。自動で毎日更新されます。','GitHub Code Embed'=>'GitHubコード埋め込み','Paste the permalink of the Github code you want to display on your site.'=>'サイトに表示したいGithubコードのパーマリンクを貼り付けます。','example :'=>'例:','Size'=>'サイズ','Icon Color'=>'アイコンカラー','Hover background Color'=>'ホバー背景色','Link to page'=>'ページヘリンク','Clear cache'=>'キャッシュクリア','If the data is old, please clear the cache. It is usually updated every hour.'=>'データが古い場合は、キャッシュをクリアしてください。通常、1時間ごとに更新されます。','Menu Template'=>'メニューテンプレート','Edit'=>'編集','Create a template part'=>'テンプレート パーツの作成','Click to open'=>'クリックで開く','Mega menu link text'=>'メガメニューリンクのテキスト','Mega menu label'=>'メガメニューラベル','Variation Name'=>'バリエーション名','%s switcher item'=>'%sスイッチャーアイテム','Current'=>'現在','Mone Default'=>'Moneデフォルト','Blue'=>'Blue','Dark'=>'Dark','Green'=>'Green','White'=>'White','More Information'=>'詳細情報','Learn More'=>'さらに詳しく','Settings'=>'設定','Style variation settings'=>'スタイルバリエーションの設定','VariationOption'=>'バリエーションオプション','Defaults'=>'デフォルト','white'=>'白','isToggle'=>'トグル','Max height'=>'最大の高さ','Mone post settings'=>'Mone投稿設定','Display eye-catcher on the page'=>'アイキャッチ画像を表示する','Display SNS Share Button on the page'=>'SNSシェアボタンを表示する','Display Date on the page'=>'日付を表示する','Inline font size'=>'インライン文字サイズ','Inline Font Size'=>'インライン文字サイズ','Icon not found.'=>'アイコンが見つかりません。','Inline Icon'=>'インラインアイコン','Icon'=>'アイコン','Add NO IMAGE'=>'NO IMAGEを追加','Default NO IMAGE'=>'デフォルト NO IMAGE','NO IMAGE'=>'NO IMAGE 画像','GitHub Token'=>'GitHubトークン','You can get a GitHub token from your GitHub account settings. This token is used to increase the number of requests to the GitHub API.'=>'GitHubアカウント設定からGitHubトークンを取得できます。このトークンは、GitHubAPIへのリクエスト数を増やすために使用されます。','https://mone-wp.com/get-github-token/'=>'https://mone-wp.com/get-github-token/','Site settings'=>'サイト設定','Show NO IMAGE in query'=>'クエリーでNO IMAGEを表示','Show NO IMAGE on the page'=>'ページでNO IMAGEを表示','Display eye-catching template'=>'アイキャッチテンプレートを表示','User Settings'=>'ユーザー設定','Eye-catching template'=>'アイキャッチテンプレート','Mone settings'=>'Mone 設定','This setting is immediately saved to the database.'=>'この設定はすぐにデータベースに保存されます。','Post author name'=>'投稿者名','Post Title'=>'投稿タイトル','Setting'=>'設定','Site title'=>'サイトのタイトル','Logo not found'=>'ロゴが見つかりません','Icon not found'=>'アイコンが見つかりません','Upload & Eye-Catch Updated'=>'アップロード & アイキャッチが更新されました','Upload & Update Eyecatcher'=>'アップロード & アイキャッチを更新','Custom thumbnail %s'=>'カスタムアイキャッチ%s','Article Title'=>'記事のタイトル','Preview Article Title'=>'記事タイトルのプレビュー','Debug Mode'=>'デバッグモード','Changes saved'=>'変更を保存しました','Featured Template:Save Changes'=>'アイキャッチ テンプレート:変更を保存','Featured image Templates'=>'アイキャッチテンプレート','Custom Thumbnail Templates'=>'カスタムアイキャッチテンプレート','Group'=>'グループ','Add a background image'=>'背景画像を追加する','Background Image'=>'背景画像','Set background image'=>'背景画像の設定','* Recommended size: 1200px wide, 630px tall'=>'*推奨サイズ:幅1200px、高さ630px','You can customize it from the eye-catching template.'=>'アイキャッチテンプレートからカスタマイズできます。','Mega menu label…'=>'メガメニューラベル…','Select Icon'=>'アイコンを選択','block titleEmbed Excerpt'=>'抜粋を埋め込む','block descriptionShows an excerpt retrieved from a URL.'=>'URL から取得した抜粋が表示されます。','block titleEmbed Featured Image'=>'アイキャッチ画像を埋め込む','block descriptionDisplays the featured image obtained from the URL.'=>'URLから取得したアイキャッチ画像を表示します。','block titleEmbed Site Logo'=>'サイトロゴの埋め込み','block descriptionDisplays the site logo image obtained from the URL.'=>'URLから取得したサイトのロゴ画像を表示します。','block titleEmbed Site Title'=>'サイトタイトルを埋め込む','block descriptionDisplays the site title obtained from the URL.'=>'URL から取得したサイトのタイトルが表示されます。','block titleEmbed Title'=>'タイトルを埋め込む','block descriptionDisplays the title obtained from the URL.'=>'URL から取得したタイトルが表示されます。','block titleEmbed'=>'埋め込み','block descriptionAdd a block that fetches and displays content from a URL.'=>'URL からコンテンツを取得して表示するブロックを追加します。','block titleGitHub Code Embed'=>'Githubコード埋め込み','block descriptionView the code via the Github code permalink.'=>'Github のコードパーマリンクからコードを表示します。','block titleIcon child'=>'アイコン要素','block descriptionIcons with configurable colors and links.'=>'カラーやリンクが設定できるアイコン。','block titleIcons'=>'アイコン','block descriptionAccentuate your website with icon groups with configurable colors and links.'=>'カラーやリンクが設定できるアイコングループでWebサイトにアクセントをつけましょう。','block titleMega Menu'=>'メガメニュー','block descriptionMega Menu'=>'メガメニュー','block titleTheme Styles switcher item'=>'テーマスタイルスイッチャーアイテム','block descriptionTheme Styles switcher item'=>'テーマスタイルスイッチャーアイテム','block titleTheme Styles switcher'=>'テーマスタイルスイッチャー','block descriptionTheme Styles switcher'=>'テーマスタイルスイッチャー','block titleGroup'=>'グループ','block titlesatori wrapper'=>'satori wrapper','block descriptionGroup'=>'グループ','block titlePost Author Icon'=>'投稿作成者アイコン','block titleAuthor Name'=>'投稿者名','block titlesatori post-author-name'=>'satori post-author-name','block descriptionpost-author-name'=>'投稿者名','block titleTitle'=>'タイトル','block descriptionpost-title'=>'投稿タイトル','block titleSite Logo'=>'サイトロゴ','block titleSite Title'=>'サイトタイトル','block titlesatori site-title'=>'satori site-title','block descriptionsite-title'=>'サイトタイトル','block titleCustom Thumbnail'=>'カスタムアイキャッチ','Style variation nameBlue'=>'Blue','Color nameKey'=>'キー','Color nameKey / Two'=>'キー/ 2','Color nameMain Background'=>'メイン背景','Color nameContent Background'=>'コンテンツエリア 背景','Color nameKey Contrast'=>'キーコントラスト','Color nameKey / Two contrast'=>'キー/2コントラスト','Color nameContent Contrast'=>'コンテンツ コントラスト','Color nameContent Contrast / Two'=>'コンテンツコントラスト/ 2','Color nameContent Contrast / Three'=>'コンテンツコントラスト / 3','Color nameLink Color'=>'リンク色','Color nameLink Hover Color'=>'リンクホバー色','Color nameHading Background'=>'見出し背景','Color nameList Background'=>'リスト背景','Color nameQuote Background'=>'引用 背景','Color nameBorder'=>'枠線','Duotone nameKey'=>'キー','Style variation nameDark'=>'Dark','Style variation nameGreen'=>'Green','Style variation nameWhite'=>'White','Custom template nameblank'=>'ブランク','Custom template nameThin one column'=>'ワンカラム スリム','Custom template nameWide one column'=>'ワンカラム ワイド','Custom template nameHeader & Footer'=>'ヘッダー&フッターのみ','Custom template name404'=>'404','Gradient nameBlack'=>'黒','Gradient nameSilver'=>'シルバー','Gradient nameBronze'=>'ブロンズ','Gradient nameGold'=>'ゴールド','Aspect ratio nameOptimize OGP 1.91:1'=>'OGP 1.91:1','Space size name1'=>'1','Space size name2'=>'2','Space size name3'=>'3','Space size name4'=>'4','Space size name5'=>'5','Space size name6'=>'6','Font family nameSystem Font'=>'System Font','Font family nameNoto Sans'=>'Noto Sans JP','Font family nameA-OTF Shin Go Pro'=>'A-OTF Shin Go Pro','Font family nameicomoon'=>'icomoon','Font family nameCode'=>'コード','Template part nameHeader'=>'ヘッダー','Template part nameFooter'=>'フッター','Template part nameSidebar'=>'サイドバー','Template part nameComments'=>'コメント','Template part namePost meta'=>'投稿のメタ情報','Template part nameQuery'=>'クエリ','Template part nameMenu'=>'メニュー']]; \ No newline at end of file +return ['domain'=>'mone','plural-forms'=>NULL,'language'=>'ja','project-id-version'=>'Mone 0.0.19','pot-creation-date'=>'2024-10-26T05:32:38+00:00','po-revision-date'=>'2024-11-30 18:18+0900','x-generator'=>'Poedit 3.5','messages'=>['Mone'=>'Mone','https://mone-wp.com'=>'https://mone-wp.com','WordPress theme for mone.'=>'WordPressテーマ Mone.','Tomoki Shimomura'=>'しもむら ともき','URL copied!'=>'URLがコピーされました!','Copy to clipboard'=>'クリップボードにコピー','Code copied!'=>'コードをコピーしました!','Copied'=>'コピーしました','Plane'=>'プレーン','Mone Option Overrides'=>'Mone オプションのオーバーライド','Mone List'=>'Mone リスト','Once you create a template part, you can select it in the mega menu..'=>'テンプレートパーツを作成するとメガメニューで選択できます。','Menu'=>'メニュー','Mone table of contents'=>'Mone 目次','Mone Settings'=>'Mone設定','Icon URL'=>'アイコンURL','Select an image'=>'画像を選択する','delete'=>'削除','Activate'=>'アクティベーション','User email is required.'=>'メールアドレスは必須です。','User email saved successfully.'=>'メールアドレスを保存しました。','Saved'=>'保存されました','An error has occurred'=>'エラーが発生しました','Activate Mone'=>'Mone アクティベート','Email Address'=>'メールアドレス','Activate Code'=>'コードを有効化する','Please enter a valid email address'=>'有効なメールアドレスを入力してください','Mone blocks'=>'Mone blocks',404=>'404','Mega menu'=>'Mega menu','Label for the copyright placeholder in the editor© YEAR'=>'© YEAR','%1$s %2$s'=>'%1$s, %2$s','Home'=>'ホーム','Category'=>'カテゴリー','Custom Link'=>'カスタムリンク','Mone User Authenticationhas not been completed. Version update functionality is limited.'=>'Moneユーザー認証が完了していません。バージョンアップデート機能が制限されてます。','Mone user authenticationhas not been completed. If your email address and the authentication URL on yourMy Pageare correct, anauthentication checkplease perform '=>'Moneユーザー認証が完了していません。メールアドレスとマイページの認証URLが正しい場合は認証チェックを行なってください','Pattern titleAlert Red'=>'アラート レッド','Pattern descriptionAdd Alert Red.'=>'アラートレッドを追加する.','Write your text here!'=>'こんにちは、ここに文章を書きましょう！','Pattern titlecomments'=>'コメント','Pattern titlefooter'=>'フッター','About me!'=>'About me!','Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text Profile text'=>'プロフィール テキスト プロフィール テキスト プロフィール テキスト プロフィール テキスト','Portfolio'=>'Portfolio','List１'=>'リスト1','List２'=>'リスト2','List３'=>'リスト3','List４'=>'リスト4','List５'=>'リスト5','Created by'=>'Created by','WordPress theme Mone logo'=>'WordPressテーマMoneロゴ','Copyright'=>'Copyright','All Rights Reserved.'=>'All Rights Reserved.','Pattern titleHeader row'=>'ヘッダー 横並び','Written by Mone Creators'=>'Written by Mone Creators','Pattern titleHidden 404'=>'404','Pattern description404 page template'=>'404ページテンプレート','Service 1'=>'サービス 1','List 1'=>'リスト 1','List 2'=>'リスト 2','List 3'=>'リスト 3','List 4'=>'リスト 4','Service 2'=>'サービス 2','Service 3'=>'サービス 3','Service 4'=>'サービス 4','This page could not be found.'=>'ページが見つかりませんでした。','Pattern titleHidden No Results Content'=>'非表示の結果なしコンテンツ','Message explaining that there are no results returned from a searchSorry, but nothing matched your search terms. Please try again with some different keywords.'=>'申し訳ありませんが、検索条件に一致するものはありません。 別のキーワードでもう一度お試しください。','Search'=>'検索','Search for...'=>'検索...','Pattern titleMega menu'=>'メガメニュー','Pattern descriptionmenu'=>'メニュー','Pattern titleLatest Articles'=>'最新記事','New Posts'=>'新着記事','Pattern titlePost Foot Meta'=>'投稿フットメタ','Pattern titlePost Head Meta'=>'投稿ヘッドメタ','Last Updated'=>'更新日','Pattern titleRelated Posts'=>'関連記事','Related Posts'=>'関連記事','Pattern titlesidebar'=>'サイドバー','Mone Creators'=>'Mone Creators','Most Read Articles'=>'よく読まれている記事','Archive'=>'Archive','Pattern titleSNS Menu'=>'SNSメニュー','Pattern descriptionAdd SNS Box Menu.'=>'SNSボックスメニューを追加。','Pattern titleSNS share buttons simple'=>'シンプルなSNSシェアボタン','Pattern descriptionAdd SNS share buttons.'=>'SNSシェアボタンを追加します。','Pattern titleSNS share buttons'=>'SNSシェアボタン','Pattern titleList of posts, 1 column'=>'投稿のリスト、1コラム','Pattern descriptionA list of posts, 1 column, with featured image and post date.'=>'投稿のリスト、1 列、アイキャッチ画像と投稿日。','Please add text or a block to display when the query returns no results.'=>'クエリが結果を返さないときに表示するテキストまたはブロックを追加してください。','No results found'=>'記事が見つかりませんでした','Pattern titlePickup article'=>'ピックアップ記事','Previous Post'=>'前のページ','Next Post'=>'次のページ','user email saved successfully'=>'ユーザーメールアドレスを保存しました','An error occurred while saving the user email.'=>'ユーザーのメールを保存中にエラーが発生しました。','Mone Activation Settings'=>'Mone アクティベート設定','Step 1'=>'ステップ１','Register the domain you want to authenticate on your Mone My Page'=>'Moneマイページで認証したいドメインを登録する','Mone Mypage'=>'Moneマイページ','Please register the following domains'=>'で以下のドメインを登録してください','Copied!'=>'コピー完了!','Copy'=>'コピー','Step 2'=>'ステップ２','Mone user Enter your email address'=>'Moneユーザー メールアドレスを入力','Enter your Mone user email address below and save'=>'以下にMoneユーザーのメールアドレスを入力して保存してください','Save'=>'保存','Step 3'=>'ステップ３','Authentication Check'=>'認証チェック','If you press the button below and no alert appears, authentication is complete.'=>'以下のボタンを押してアラートが出なければ認証完了です。','Check authentication'=>'認証チェック','Using the selector, it can be rewritten to a block-specific class.'=>'selectorを使用して、ブロック固有のクラスに書き換えることができます。','Additional CSS'=>'追加CSS','Hide settings'=>'非表示設定','Media Query'=>'メディアクエリー','Hide on PC'=>'PC 非表示','Hide on mobile'=>'モバイル 非表示','Post Type'=>'投稿タイプ','Hide on %s'=>'%s 非表示','Table Of Contents'=>'目次','block descriptionA table of contents is automatically created by retrieving headings from the content.A preview is displayed in the editor.'=>'コンテンツから見出しを取得して目次を自動的に作成します。プレビューはエディターに表示されます。','Hide if no table of contents'=>'目次がない場合は非表示','Position'=>'位置','Type'=>'タイプ','Default'=>'デフォルト','Sticky'=>'張り付き','Fixed'=>'固定','Top'=>'上','Right'=>'右','Bottom'=>'下','Left'=>'左','Unlock content only'=>'コンテンツ ロック 解除','Lock content only'=>'コンテンツ ロック','Archives List Unstyled'=>'アーカイブ リストスタイルなし','None'=>'なし','Facebook'=>'Facebook','X'=>'X','Hatena'=>'はてな','Pocket'=>'Pocket','LINE'=>'LINE','Share Settings'=>'共有設定','Share Button Provider'=>'シェアボタン種類','Add image'=>'画像を新規追加','Click animation image'=>'アニメーション画像をクリック','Code Settings'=>'コード設定','Code Language'=>'コード言語','Height'=>'高さ','Pattern titleAmazon Rakuten product card'=>'Amazon 楽天商品 カード','Pattern descriptionThis block is ideal for showcasing products from Amazon and Rakuten.'=>'Amazon,楽天の商品紹介用カードです。','Product name'=>'製品名','View on Amazon'=>'Amazonで見る','View on Kindle'=>'Kindleで見る','View on Rakuten'=>'楽天で見る','Fold backwards on mobile'=>'モバイルで逆順に並べる','Mark as nofollow'=>'nofollow をマーク','Hover Background'=>'ホバー背景','Link'=>'リンク','Applause Button'=>'拍手ボタン','Applause button and counter that can be pressed multiple times without logging in'=>'ログインせずに複数回押せる拍手ボタンとカウンター','Hand'=>'ハンド','Balloon'=>'吹き出し','Balloon icon'=>'吹き出しアイコン','Hello, write your sentence here!'=>'こんにちは、ここに文章を書きましょう！','Box Menu'=>'ボックスメニュー','Vertical layout on mobile'=>'モバイルでは縦に並べる','List style none'=>'リストスタイルなし','スタイル'=>'スタイル','チェック'=>'チェック','info'=>'情報','Mone prefix suffix'=>'Mone接頭辞','Horizontal scrolling'=>'横スクロール','Scroll Snap'=>'スクロールスナップ','Snap placement'=>'スナップ配置','Recommend an odd number of columns for snap scrolling.'=>'スナップスクロールのカラム数は奇数がおすすめです。','Tags'=>'タグ','Pre scrollable'=>'スクロール可能','Next Article'=>'次の記事','Previous article'=>'前の記事','Include Posts'=>'ピックアップ記事','Post Ids'=>'投稿IDs','Example: 1,4,7'=>'例: 1,4,7','*Please enter with commas.'=>'*カンマ区切りで入力してください。','Shows the most read articles'=>'最も読まれた記事を表示します','Related articles'=>'関連記事','Displays random articles from the same category as the post.'=>'投稿と同じカテゴリの記事をランダムに表示します。','Pick Up Articles'=>'ピックアップ記事','Display the selected article.'=>'選択した記事を表示します。','You cannot select multiple cells from different sections.'=>'異なるセクションから複数のセルを選択することはできません。','Merging and splitting cells'=>'セルの結合と分割','Merge Cells'=>'セルの結合','Split Cell'=>'セルを分割','The cell was repaired'=>'セルは修復されました','No cells to repair'=>'修復するセルはありません','Repairing broken cells'=>'壊れたセルの修復','Clear Selection'=>'選択を解除','Link to URL'=>'URLへのリンク','Link to home page'=>'トップページへのリンク','Choose a pattern. The original block settings will be cleared.'=>'パターンを選択します。元のブロック設定がクリアされます。','Blog card'=>'ブログカード','Top image'=>'トップ画像','Please set your Github token.'=>'Githubトークンを設定してください。','If the data is old, please clear the cache. It is usually updated every day.'=>'データが古い場合はキャッシュをクリアしてください。自動で毎日更新されます。','GitHub Code Embed'=>'GitHubコード埋め込み','Paste the permalink of the Github code you want to display on your site.'=>'サイトに表示したいGithubコードのパーマリンクを貼り付けます。','example :'=>'例:','Size'=>'サイズ','Icon Color'=>'アイコンカラー','Hover background Color'=>'ホバー背景色','Link to page'=>'ページヘリンク','Clear cache'=>'キャッシュクリア','If the data is old, please clear the cache. It is usually updated every hour.'=>'データが古い場合は、キャッシュをクリアしてください。通常、1時間ごとに更新されます。','Menu Template'=>'メニューテンプレート','Edit'=>'編集','Create a template part'=>'テンプレート パーツの作成','Click to open'=>'クリックで開く','Mega menu link text'=>'メガメニューリンクのテキスト','Mega menu label'=>'メガメニューラベル','Variation Name'=>'バリエーション名','%s switcher item'=>'%sスイッチャーアイテム','Current'=>'現在','Mone Default'=>'Moneデフォルト','Blue'=>'Blue','Dark'=>'Dark','Green'=>'Green','White'=>'White','Scroll animation'=>'スクロールアニメーション','Circle Color'=>'サークル カラー','Number Color'=>'ナンバー カラー','Deactivate text Color'=>'非活性テキストカラー','Circle deactivate Color'=>'サークル非活性カラー','Number deactivate Color'=>'ナンバー非活性カラー','Line Color'=>'ラインカラー','Table of Contents Editor Preview H2 Heading'=>'目次エディタプレビュー H2 見出し','Table of Contents Editor Preview H3 Heading'=>'目次エディタプレビュー H3 見出し','Table of Contents Editor Preview H4 Heading'=>'目次エディタプレビュー H4 見出し','Table of Contents Editor Preview H5 Heading'=>'目次エディタプレビュー H5 見出し','Table of contents'=>'目次','More Information'=>'詳細情報','Learn More'=>'さらに詳しく','Settings'=>'設定','Style variation settings'=>'スタイルバリエーションの設定','VariationOption'=>'バリエーションオプション','Defaults'=>'デフォルト','white'=>'白','isToggle'=>'トグル','Max height'=>'最大の高さ','Mone post settings'=>'Mone投稿設定','Display eye-catcher on the page'=>'アイキャッチ画像を表示する','Display SNS Share Button on the page'=>'SNSシェアボタンを表示する','Display Date on the page'=>'日付を表示する','Inline font size'=>'インライン文字サイズ','Inline Font Size'=>'インライン文字サイズ','Icon not found.'=>'アイコンが見つかりません。','Inline Icon'=>'インラインアイコン','Icon'=>'アイコン','Add NO IMAGE'=>'NO IMAGEを追加','Default NO IMAGE'=>'デフォルト NO IMAGE','NO IMAGE'=>'NO IMAGE 画像','GitHub Token'=>'GitHubトークン','You can get a GitHub token from your GitHub account settings. This token is used to increase the number of requests to the GitHub API.'=>'GitHubアカウント設定からGitHubトークンを取得できます。このトークンは、GitHubAPIへのリクエスト数を増やすために使用されます。','https://mone-wp.com/get-github-token/'=>'https://mone-wp.com/get-github-token/','Site settings'=>'サイト設定','Show NO IMAGE in query'=>'クエリーでNO IMAGEを表示','Show NO IMAGE on the page'=>'ページでNO IMAGEを表示','Display eye-catching template'=>'アイキャッチテンプレートを表示','User Settings'=>'ユーザー設定','Eye-catching template'=>'アイキャッチテンプレート','Mone settings'=>'Mone 設定','This setting is immediately saved to the database.'=>'この設定はすぐにデータベースに保存されます。','Post author name'=>'投稿者名','Post Title'=>'投稿タイトル','Setting'=>'設定','Site title'=>'サイトのタイトル','Logo not found'=>'ロゴが見つかりません','Icon not found'=>'アイコンが見つかりません','Upload & Eye-Catch Updated'=>'アップロード & アイキャッチが更新されました','Upload & Update Eyecatcher'=>'アップロード & アイキャッチを更新','Custom thumbnail %s'=>'カスタムアイキャッチ%s','Article Title'=>'記事のタイトル','Preview Article Title'=>'記事タイトルのプレビュー','Debug Mode'=>'デバッグモード','Changes saved'=>'変更を保存しました','Featured Template:Save Changes'=>'アイキャッチ テンプレート:変更を保存','Featured image Templates'=>'アイキャッチテンプレート','Custom Thumbnail Templates'=>'カスタムアイキャッチテンプレート','Group'=>'グループ','Add a background image'=>'背景画像を追加する','Background Image'=>'背景画像','Set background image'=>'背景画像の設定','* Recommended size: 1200px wide, 630px tall'=>'*推奨サイズ:幅1200px、高さ630px','You can customize it from the eye-catching template.'=>'アイキャッチテンプレートからカスタマイズできます。','Mega menu label…'=>'メガメニューラベル…','Select Icon'=>'アイコンを選択','block titleEmbed Excerpt'=>'抜粋を埋め込む','block descriptionShows an excerpt retrieved from a URL.'=>'URL から取得した抜粋が表示されます。','block titleEmbed Featured Image'=>'アイキャッチ画像を埋め込む','block descriptionDisplays the featured image obtained from the URL.'=>'URLから取得したアイキャッチ画像を表示します。','block titleEmbed Site Logo'=>'サイトロゴの埋め込み','block descriptionDisplays the site logo image obtained from the URL.'=>'URLから取得したサイトのロゴ画像を表示します。','block titleEmbed Site Title'=>'サイトタイトルを埋め込む','block descriptionDisplays the site title obtained from the URL.'=>'URL から取得したサイトのタイトルが表示されます。','block titleEmbed Title'=>'タイトルを埋め込む','block descriptionDisplays the title obtained from the URL.'=>'URL から取得したタイトルが表示されます。','block titleEmbed'=>'埋め込み','block descriptionAdd a block that fetches and displays content from a URL.'=>'URL からコンテンツを取得して表示するブロックを追加します。','block titleGitHub Code Embed'=>'Githubコード埋め込み','block descriptionView the code via the Github code permalink.'=>'Github のコードパーマリンクからコードを表示します。','block titleIcon child'=>'アイコン要素','block descriptionIcons with configurable colors and links.'=>'カラーやリンクが設定できるアイコン。','block titleIcons'=>'アイコン','block descriptionAccentuate your website with icon groups with configurable colors and links.'=>'カラーやリンクが設定できるアイコングループでWebサイトにアクセントをつけましょう。','block titleMega Menu'=>'メガメニュー','block descriptionMega Menu'=>'メガメニュー','block titleTheme Styles switcher item'=>'テーマスタイルスイッチャーアイテム','block descriptionTheme Styles switcher item'=>'テーマスタイルスイッチャーアイテム','block titleTheme Styles switcher'=>'テーマスタイルスイッチャー','block descriptionTheme Styles switcher'=>'テーマスタイルスイッチャー','block titleGroup'=>'グループ','block titlesatori wrapper'=>'satori wrapper','block descriptionGroup'=>'グループ','block titlePost Author Icon'=>'投稿作成者アイコン','block titleAuthor Name'=>'投稿者名','block titlesatori post-author-name'=>'satori post-author-name','block descriptionpost-author-name'=>'投稿者名','block titleTitle'=>'タイトル','block descriptionpost-title'=>'投稿タイトル','block titleSite Logo'=>'サイトロゴ','block titleSite Title'=>'サイトタイトル','block titlesatori site-title'=>'satori site-title','block descriptionsite-title'=>'サイトタイトル','block titleCustom Thumbnail'=>'カスタムアイキャッチ','Style variation nameBlue'=>'Blue','Color nameKey'=>'キー','Color nameKey / Two'=>'キー/ 2','Color nameMain Background'=>'メイン背景','Color nameContent Background'=>'コンテンツエリア 背景','Color nameKey Contrast'=>'キーコントラスト','Color nameKey / Two contrast'=>'キー/2コントラスト','Color nameContent Contrast'=>'コンテンツ コントラスト','Color nameContent Contrast / Two'=>'コンテンツコントラスト/ 2','Color nameContent Contrast / Three'=>'コンテンツコントラスト / 3','Color nameLink Color'=>'リンク色','Color nameLink Hover Color'=>'リンクホバー色','Color nameHading Background'=>'見出し背景','Color nameList Background'=>'リスト背景','Color nameQuote Background'=>'引用 背景','Color nameBorder'=>'枠線','Duotone nameKey'=>'キー','Style variation nameDark'=>'Dark','Style variation nameGreen'=>'Green','Style variation nameWhite'=>'White','Custom template nameblank'=>'ブランク','Custom template nameThin one column'=>'ワンカラム スリム','Custom template nameWide one column'=>'ワンカラム ワイド','Custom template nameHeader & Footer'=>'ヘッダー&フッターのみ','Custom template name404'=>'404','Gradient nameBlack'=>'黒','Gradient nameSilver'=>'シルバー','Gradient nameBronze'=>'ブロンズ','Gradient nameGold'=>'ゴールド','Aspect ratio nameOptimize OGP 1.91:1'=>'OGP 1.91:1','Space size name1'=>'1','Space size name2'=>'2','Space size name3'=>'3','Space size name4'=>'4','Space size name5'=>'5','Space size name6'=>'6','Font family nameSystem Font'=>'System Font','Font family nameNoto Sans'=>'Noto Sans JP','Font family nameA-OTF Shin Go Pro'=>'A-OTF Shin Go Pro','Font family nameicomoon'=>'icomoon','Font family nameCode'=>'コード','Template part nameHeader'=>'ヘッダー','Template part nameFooter'=>'フッター','Template part nameSidebar'=>'サイドバー','Template part nameComments'=>'コメント','Template part namePost meta'=>'投稿のメタ情報','Template part nameQuery'=>'クエリ','Template part nameMenu'=>'メニュー']]; \ No newline at end of file diff --git a/languages/ja.mo b/languages/ja.mo index b2f08ddc674c752386f9291ce247ea36911c241e..ec62792e44343188098c0043f44a413fdbd69b14 100644 GIT binary patch delta 9304 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 WR15T%jY Date: Sun, 29 Dec 2024 20:26:56 +0900 Subject: [PATCH 22/23] readme --- readme.txt | 1 + 1 file changed, 1 insertion(+) diff --git a/readme.txt b/readme.txt index e05715b..0f07e25 100644 --- a/readme.txt +++ b/readme.txt @@ -12,6 +12,7 @@ License URI: http://www.gnu.org/licenses/gpl-2.0.html = 1.3.0 = +- Added Table of Contents block - Added heading plane style = 1.2.0 = 2024-12-09 From 03718582c474aa6b171e25e7449e28476e18a2ca Mon Sep 17 00:00:00 2001 From: shimotmk Date: Sun, 29 Dec 2024 20:28:12 +0900 Subject: [PATCH 23/23] up --- readme.txt | 1 + 1 file changed, 1 insertion(+) diff --git a/readme.txt b/readme.txt index 0f07e25..757e830 100644 --- a/readme.txt +++ b/readme.txt @@ -14,6 +14,7 @@ License URI: http://www.gnu.org/licenses/gpl-2.0.html - Added Table of Contents block - Added heading plane style +- Added Position UI = 1.2.0 = 2024-12-09