Browse Form - CSS

[Mr71]

I wish I could manage the font characteristics in the Browse Form. For example if I wanted another font size ... another color, put in bold a field ... How to do it!? .. In the Edit Form I understood how to do it... but in the Browse Form!? Which CSS string!? Thanks in advance to those who want to help me ...
Marco

[kev1n]

Hi Marco,

Would you like to change all Browse Forms or just a specific one?

[Mr71]

Hi Kevin...
just a specific one...

[kev1n]

There are examples both in the Code Library and in this forum. E.g.

https://github.com/nuBuilder/nuBuilder- ... formatting

[Mr71]

my goal is to change the style of the font, without particular operations on the fields ... non-conditional operations ... but I don't know where to look...

[Mr71]

This Is an example ...

[kev1n]

To change a column's color, add this JavaScript to the form's Custom Code:

Code: Select all

function browseColumnColor(column, color) {
	$('[data-nu-column="'+column+'"]').each(function(index) {	   
		$(this).css("color", color);
	});
}

if (nuFormType() == 'browse') {
	browseColumnColor(2, 'grey'); // 3rd column grey
}

To increase the font size of a column, add the following class under Setup -> Header between the <style> tags:

Code: Select all

.nuBrowseTableLarger {
    font: 16px "Helvetica Neue",HelveticaNeue,Helvetica,Arial,sans-serif!important;
}

Next, add this JavaScript to the form's Custom Code:

Code: Select all

function browseColumnFont(column, _class) {
	$('[data-nu-column="'+column+'"]').each(function(index) {	   
		$(this).addClass(_class);
	});
}

if (nuFormType() == 'browse') {
	browseColumnFont(0, 'nuBrowseTableLarger'); // Set a larger font in the first column	
}

[Mr71]

thanks Kevin, works great!!!!