Home › Forums › Feature Requests › Repeater field divider border › Reply To: Repeater field divider border
Another fix. This style add better layout for block repeater (when edit page) and better layout for tab field (when edit fields group). This may help when you create group with lots of fields and tabs.
Add this code to your functions.php
//-----------------------------------------------------------
// ACF custom uber styles
//-----------------------------------------------------------
function custom_acf_repeater_colors() {
wp_enqueue_style( 'acf-uber-styles', get_template_directory_uri() . '/css/admin/acf-styles.css' );
}
add_action('admin_head', 'custom_acf_repeater_colors');
and then create acf-styles.css on your-theme/css/admin/ (or change above path) and paste css to it:
/* nth field background */
.acf-input-table.row-layout .acf-row:nth-of-type(2n) .acf-table {
background:#fafafa;
}
/* left field label td */
.acf-input-table.row-layout .acf-row:nth-of-type(2n) td.acf-label {
background:#eee;
border-color:#ddd;
}
/* field td */
.acf-input-table.row-layout .acf-row:nth-of-type(2n) td.acf-input {
border-color:#ddd;
}
/* left and right side - order and delete td */
.acf-input-table.row-layout .acf-row:nth-of-type(2n) td.order,
.acf-input-table.row-layout .acf-row:nth-of-type(2n) td.remove {
background:#e3e3e3;
}
/* space between row - only border works */
.acf-input-table.row-layout > tbody > tr > td {
border:0;
border-bottom:3px solid #DFDFDF;
}
/* acf edit page */
.acf-field-object-tab {
background: #fafafa;
background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #F0F0F0 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#F0F0F0));
background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#F0F0F0 100%);
background: -o-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#F0F0F0 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#F0F0F0 100%);
background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#F0F0F0 100%);
border-bottom : 2px solid #F0F0F0;
}
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Privacy Policy. If you continue to use this site, you consent to our use of cookies.