/* Add this to your functions file */
function custom_admin_css() {
wp_enqueue_style( 'admin_styles', get_template_directory_uri() . '/css/admin.css',true,'1.1','all');
wp_enqueue_style( 'admin-fonts', 'https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i|Material+Icons',true,'1.1','all');
}
add_action('admin_footer', 'custom_admin_css');
/*Add this to admin.css file in your themes CSS folder*/
/* Force height below of Gutenberg Editor to be only 50px vs. 40vh, and force the Gutenberg block to be fullwidth */
.wp-block, .edit-post-visual-editor, .block-editor-writing-flow__click-redirect {
flex: none;
min-height: 50px !important;
max-width: 100vw;
}
/*Chnage The Gutenberg Editor Font. Font's also must me included in functions.php file.*/
.block-editor-block-list__layout, .editor-post-title__block .editor-post-title__input {
font-family: 'Montserrat', sans-serif;
}
/* ACF Accordion Titles and Label colors */
.acf-field.menu-title, .edit-post-meta-boxes-area #poststuff .stuffbox>h3, .edit-post-meta-boxes-area #poststuff h2.hndle, .edit-post-meta-boxes-area #poststuff h3.hndle, #editor .acf-label.acf-accordion-title {
background-color: #f0eeff;
}
/* Remove right and Left Margins from Non Gutenberg based ACF fields Below Main Gutenger Editor */
.edit-post-meta-boxes-area{
margin: 0 auto !important;
}
This CSS removes Gutenberg's full page height and forces editor to be full width. If you you are using traditional ACF content that is not Gutenberg based it will add color to your ACF headers and labels as well.
2 Responses
Can you please help me to resolve this issue?
Can you please help me to resolve this issue?
Write a comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.