跳到内容
新问题

对这个项目有疑问吗?注册一个免费的GitHub帐户以打开一个问题,并联系其维护者和社区。

点击“注册GitHub”,即表示您同意我们的服务条款隐私声明。我们偶尔会向您发送与帐户相关的电子邮件。

已经在GitHub上了?登录到您的帐户

添加网格交互 #59052

已合并
将20个提交合并到
2024年2月23日
已合并

添加网格交互 #59052

将20个提交合并到
2024年2月23日

对话

吵闹声
复制链接
成员

@吵闹声 吵闹声 评论2024年2月15日

什么?

添加新的“网格交互性”实验,并在此功能标志后面添加新的功能,使用户可以:

  • 单击网格块,查看项目放置位置的虚线轮廓。(网格可视化工具)
  • 单击网格块中的项目,然后使用拖曳手柄设置列和行跨度。(GridItemResizer(网格项大小调整器))

为什么?

#57478

怎么用?

  • 网格可视化工具
    • 与现有的非常相似边距可视化工具填充可视化工具.
    • 选择栅格块或其子块之一时渲染。
    • 使用获取计算样式确定计算的网格模板并使用此设置包含虚线边框的框的布局。
  • GridItemResizer(网格项大小调整器)

测试说明

  1. 启用网格交互实验
  2. 插入网格块
  3. 选择网格块或其子块之一
  4. 全力以赴

屏幕截图或屏幕广播

卡普图2024-02-15,流速10.00.24.mp4

@吵闹声 吵闹声补充【类型】技术原型 提供对想法的技术探索,作为可能的示例 [功能]布局 布局块支持、其UI控件和样式输出。标签2024年2月15日
复制链接

github-操作 机器人程序 评论2024年2月15日

尺寸变化:+1.02千字节(0%)

总大小:1.7 MB

