can i able to reduce the font size

[esfita]

can i able to reduce the font size ?? i tried compat mode as said in documentation but it hasnt worked. where can i refer in .css file ? more over i need to reduce the padding and height (header) of the data table, panel, etc..

[cagatay.civici]

Compact mode should definitely work, what is your version and how did you apply it?

Also you can change font size from _variables.scss, there is;

$fontSize: 16px;

variable, in compact mode it is;

$c-fontSize: 14px;

After the change you need to compile the sass to build css.

[esfita]

could you plz guide me how to compile saas files.. i am new to that

FYI: <h:body styleClass="main-body layout-compact"> this is how i did but i dont find any difference.

even <meta name="theme-color" content="#{guestPreferences.themeColors[guestPreferences.theme]}" /> this is also not working. iam using primefaces 6 only

[cagatay.civici]

For the meta to work, you need a bean like guestPreferences to make the theme dynamic. See the GuestPreferences.java in the maven project as an example.

To compile sass, please visit the documentation for the commands with examples;

http://www.primefaces.org/ultima/docs.xhtml

In your project, do you see any difference when you do;

Material Mode

Code: Select all

<h:body styleClass="main-body">

or

Compact Mode

Code: Select all

<h:body styleClass="main-body layout-compact">

[esfita]

so u mean to say i need to copail only variable.scss nd need to convert as _variable.css nd where should i put ?
more over i could not find $c-font-size" in variable file
really confused plz help

[cagatay.civici]

You need to copy the entire sass folder and put it under webapp root if you want to make customizations, if you post the screenshot of your webapp folder I can help better.

Also have you tried my suggestion above? Do you want to make font size smaller than 14 which is default for compact mode. In material mode font size is 16.

[esfita]

great found that.. and changed also...but still i could not change the

<meta name="theme-color" content="#{guestPreferences.themeColors[guestPreferences.theme]}" />
this is not changing dont know why ???
iam usiing the guestpreference class also..
it is working for menu layout, theme but dont know it is not working clear for components.. still it is in blue color

[cagatay.civici]

What is the html output in meta tag, can you post your GuestPreferences java file?