Make WordPress Core

Ticket #28504: 28504.diff

File 28504.diff, 2.5 KB (added by celloexpressions, 10 years ago)

Possible implementation of customizer section icons, with a way for plugins and themes to specify icons for their custom sections.

  • src/wp-admin/css/customize-controls.css

     
    143143        margin: 0;
    144144}
    145145
     146.control-section .accordion-section-title {
     147        padding-left: 45px;
     148}
     149
     150.control-section .accordion-section-title:before {
     151        font: normal 20px/1 dashicons;
     152        position: absolute;
     153        top: 11px;
     154        left: 14px;
     155        -webkit-font-smoothing: antialiased;
     156        -moz-osx-font-smoothing: grayscale;
     157}
     158
     159/* Don't override custom icons, which get an additional class. */
     160.control-section [class="accordion-section-title "]:before {
     161        content: "\f111";
     162}
     163
     164#accordion-section-title_tagline .accordion-section-title:before {
     165        content: "\f175";
     166}
     167
     168#accordion-section-colors .accordion-section-title:before {
     169        content: "\f309";
     170}
     171
     172#accordion-section-header_image .accordion-section-title:before {
     173        content: "\f129";
     174}
     175
     176#accordion-section-background_image .accordion-section-title:before {
     177        content: "\f128";
     178}
     179
     180#accordion-section-nav .accordion-section-title:before {
     181        content: "\f333";
     182}
     183
     184#accordion-section-static_front_page .accordion-section-title:before {
     185        content: "\f109";
     186}
     187
     188.accordion-section[id^="accordion-section-sidebar-widgets"] .accordion-section-title:before {
     189        content: "\f116";
     190}
     191
    146192.customize-control {
    147193        width: 100%;
    148194        float: left;
  • src/wp-includes/class-wp-customize-section.php

     
    6565        public $title = '';
    6666
    6767        /**
     68         * Icon for the section to show in UI.
     69         *
     70         * @since 4.0.0
     71         * @access public
     72         * @var string
     73         */
     74        public $icon = '';
     75
     76        /**
    6877         * Description to show in the UI.
    6978         *
    7079         * @since 3.4.0
     
    164173        protected function render() {
    165174                ?>
    166175                <li id="accordion-section-<?php echo esc_attr( $this->id ); ?>" class="control-section accordion-section">
    167                         <h3 class="accordion-section-title" tabindex="0"><?php echo esc_html( $this->title ); ?></h3>
     176                        <h3 class="accordion-section-title <?php echo esc_attr( $this->icon ); ?>" tabindex="0"><?php echo esc_html( $this->title ); ?></h3>
    168177                        <ul class="accordion-section-content">
    169178                                <?php if ( ! empty( $this->description ) ) : ?>
    170179                                <li><p class="description"><?php echo $this->description; ?></p></li>