文件名 大小 更改
build/block-editor/index.min.js 250千字节 +841亿(0%)
build/block-editor/style-rtl.css 15.4千字节 +90亿(+1%)
构建/块编辑器/样式.css 15.4千字节 +89亿(+1%)
ℹ️查看未更改
文件名 大小
构建/a11y/index.min.js 955亿
build/annotations/index.min.js 2.69千字节
构建/api-fetch/index.min.js 2.32千字节
构建/auto/index.min.js 2.1千字节
build/blob/index.min.js 578亿
build/block-directory/index.min.js 7.22千字节
构建/块目录/样式-rtl.css 1.02千字节
构建/块目录/样式.css 1.02千字节
build/block-editor/content-rtl.css 4.35千字节
构建/块编辑器/content.css 4.35千字节
构建/块编辑器/默认编辑器样式-rtl.css 381亿
构建/块编辑器/默认编辑器样式.css 381亿
build/block-library/blocks/archives/editor-rtl.css 61亿
构建/块库/blocks/archives/editor.css 60亿
build/block-library/blocks/archives/style-rtl.css 90亿
build/block-library/blocks/archives/style.css 90亿
build/block-library/blocks/audio/editor-rtl.css 150亿
build/block-library/blocks/audio/editor.css 150亿
build/block-library/blocks/audio/style-rtl.css 122亿
build/block-library/blocks/audio/style.css 122亿
构建/block-library/blocks/audio/theme-rtl.css 126亿
构建/block-library/blocks/audio/theme.css 126亿
build/block-library/blocks/avatar/editor-rtl.css 116亿
build/block-library/blocks/avatar/editor.css 116亿
build/block-library/blocks/avatar/style-rtl.css 104亿
build/block-library/blocks/avatar/style.css 104亿
build/block-library/blocks/block/editor-rtl.css 305亿
build/block-library/blocks/block/editor.css 305亿
build/block-library/blocks/button/editor-rtl.css 415亿
build/block-library/blocks/button/editor.css 414磅
build/block-library/blocks/button/style-rtl.css 627亿
build/block-library/blocks/button/style.css 626亿
build/block-library/blocks/buttons/editor-rtl.css 337亿
build/block-library/blocks/buttons/editor.css 337亿
构建/块库/blocks/buttons/style-rtl.css 332亿
build/block-library/blocks/buttons/style.css 332亿
build/block-library/blocks/calendar/style-rtl.css 239亿
build/block-library/blocks/calendar/style.css 239亿
build/block-library/blocks/categories/editor-rtl.css 113亿
build/block-library/blocks/categories/editor.css 112亿
build/block-library/blocks/categories/style-rtl.css 124亿
build/block-library/blocks/categories/style.css 124亿
build/block-library/blocks/code/editor-rtl.css 53亿
build/block-library/blocks/code/editor.css 53亿
build/block-library/blocks/code/style-rtl.css 121亿
build/block-library/blocks/code/style.css 121亿
build/block-library/blocks/code/theme-rtl.css 124亿
build/block-library/blocks/code/theme.css 124亿
build/block-library/blocks/columns/editor-rtl.css 108亿
build/block-library/blocks/columns/editor.css 108亿
build/block-library/blocks/columns/style-rtl.css 421亿
build/block-library/blocks/columns/style.css 421亿
build/block-library/blocks/comment-author-avatar/editor-rtl.css 125亿
build/block-library/blocks/comment-author-avatar/editor.css 125亿
构建/块库/blocks/comment content/style-rtl.css 92亿
build/block-library/blocks/comment-content/style.css 92亿
build/block-library/blocks/comment-template/style-rtl.css 199亿
build/block-library/blocks/comment-template/style.css 198亿
build/block-library/blocks/comments-pagination-numbers/editor-rtl.css 123亿
build/block-library/blocks/comments-pagination-numbers/editor.css 121亿
build/block-library/blocks/comments-pagination/editor-rtl.css 222亿
build/block-library/blocks/comments-pageination/editor.css 209亿
build/block-library/blocks/comments-pagination/style-rtl.css 235亿
build/block-library/blocks/comments-pageination/style.css 231亿
build/block-library/blocks/comments-title/editor-rtl.css 75亿
build/block-library/blocks/comments-title/editor.css 75亿
build/block-library/blocks/comments/editor-rtl.css 840亿
构建/块库/blocks/comments/editor.css 839亿
build/block-library/blocks/comments/style-rtl.css 637磅
build/block-library/blocks/comments/style.css 636亿
build/block-library/blocks/cover/editor-rtl.css 647亿
构建/块库/blocks/cover/editor.css 650亿
build/block-library/blocks/cover/style-rtl.css 1.69千字节
build/block-library/blocks/cover/style.css 1.68千字节
build/block-library/blocks/details/editor-rtl.css 65亿
build/block-library/blocks/details/editor.css 65亿
build/block-library/blocks/details/style-rtl.css 98亿
build/block-library/blocks/details/style.css 98亿
build/block-library/blocks/embed/editor-rtl.css 322亿
build/block-library/blocks/embed/editor.css 322磅
build/block-library/blocks/embed/style-rtl.css 410亿
build/block-library/blocks/embed/style.css 410亿
build/block-library/blocks/embed/theme-rtl.css 126亿
build/block-library/blocks/embed/theme.css 126亿
build/block-library/blocks/file/editor-rtl.css 316亿
build/block-library/blocks/file/editor.css 316亿
build/block-library/blocks/file/style-rtl.css 280亿
build/block-library/blocks/file/style.css 281亿
build/block-library/blocks/file/view.min.js 324亿
build/block-library/blocks/footnotes/style-rtl.css 201亿
build/block-library/blocks/footnotes/style.css 199亿
build/block-library/blocks/form-input/editor-rtl.css 227亿
build/block-library/blocks/form-input/editor.css 227亿
build/block-library/blocks/form-input/style-rtl.css 343亿
build/block-library/blocks/form-input/style.css 343亿
build/block-library/blocks/form-submission-notification/editor-rtl.css 340亿
build/block-library/blocks/form-submission-notification/editor.css 340亿
build/block-library/blocks/form-submit-button/style-rtl.css 69亿
build/block-library/blocks/form-submit-button/style.css 69亿
build/block-library/blocks/form/view.min.js 471亿
build/block-library/blocks/freeform/editor-rtl.css 2.61千字节
build/block-library/blocks/freeform/editor.css 2.61千字节
build/block-library/blocks/galletry/editor-rtl.css 947亿
build/block-library/blocks/galletry/editor.css 952亿
构建/block-library/blocks/gallery/style-rtl.css 1.72千字节
build/block-library/blocks/gallower/style.css 1.72千字节
build/block-library/blocks/gallower/theme-rtl.css版本 108亿
build/block-library/blocks/gallery/主题.css 108亿
build/block-library/blocks/group/editor-rtl.css 654亿
build/block-library/blocks/group/editor.css 654亿
build/block-library/blocks/group/style-rtl.css 57亿
build/block-library/blocks/group/style.css 57亿
构建/块-库/块/组/主题-rtl.css 78亿
构建/块-库/块/组/主题.css 78亿
build/block-library/blocks/heading/style-rtl.css 189亿
build/block-library/blocks/heading/style.css 189亿
build/block-library/blocks/html/editor-rtl.css 336亿
build/block-library/blocks/html/editor.css 337亿
build/block-library/blocks/image/editor-rtl.css 878亿
build/block-library/blocks/image/editor.css 878亿
build/block-library/blocks/image/style-rtl.css 1.6千字节
build/block-library/blocks/image/style.css 1.59千字节
构建/block-library/blocks/image/theme-rtl.css 126亿
构建/block-library/blocks/image/theme.css 126亿
build/block-library/blocks/image/view.min.js 1.54千字节
构建/block-library/blocks/latest comments/style-rtl.css 357亿
build/block-library/blocks/latest-comments/style.css 357亿
build/block-library/blocks/platest-posts/editor-rtl.css 213亿
build/block-library/blocks/platest-posts/editor.css 212亿
build/block-library/blocks/platest-posts/style-rtl.css 478亿
build/block-library/blocks/platest-posts/style.css 478亿
build/block-library/blocks/list/style-rtl.css 88亿
build/block-library/blocks/list/style.css 88亿
build/block-library/blocks/media-text/editor-rtl.css 266亿
build/block-library/blocks/media-text/editor.css 263亿
build/block-library/blocks/media-text/style-rtl.css 505亿
build/block-library/blocks/media-text/style.css 503亿
build/block-library/blocks/more/editor-rtl.css 431亿
build/block-library/blocks/more/editor.css 431亿
build/block-library/blocks/navigation-link/editor-rtl.css 668亿
build/block-library/blocks/navigation-link/editor.css 669亿
build/block-library/blocks/navigation-link/style-rtl.css 259亿
构建/块库/块/导航链接/style.css 257亿
build/block-library/blocks/navigation-submenu/editor-rtl.css 296亿
build/block-library/blocks/navigation-submenu/editor.css 295亿
build/block-library/blocks/navigation/editor-rtl.css 2.26千字节
build/block-library/blocks/navigation/editor.css 2.26千字节
构建/block-library/blocks/navigation/style-rtl.css 2.26千字节
build/block-library/blocks/navigation/style.css 2.25千字节
build/block-library/blocks/navigation/view.min.js 1.02千字节
build/block-library/blocks/nextpage/editor-rtl.css 395亿
build/block-library/blocks/nextpage/editor.css 395亿
build/block-library/blocks/page-list/editor-rtl.css 377亿
build/block-library/blocks/page-list/editor.css 377亿
build/block-library/blocks/page-list/style-rtl.css 175亿
build/block-library/blocks/page-list/style.css 175亿
build/block-library/blocks/pragment/editor-rtl.css 235亿
build/block-library/blocks/pragment/editor.css 235亿
build/block-library/blocks/pragment/style-rtl.css 335亿
build/block-library/blocks/pragment/style.css 335亿
build/block-library/blocks/post-author/style-rtl.css 175亿
build/block-library/blocks/post-author/style.css 176亿
build/block-library/blocks/post-comments-form/editor-rtl.css 96亿
build/block-library/blocks/post-comments-form/editor.css 96亿
build/block-library/blocks/post-comments-form/style-rtl.css 508亿
构建/块库/块/发布评论表单/style.css 508亿
build/block-library/blocks/post-content/editor-rtl.css 74亿
build/block-library/blocks/post-content/editor.css 74亿
build/block-library/blocks/post-date/style-rtl.css 61亿
build/block-library/blocks/post-date/style.css 61亿
build/block-library/blocks/post-extract/editor-rtl.css 71亿
build/block-library/blocks/post-extract/editor.css 71亿
build/block-library/blocks/post-extract/style-rtl.css 141亿
build/block-library/blocks/post-extract/style.css 141亿
build/block-library/blocks/post-featured-image/editor-rtl.css 666亿
构建/块库/块/发布特色图片/编辑.css 662亿
build/block-library/blocks/post-featured-image/style-rtl.css 342亿
build/block-library/blocks/post-featured-image/style.css 342亿
build/block-library/blocks/post-navigation-link/style-rtl.css 215亿
build/block-library/blocks/post-navigation-link/style.css 214亿
build/block-library/blocks/post-template/editor-rtl.css 99亿
build/block-library/blocks/post-template/editor.css 98亿
build/block-library/blocks/post-template/style-rtl.css 409亿
build/block-library/blocks/post-template/style.css 408磅
build/block-library/blocks/post-terms/style-rtl.css 96亿
build/block-library/blocks/post-terms/style.css 96亿
build/block-library/blocks/post-time-to-read/style-rtl.css 69亿
构建/块库/块/读取后时间/style.css 69亿
build/block-library/blocks/post-title/style-rtl.css 100亿
build/block-library/blocks/post-title/style.css 100亿
build/block-library/blocks/preactatted/style-rtl.css 125亿
build/block-library/blocks/preactatted/style.css 125亿
build/block-library/blocks/pullquote/editor-rtl.css 135亿
build/block-library/blocks/pullquote/editor.css 135亿
build/block-library/blocks/pullquote/style-rtl.css 354亿
build/block-library/blocks/pullquote/style.css 354亿
build/block-library/blocks/pullquote/theme-rtl.css 168亿
构建/block-library/blocks/pullquote/theme.css 168亿
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 122亿
build/block-library/blocks/query-pagination-numbers/editor.css 121亿
build/block-library/blocks/query-pagination/editor-rtl.css 221亿
build/block-library/blocks/query-pagination/editor.css 211亿
build/block-library/blocks/query-pagination/style-rtl.css 288亿
build/block-library/blocks/query-pagination/style.css 284亿
build/block-library/blocks/query-title/style-rtl.css 63亿
build/block-library/blocks/query-title/style.css 63亿
build/block-library/blocks/query/editor-rtl.css 486亿
build/block-library/blocks/query/editor.css 486亿
build/block-library/blocks/query/view.min.js 958亿
build/block-library/blocks/quote/style-rtl.css 237亿
构建/块库/blocks/quote/style.css 237亿
build/block-library/blocks/quote/theme-rtl.css 223亿
构建/block-library/blocks/quote/theme.css 226亿
构建/块库/blocks/read-more/style-rtl.css 140亿
build/block-library/blocks/read-more/style.css 140亿
build/block-library/blocks/rss/editor-rtl.css 149亿
build/block-library/blocks/rss/editor.css 149亿
build/block-library/blocks/rss/style-rtl.css 289亿
build/block-library/blocks/rss/style.css 288亿
build/block-library/blocks/search/editor-rtl.css 184亿
build/block-library/blocks/search/editor.css 184亿
build/block-library/blocks/search/style-rtl.css 614亿
build/block-library/blocks/search/style.css 614亿
构建/block-library/blocks/search/theme-rtl.css 114亿
构建/block-library/blocks/search/theme.css 114亿
build/block-library/blocks/search/view.min.js 478亿
build/block-library/blocks/seleparator/editor-rtl.css 146亿
build/block-library/blocks/seleparator/editor.css 146亿
build/block-library/blocks/seleparater/style-rtl.css 229亿
build/block-library/blocks/seleparater/style.css 229亿
build/block-library/blocks/seleparater/theme-rtl.css 194亿
build/block-library/blocks/seleparater/theme.css 194亿
build/block-library/blocks/shortcode/editor-rtl.css 323亿
build/block-library/blocks/shortcode/editor.css 323亿
build/block-library/blocks/site-logo/editor-rtl.css 754亿
build/block-library/blocks/site-logo/editor.css 754亿
build/block-library/blocks/site-logo/style-rtl.css 204亿
build/block-library/blocks/site-logo/style.css 204亿
build/block-library/blocks/site-tagline/editor-rtl.css 86亿
构建/块库/块/站点标语/编辑器.css 86亿
build/block-library/blocks/site-title/editor-rtl.css 116亿
build/block-library/blocks/site-title/editor.css 116亿
构建/块库/块/站点标题/style-rtl.css 57亿
build/block-library/blocks/site-title/style.css 57亿
build/block-library/blocks/social-link/editor-rtl.css 184亿
build/block-library/blocks/social-link/editor.css 184亿
build/block-library/blocks/social-links/editor-rtl.css 682亿
build/block-library/blocks/social-links/editor.css 681亿
build/block-library/blocks/social-links/style-rtl.css 1.49千巴
build/block-library/blocks/social-links/style.css 1.48千字节
build/block-library/blocks/spacer/editor-rtl.css 350亿
build/block-library/blocks/spacer/editor.css 350亿
build/block-library/blocks/spacer/style-rtl.css 48亿
构建/块库/blocks/spacer/style.css 48亿
build/block-library/blocks/table/editor-rtl.css 395亿
构建/块库/blocks/table/editor.css 395亿
build/block-library/blocks/table/style-rtl.css 639亿
build/block-library/blocks/table/style.css 639亿
build/block-library/blocks/table/theme-rtl.css 146亿
build/block-library/blocks/table/theme.css 146亿
build/block-library/blocks/tag-cloud/style-rtl.css 251亿
build/block-library/blocks/tag-cloud/style.css 253亿
构建/块库/blocks/template部件/editor-rtl.css 403亿
build/block-library/blocks/template-part/editor.css 403亿
build/block-library/blocks/template-part/theme-rtl.css 101亿
build/block-library/blocks/template-part/theme.css 101亿
build/block-library/blocks/term-description/style-rtl.css 111亿
build/block-library/blocks/term-description/style.css 111亿
build/block-library/blocks/text-columns/editor-rtl.css 95亿
build/block-library/blocks/text-columns/editor.css 95亿
build/block-library/blocks/text-columns/style-rtl.css 166亿
build/block-library/blocks/text-columns/style.css 166亿
build/block-library/blocks/verse/style-rtl.css 99亿
build/block-library/blocks/verse/style.css 99亿
build/block-library/blocks/video/editor-rtl.css 552亿
build/block-library/blocks/video/editor.css 555亿
build/block-library/blocks/video/style-rtl.css 185亿
build/block-library/blocks/video/style.css 185亿
构建/block-library/blocks/video/theme-rtl.css 126亿
build/block-library/blocks/video/theme.css 126亿
build/block-library/classic-rtl.css 179亿
构建/块库/classic.css 179亿
build/block-library/common-rtl.css 1.1千字节
build/block-library/common.css 1.1千字节
build/block-library/editor-elements-rtl.css 75亿
build/block-library/editor-elements.css 75亿
build/block-library/editor-rtl.css 12.3千字节
构建/块库/editor.css 12.3千字节
构建/块-库/元素-rtl.css 54亿
构建/块库/元素.css 54亿
build/block-library/index.min.js 216千字节
build/block-library/reset-rtl.css 472亿
build/block-library/reset.css 472亿
build/block-library/style-rtl.css 14.8千字节
build/block-library/style.css 14.8千字节
构建/块库/theme-rtl.css 688亿
构建/块-库/theme.css 693亿
build/block-serialization-default-parser/index.min.js 1.12千字节
build/block-serialization-specifi-parser/index.min.js 2.87千字节
build/blocks/index.min.js 51.6千字节
build/commands/index.min.js 15.6千字节
build/commands/style-rtl.css 921亿
build/commands/style.css 918亿
build/components/index.min.js 223千字节
build/components/style-rtl.css 11.8千字节
build/components/style.css 11.8千字节
构建/合成/索引.min.js 12.6千字节
build/core-commands/index.min.js 2.77千字节
构建/core-data/index.min.js 72.7千字节
构建/定制e-widgets/index.min.js 12.1千字节
构建/定制e-widgets/style-rtl.css 1.32千字节
构建/定制e-widgets/style.css 1.32千字节
构建/数据控制/索引.min.js 640亿
build/data/index.min.js版本 8.93千字节
构建/日期/索引.min.js 17.9千字节
build/deprecated/index.min.js 451亿
构建/dom-ready/index.min.js 324亿
构建/dom/index.min.js 4.65千字节
构建/编辑-发布/分类-rtl.css 544亿
构建/编辑post/classic.css 545亿
构建/编辑post/index.min.js 23.8千字节
构建/编辑-发布/样式-rtl.css 5.64千字节
构建/编辑-发布/样式.css 5.63千字节
build/edit-site/index.min.js 214千字节
构建/编辑site/style-rtl.css 15.3千字节
构建/编辑站点/style.css 15.3千字节
build/edit-widgets/index.min.js 17.3千字节
build/edit-widgets/style-rtl.css 4.22千字节
build/edit-widgets/style.css 4.22千字节
build/editor/index.min.js 63.7千字节
构建/编辑器/样式-rtl.css 5.32千字节
构建/编辑器/样式.css 5.32千字节
build/element/index.min.js 4.83千字节
build/escape-html/index.min.js 537亿
build/format-library/index.min.js 7.89千字节
build/format-library/style-rtl.css 478亿
构建/格式库/样式.css 477亿
build/hooks/index.min.js 1.55千字节
build/html-entities/index.min.js 448亿
构建/i18n/index.min.js 3.58千字节
构建/交互/文件.min.js 447磅
构建/交互/image.min.js 1.67千字节
构建/交互性/index.min.js 12.7千字节
构建/交互/导航.min.js 1.15千字节
build/interactivity/query.min.js 740亿
构建/交互/路由.min.js 1.29千字节
构建/交互/搜索.min.js 618亿
构建/is-shallow-equal/index.min.js 527亿
构建/键盘快捷方式/index.min.js 1.74千字节
build/keycodes/index.min.js 1.46千字节
构建/list-reasable-blocks/index.min.js 2.11千字节
构建/list-rusable-blocks/style-rtl.css 836亿
构建/列出可重用块/style.css 836亿
build/media-utils/index.min.js 2.9千字节
build/modules/importmap-polyfill.min.js 12.2千字节
build/notices/index.min.js 948亿
build/nux/index.min.js 2千字节
build/nux/style-rtl.css 735亿
构建/nux/style.css 732亿
build/patterns/index.min.js 5.83千字节
build/patterns/style-rtl.css 540亿
构建/模式/样式.css 539亿
build/plugins/index.min.js 1.8千字节
build/preferences-persistence/index.min.js 2.05千字节
build/preferences/index.min.js 2.82千字节
build/preferences/style-rtl.css 698亿
build/preferences/style.css 700亿
build/primitives/index.min.js 975亿
build/priority-queue/index.min.js 1.52千字节
build/private-apis/index.min.js 1千字节
build/react-i18n/index.min.js 623亿
build/react-refresh-entry/index.min.js 9.47千巴
build/react-refresh-runtime/index.min.js 6.78千字节
build/redux-routine/index.min.js 2.7千字节
构建/可重用块/index.min.js 2.72千字节
构建/可重用块/样式-rtl.css 243亿
构建/可重用块/样式.css 243亿
build/rich text/index.min.js版本 10.4千字节
build/router/index.min.js 1.79千字节
build/server-side-render/index.min.js 1.95千字节
build/shortcode/index.min.js 1.39千字节
build/style-engine/index.min.js 2.08千字节
构建/token-list/index.min.js 582亿
构建/url/index.min.js 3.72千字节
build/vendors/intert-polyfill.min.js 2.48千字节
build/vendors/react-dom.min.js 41.8千字节
build/vendors/react.min.js 4.02千字节
build/viewport/index.min.js 957亿
build/warning/index.min.js 249亿
build/widgets/index.min.js 7.21千字节
构建/widgets/style-rtl.css 1.15千字节
build/widgets/style.css 1.16千字节
build/wordcount/index.min.js版本 1.02千字节

