Make WordPress Core


Ignore:
Timestamp:
11/06/2023 03:22:41 PM (5 months ago)
Author:
hellofromTonya
Message:

Twenty Twenty-Four: Bugfixes and refinement for 6.4 RC4.

This update includes the following changes:

Follow up to [57036], [56999], [56951], [56813], [56764], [56716].

Reviewed by desrosj.
Merges [57067] to the 6.4 branch.

Props onemaggie, richtabor, luminuu, huzaifaalmesbah, sabernhardt, poena, rajinsharwar.
Fixes #59812.

Location:
branches/6.4
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • branches/6.4

  • branches/6.4/src/wp-content/themes/twentytwentyfour/functions.php

    r57037 r57070  
    2121     */
    2222    function twentytwentyfour_block_styles() {
     23
     24        register_block_style(
     25            'core/details',
     26            array(
     27                'name'         => 'arrow-icon-details',
     28                'label'        => __( 'Arrow icon', 'twentytwentyfour' ),
     29                /*
     30                 * Styles for the custom Arrow icon style of the Details block
     31                 */
     32                'inline_style' => '
     33                .is-style-arrow-icon-details {
     34                    padding-top: var(--wp--preset--spacing--10);
     35                    padding-bottom: var(--wp--preset--spacing--10);
     36                }
     37
     38                .is-style-arrow-icon-details summary {
     39                    list-style-type: "\2193\00a0\00a0\00a0";
     40                }
     41
     42                .is-style-arrow-icon-details[open]>summary {
     43                    list-style-type: "\2192\00a0\00a0\00a0";
     44                }',
     45            )
     46        );
     47        register_block_style(
     48            'core/post-terms',
     49            array(
     50                'name'         => 'pill',
     51                'label'        => __( 'Pill', 'twentytwentyfour' ),
     52                /*
     53                 * Styles variation for post terms
     54                 * https://github.com/WordPress/gutenberg/issues/24956
     55                 */
     56                'inline_style' => '
     57                .is-style-pill a,
     58                .is-style-pill span:not([class], [data-rich-text-placeholder]) {
     59                    display: inline-block;
     60                    background-color: var(--wp--preset--color--base-2);
     61                    padding: 0.375rem 0.875rem;
     62                    border-radius: var(--wp--preset--spacing--20);
     63                }
     64
     65                .is-style-pill a:hover {
     66                    background-color: var(--wp--preset--color--contrast-3);
     67                }',
     68            )
     69        );
     70        register_block_style(
     71            'core/list',
     72            array(
     73                'name'         => 'checkmark-list',
     74                'label'        => __( 'Checkmark', 'twentytwentyfour' ),
     75                /*
     76                 * Styles for the custom checkmark list block style
     77                 * https://github.com/WordPress/gutenberg/issues/51480
     78                 */
     79                'inline_style' => '
     80                ul.is-style-checkmark-list {
     81                    list-style-type: "\2713";
     82                }
     83
     84                ul.is-style-checkmark-list li {
     85                    padding-inline-start: 1ch;
     86                }',
     87            )
     88        );
     89        register_block_style(
     90            'core/navigation-link',
     91            array(
     92                'name'         => 'arrow-link',
     93                'label'        => __( 'With arrow', 'twentytwentyfour' ),
     94                /*
     95                 * Styles for the custom arrow nav link block style
     96                 */
     97                'inline_style' => '
     98                .is-style-arrow-link .wp-block-navigation-item__label:after {
     99                    content: "\2197";
     100                    padding-inline-start: 0.25rem;
     101                    vertical-align: middle;
     102                    text-decoration: none;
     103                    display: inline-block;
     104                }',
     105            )
     106        );
     107        register_block_style(
     108            'core/heading',
     109            array(
     110                'name'         => 'asterisk',
     111                'label'        => __( 'With asterisk', 'twentytwentyfour' ),
     112                'inline_style' => "
     113                .is-style-asterisk:before {
     114                    content: '';
     115                    width: 1.5rem;
     116                    height: 3rem;
     117                    background: var(--wp--preset--color--contrast-2, currentColor);
     118                    clip-path: path('M11.93.684v8.039l5.633-5.633 1.216 1.23-5.66 5.66h8.04v1.737H13.2l5.701 5.701-1.23 1.23-5.742-5.742V21h-1.737v-8.094l-5.77 5.77-1.23-1.217 5.743-5.742H.842V9.98h8.162l-5.701-5.7 1.23-1.231 5.66 5.66V.684h1.737Z');
     119                    display: block;
     120                }
     121
     122                /* Hide the asterisk if the heading has no content, to avoid using empty headings to display the asterisk only, which is an A11Y issue */
     123                .is-style-asterisk:empty:before {
     124                    content: none;
     125                }
     126
     127                .is-style-asterisk:-moz-only-whitespace:before {
     128                    content: none;
     129                }
     130
     131                .is-style-asterisk.has-text-align-center:before {
     132                    margin: 0 auto;
     133                }
     134
     135                .is-style-asterisk.has-text-align-right:before {
     136                    margin-left: auto;
     137                }
     138
     139                .rtl .is-style-asterisk.has-text-align-left:before {
     140                    margin-right: auto;
     141                }",
     142            )
     143        );
     144    }
     145endif;
     146
     147add_action( 'init', 'twentytwentyfour_block_styles' );
     148
     149/**
     150 * Enqueue block stylesheets.
     151 */
     152
     153if ( ! function_exists( 'twentytwentyfour_block_stylesheets' ) ) :
     154    /**
     155     * Enqueue custom block stylesheets
     156     *
     157     * @since Twenty Twenty-Four 1.0
     158     * @return void
     159     */
     160    function twentytwentyfour_block_stylesheets() {
    23161        /**
    24162         * The wp_enqueue_block_style() function allows us to enqueue a stylesheet
     
    38176            )
    39177        );
    40 
    41         register_block_style(
    42             'core/details',
    43             array(
    44                 'name'         => 'arrow-icon-details',
    45                 'label'        => __( 'Arrow icon', 'twentytwentyfour' ),
    46                 /*
    47                  * Styles for the custom Arrow icon style of the Details block
    48                  */
    49                 'inline_style' => '
    50                 .is-style-arrow-icon-details {
    51                     padding-top: var(--wp--preset--spacing--10);
    52                     padding-bottom: var(--wp--preset--spacing--10);
    53                     border-bottom: 1px solid var(--wp--preset--color--contrast-2, currentColor);
    54                 }
    55 
    56                 .is-style-arrow-icon-details summary {
    57                     list-style-type: "\2193\00a0\00a0\00a0";
    58                 }
    59 
    60                 .is-style-arrow-icon-details[open]>summary {
    61                     list-style-type: "\2192\00a0\00a0\00a0";
    62                 }',
    63             )
    64         );
    65         register_block_style(
    66             'core/post-terms',
    67             array(
    68                 'name'         => 'pill',
    69                 'label'        => __( 'Pill', 'twentytwentyfour' ),
    70                 /*
    71                  * Styles variation for post terms
    72                  * https://github.com/WordPress/gutenberg/issues/24956
    73                  */
    74                 'inline_style' => '
    75                 .is-style-pill a,
    76                 .is-style-pill span:not([class], [data-rich-text-placeholder]) {
    77                     display: inline-block;
    78                     background-color: var(--wp--preset--color--base-2);
    79                     padding: 0.375rem 0.875rem;
    80                     border-radius: var(--wp--preset--spacing--20);
    81                 }
    82 
    83                 .is-style-pill a:hover {
    84                     background-color: var(--wp--preset--color--contrast-3);
    85                 }',
    86             )
    87         );
    88         register_block_style(
    89             'core/list',
    90             array(
    91                 'name'         => 'checkmark-list',
    92                 'label'        => __( 'Checkmark', 'twentytwentyfour' ),
    93                 /*
    94                  * Styles for the custom checkmark list block style
    95                  * https://github.com/WordPress/gutenberg/issues/51480
    96                  */
    97                 'inline_style' => '
    98                 ul.is-style-checkmark-list {
    99                     list-style-type: "\2713";
    100                 }
    101 
    102                 ul.is-style-checkmark-list li {
    103                     padding-inline-start: 1ch;
    104                 }',
    105             )
    106         );
    107         register_block_style(
    108             'core/navigation-link',
    109             array(
    110                 'name'         => 'arrow-link',
    111                 'label'        => __( 'With arrow', 'twentytwentyfour' ),
    112                 /*
    113                  * Styles for the custom arrow nav link block style
    114                  */
    115                 'inline_style' => '
    116                 .is-style-arrow-link .wp-block-navigation-item__label:after {
    117                     content: "\2197";
    118                     padding-inline-start: 0.25rem;
    119                     vertical-align: middle;
    120                     text-decoration: none;
    121                     display: inline-block;
    122                 }',
    123             )
    124         );
    125         register_block_style(
    126             'core/heading',
    127             array(
    128                 'name'         => 'asterisk',
    129                 'label'        => __( 'With asterisk', 'twentytwentyfour' ),
    130                 'inline_style' => "
    131                 .is-style-asterisk:before {
    132                     content: '';
    133                     width: 1.5rem;
    134                     height: 3rem;
    135                     background: var(--wp--preset--color--contrast-2, currentColor);
    136                     clip-path: path('M11.93.684v8.039l5.633-5.633 1.216 1.23-5.66 5.66h8.04v1.737H13.2l5.701 5.701-1.23 1.23-5.742-5.742V21h-1.737v-8.094l-5.77 5.77-1.23-1.217 5.743-5.742H.842V9.98h8.162l-5.701-5.7 1.23-1.231 5.66 5.66V.684h1.737Z');
    137                     display: block;
    138                 }
    139 
    140                 /* Hide the asterisk if the heading has no content, to avoid using empty headings to display the asterisk only, which is an A11Y issue */
    141                 .is-style-asterisk:empty:before {
    142                     content: none;
    143                 }
    144 
    145                 .is-style-asterisk:-moz-only-whitespace:before {
    146                     content: none;
    147                 }
    148 
    149                 .is-style-asterisk.has-text-align-center:before {
    150                     margin: 0 auto;
    151                 }
    152 
    153                 .is-style-asterisk.has-text-align-right:before {
    154                     margin-left: auto;
    155                 }
    156 
    157                 .rtl .is-style-asterisk.has-text-align-left:before {
    158                     margin-right: auto;
    159                 }",
    160             )
    161         );
    162178    }
    163179endif;
    164180
    165 add_action( 'init', 'twentytwentyfour_block_styles' );
     181add_action( 'init', 'twentytwentyfour_block_stylesheets' );
    166182
    167183/**
Note: See TracChangeset for help on using the changeset viewer.