Skip to content

Commit a91d398

Browse files
westonruterwestonruter
committed
Customize: Introduce extensible code editor Customizer control for CodeMirror.
* Adds `WP_Customize_Code_Editor_Control` and `wp.customize.CodeEditorControl()`. * Control respects user preference for syntax highlighting, showing a textarea when user opts out. * Code editor control takes the ad hoc code for Additional CSS and makes it reusable and extensible, for Additional CSS in core and plugins to use (such as Jetpack). * Replace `settings` arg in `wp_enqueue_code_editor()` with separate args for `codemirror`, `csslint`, `jshint`, and `htmlhint`. * Prefix `codemirror` script and style handles with `wp-` to prevent collisions, as also the object is exported as `wp.CodeMirror` in JS. * Reduce indent size in Customizer code editor instances and Custom HTML widget to use tab size of 2 instead of 4 to save on space. See #12423, #38707, #35395. Fixes #41897. git-svn-id: https://develop.svn.wordpress.org/trunk@41558 602fd350-edb4-49c9-b593-d223f7449a82
1 parent 7a5d0cc commit a91d398

8 files changed

Lines changed: 404 additions & 234 deletions

File tree

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

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1164,12 +1164,26 @@ p.customize-section-description {
11641164
}
11651165

11661166
/**
1167-
* Custom CSS Section
1167+
* Code Editor Control and Custom CSS Section
11681168
*
11691169
* Modifications to the Section Container to make the textarea full-width and
11701170
* full-height, if the control is the only control in the section.
11711171
*/
11721172

1173+
.customize-control-code_editor textarea {
1174+
width: 100%;
1175+
font-family: Consolas, Monaco, monospace;
1176+
font-size: 12px;
1177+
padding: 6px 8px;
1178+
-moz-tab-size: 2;
1179+
-o-tab-size: 2;
1180+
tab-size: 2;
1181+
}
1182+
.customize-control-code_editor textarea,
1183+
.customize-control-code_editor .CodeMirror {
1184+
height: 14em;
1185+
}
1186+
11731187
#customize-controls .customize-section-description-container.section-meta.customize-info {
11741188
border-bottom: none;
11751189
}
@@ -1180,13 +1194,7 @@ p.customize-section-description {
11801194

11811195
#customize-control-custom_css textarea {
11821196
display: block;
1183-
font-family: Consolas, Monaco, monospace;
1184-
font-size: 12px;
1185-
padding: 6px 8px;
11861197
height: 500px;
1187-
-moz-tab-size: 4;
1188-
-o-tab-size: 4;
1189-
tab-size: 4;
11901198
}
11911199

11921200
.customize-section-description-container + #customize-control-custom_css:last-child textarea {

0 commit comments

Comments
 (0)