压缩尺寸作用

复制链接

github-操作 机器人程序 评论2024年2月15日

在中检测到片状测试df65b36型.
一些测试通过,但尝试失败。失败可能与此提交无关,但仍会报告以供查看。请参阅文档了解更多信息。

🔍 工作流运行URL:https://github.com/WordPress/gutenberg/actions/runs/7981552144
📝 报告的问题:

}

.block-editor-grid-visualizer__item{
边框:1px虚线$gray-300;

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

当主题背景为灰色时,这将不可见。我会带一个color-mix(srgb,var(--wp-admin-theme-color)20%,透明);大约如此。

@告诉机器
复制链接
贡献者

现在合并列跨度重构时,这需要一个重设基。

我在玩一个图像网格,重复的手柄有点令人困惑:
屏幕截图2024-02-16,下午3点38⁄

在网格中隐藏图像块大小调整拖曳手柄有意义吗?

复制链接
贡献者

@告诉机器 告诉机器 留下了评论

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

这是一个非常酷的实验!

我们可能应该考虑的一件事是,当通过侧栏控件更改父值或子值时,更新网格可视化。这对孩子们来说可能不是什么大不了的事,但对于网格本身来说,我认为人们可能想在操作内容时调整列数等:

1140d39b-70b3-4bcd-9fce-49947ab52693.mp4

@吵闹声
复制链接
成员 作者

很好的反馈,谢谢@告诉机器!

@吵闹声
复制链接
成员 作者

仍在努力。准备好后,我会将更改放在实验标记后面,并将PR标记为准备审查。

复制链接

github-操作 机器人程序 评论2024年2月20日

此拉取请求已更改或添加了PHP文件。请确认是否需要将这些更改同步到WordPress Core,以便在下一版本的WordPres中使用。

如果是,建议创建一个新Trac票并向WordPress核心Github存储库合并此pull请求后不久。

如果您不确定,可以随时在中的#core-editor频道寻求帮助WordPress松弛.

谢谢您!❤️

查看更改的文件
库/实验/编辑器设置.php
库/实验页面.php

@吵闹声 吵闹声更改了标题尝试交互式网格子跨度 添加网格交互 2024年2月21日
@吵闹声 吵闹声补充[类型]功能 要在变更日志中突出显示的新功能。 [类型]实验 实验功能或API。和已删除[类型]技术原型 提供对想法的技术探索,作为可能的示例 [类型]功能 要在变更日志中突出显示的新功能。标签2024年2月21日
@吵闹声 吵闹声 用力推动的这个 更新/删除-__unstableRefreshSize 分支 82a8713型 943c53页 比较 2024年2月22日03:56
基准自动更改自 更新/删除-__unstableRefreshSize 大旅行箱 2024年2月22日04:28
@告诉机器
复制链接
贡献者

只是在玩这个游戏,注意到同一块上的多个调整大小操作只会创建一个撤消级别:

b324f483-0dff-4391-b735-027a2d0d5cd8.mp4型

我想如果可能的话,每个大小调整都可以单独撤销可能会更好?

除此之外,它的工作非常顺利!根据被拖动的块的位置(如果是右下角块,我们必须将其移动到可以拖动的位置?或者使用侧栏控件),只能向右和向下拖动可能会很烦人,但这对于一个实验特性来说是一个很好的开始!

复制链接
贡献者

@告诉机器 告诉机器 留下了评论

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

LGTM!没有阻碍将其合并为实验的因素。

右:正确,
顶部:错误,
topLeft:错误,
topRight:错误,
复制链接
贡献者

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

那么,如果我们启用“左”和“上”,会发生什么呢?我猜它不知怎么破了?😄

复制链接
成员 作者

@吵闹声 吵闹声 2024年2月23日

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

我想里面有个虫子可调整框大小或者因为它变得疯狂了🤪 如果觉得需要的话,我们可以考虑稍后再添加。

@@ -0,0 +1,5 @@
导出函数getComputedCSS(元素,属性){
复制链接
贡献者

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

这是块编辑器包中此函数的第三个实例,可能值得合并(作为单独的任务)

复制链接
成员 作者

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

中的重构#59227降到2!正在接近。。。😂

复制链接
贡献者

@安德鲁斯隆 安德鲁斯隆 留下了评论

选择隐藏此评论的原因

将显示原因,以便向其他人描述此评论。了解更多信息.

很酷,玩这个也很有趣。我不认为这不是一个PR的拦截器,但我在玩游戏时注意到,如果一个块上的列跨度大于可用的列数,则父网格块的手动列数不会强制块减少到该列数。这有点难以描述,所以我会看看视频是否有效:

在视频的开头,我们正在调整列跨度的数量,这很好。在视频的最后,我转到网格块以减少列数,但它不会让我们减少到2列:

2024年2月-23.14.01.23.mp4

不过,这并不是登陆这个实验的障碍!

@吵闹声
复制链接
成员 作者

谢谢大家!合并这个(在一个实验标记后面),并将在下周调查所有发现的错误。

@吵闹声 吵闹声合并提交ba535da公司进入之内 大旅行箱 2024年2月23日
61项检查通过
@吵闹声 吵闹声删除了 try/interactive-grid-child-spans 分支 2024年2月23日03:29
@github-操作 github-操作 机器人程序将此添加到古腾堡17.9里程碑2024年2月23日
@吵闹声
复制链接
成员 作者

为清楚起见,后续工作清单:

@告诉机器
复制链接
贡献者

父网格块的手动列数不会强制块减少到该列数。

这就是网格的工作方式:如果网格子级指定的列数大于中定义的列数网格模板列,网格只是增加了一堆新列来容纳子元素。对于自动网格,我们使用容器查询来缓解这一问题;对于手动网格,还不清楚其行为应该是什么。我倾向于让默认的网格行为在这里发生,因为即使有人意外地使一个项跨越的列数超过网格的列数,也很容易发现并修复它。

@安德鲁斯隆
复制链接
贡献者

我倾向于让默认的网格行为发生在这里,因为即使有人不小心让一个项目跨越了比网格更多的列,也很容易注意到并修复它。

我想到的情况有点微妙:我在想,如果有人要更新一个模式或模板,而该模式或模板已经使用了一个Grid,该Grid有一些跨多列的子代,然后他们决定将Grid减少到2列。在这种情况下,他们可能不知道有一些子控件已经设置了跨距,所以看起来控件没有做任何事情,他们可能也不知道必须更新这些子控件。

现在肯定不是一个拦截器,但我想知道,当手动列计数更新时,是否可以消除它?不过,我一直认为这是一种抛光的想法,而不是需要立即修复的任何东西🙂

@告诉机器
复制链接
贡献者

如果有人要更新一个模式或模板,该模式或模板已经使用了一个Grid,该Grid有一些跨多列的子级,然后他们决定将Grid减少到2列

在这种情况下,提供视觉反馈的好方法是始终显示网格可视化工具选择网格块后,更改列数将产生视觉效果。我们甚至可以检查网格模板列对于任何宽度为0的颜色,显示警告/以颜色或其他方式突出显示它们。

我想不出一个好方法来实际强制子项跨越更少的列:我们必须遍历所有块的内部块,以搜索跨度大于列数的块,并对其执行更新。它无法用容器查询解决,因为不管列数如何,网格的总宽度总是相同的。

因为这个场景有点边缘化,所以在抢先修复它之前,最好等待并查看是否有人真正遇到了它😅

@吵闹声 吵闹声提到这个拉请求 2024年2月27日
37项任务
@帕尔约阿希姆
复制链接
贡献者

这看起来很酷,将成为一个非常强大的布局工具!
这让我想起了老派的HTML表。带有表格单元格等。
当我看到拖拽一个单元格变成3-4-5时,我想知道是否可以合并一个特定的单元格,使其从包含3-4-5个单元格变为只有一个更大的单元格。

从某种意义上讲,这里创建的内容将替换Table块,或者从另一个意义上说,将对Table块进行非常好的更新。

最好是整个实验的概述视频。它背后的一些动机,目标是什么,如果这也可能与设备特定的断点有关。这涉及到很多方面。有一个概述视频将非常有帮助,也可以分享给大家扩大反馈的机会。

@吵闹声
复制链接
成员 作者

吵闹声 评论2024年2月28日

@帕尔约阿希姆.我转身#57478尽管它可能缺乏您所追求的确切细节,但它已成为一个概述性问题。也许 吧@萨克森F可以详细说明-他有一种使用单词的方法-但其要点是,我们想让用户能够以比当前使用Group、Row、Stack、Columns等更直观的方式创建更高级的布局和更高级的块主题。网格工具存在于其他专有网站构建者中,WordPress的最终目标是从专有CMS工具中获取市场份额。

Grid和Table块之间有一些相似之处,就像它们之间有相似之处一样显示:栅格<表格>,但基本上Table块用于表格数据例如,你在电子表格中找到的类型,这不会改变。

免费注册 在GitHub上加入此对话.已经有账户了吗?登录以发表评论
标签
[功能]布局 布局块支持、其UI控件和样式输出。 [类型]实验 实验功能或API。
项目
还没有
开发

成功合并此请求可能会解决这些问题。

5名参与者