CSS not Being Applied to the Back Button?

Questions related to customising nuBuilder Forte with JavaScript or PHP.

CSS not Being Applied to the Back Button?

Unread postby pmjd » Tue Nov 23, 2021 1:08 am

Hello,

I've added the following custom code to move just the nuActionHolder to a left vertical position for only the edit form, and change the nuActionButton format to be bigger.

Code: Select all
if (nuFormType() == 'edit') {
    nuResize()}
   


function nuResize() {
   
     var h = window.innerHeight;

     $('#nuActionHolder').css({
         'width': '100px',
         'float': 'left',
         'height': h,
         'border-right': 'solid',
         'border-right-width': 'thin'
     });
    $('.nuActionButton').css({
         'width': '90px',
         'height': '45px',
         'margin':'5px'
     });
    $('.nuBackBtnButton.nuActionButton').css({
         'width': '90px',
         'height': '45px',
         'margin':'5px'
     });
   
}


However the Back button always retains it's original css code and looks different to the rest.
nuActionHolder.png
nuActionHolder.png (7.7 KiB) Viewed 34 times


I've tried to target the Back button using #nuBackBtnButton and #nuBackBtnButton.nuActionButton but neither have any effect. Does anyone know if there is another class I should be targetting to change the Back button?

Thanks,
Paul
pmjd
 
Posts: 110
Joined: Fri Mar 12, 2021 7:08 pm
nuBuilder Version: 4.5

Re: CSS not Being Applied to the Back Button?

Unread postby kev1n » Tue Nov 23, 2021 1:29 am

Add this in the function nuResize():

Code: Select all
$(function() {
    $('#nuBackBtnButton').css({
         'width': '90px',
         'height': '45px',
         'margin':'5px'
     });
});   
kev1n
nuBuilder Team
 
Posts: 2117
Joined: Mon Oct 15, 2018 2:13 am
nuBuilder Version: 4.5

Re: CSS not Being Applied to the Back Button?

Unread postby pmjd » Tue Nov 23, 2021 1:32 am

Great, thank you kev1n that worked :D

Can I ask how it works? How does the function within the function force the css to be applied?
pmjd
 
Posts: 110
Joined: Fri Mar 12, 2021 7:08 pm
nuBuilder Version: 4.5

Re: CSS not Being Applied to the Back Button?

Unread postby kev1n » Tue Nov 23, 2021 1:36 am

This is a jQuery construct, see here: https://api.jquery.com/ready/ The event occurs when the HTML document has been fully loaded.
kev1n
nuBuilder Team
 
Posts: 2117
Joined: Mon Oct 15, 2018 2:13 am
nuBuilder Version: 4.5

Re: CSS not Being Applied to the Back Button?

Unread postby pmjd » Tue Nov 23, 2021 1:38 am

Thank you
pmjd
 
Posts: 110
Joined: Fri Mar 12, 2021 7:08 pm
nuBuilder Version: 4.5


Return to Custom Code

Who is online

Users browsing this forum: No registered users and 13 guests