Page 2 of 2
Re: Transform Search Field
Posted: Thu Sep 14, 2023 11:13 pm
by nc07
Hi Kevin,
I tested it and works well when function is called
Code: Select all
$(document).ready(function() {
nuTransformSearchBox();
});
without it the layout is similar to what you have experienced.
let me know if the issue is still there.
layout should look like this now
captures_chrome-capture-2023-8-15.png
Re: Transform Search Field
Posted: Fri Sep 15, 2023 2:28 pm
by kev1n
On edit forms the dev buttons still appear as shown on my screenshot above.
Re: Transform Search Field
Posted: Fri Sep 15, 2023 11:15 pm
by nc07
Not tested,
Try setting
Code: Select all
.adminButtonGroup{
Display:flex;
flex-direction: row;
padding: 2px;
height: 15px;
}
Also check in html if the above group is created.
Re: Transform Search Field
Posted: Sat Sep 16, 2023 4:32 am
by kev1n
These 2 CSS classes, .actionButtonGroup and .adminButtonGroup, appear to be custom styles and are not part of nuBuilder's core code.
Can you clarify how these classes are applied and assigned? Thanks!
Code: Select all
.actionButtonGroup {
display: flex;
align - items: baseline;
}
.adminButtonGroup {
Display: flex;
flex - direction: row;
padding: 2 px;
height: 15 px;
}
Re: Transform Search Field
Posted: Sat Sep 16, 2023 6:26 am
by nc07
Those two classes are created with the updated nuTransformSearchBox() i posted in the earlier. It is used for grouping admin buttons and action buttons separately to enable the layout you requested.
Code: Select all
function nuTransformSearchBox() {
$('#nuSearchField,#nuSearchButton,#nuFilter').wrapAll('<div id="nuSeachCombo"></div>');
$('.nuAdminButton').wrapAll('<div class="adminButtonGroup"></div>');
$('.nuActionButton, #nuSeachCombo').not('.nuAdminButton').not('#nuPreviewButton').not('#nuSearchButton').not('span').wrapAll('<div class="actionButtonGroup"></div>');
$('#nuSearchField')
.attr('placeholder', 'Search')
.focus();
}
Re: Transform Search Field
Posted: Tue Sep 19, 2023 12:34 am
by kev1n
As JavaScript is executed after the form has already been rendered, it causes noticeable "flickering".
I'm wondering if we could get rid of that.
Video_2023-09-19_003041.gif
Re: Transform Search Field
Posted: Tue Sep 19, 2023 12:59 am
by nc07
Thanks Kevin, that's optional for anyone to use and may not necessary need be part of NB.