topic Re: Increasing font size with a custom theme in App Development

Increasing font size with a custom theme

acbishop2 — Wed, 14 Feb 2018 19:00:14 GMT

I need to adjust the title and label font size in all graphs. I've been able to adjust the title font size by following the instructions found at . This code works to adjust the title font size:

{
"_inherit": true,
"_variables" : {
    "@greenColor" : "#61a729",
    "@text": "#4c4c4c"
},
"color": "@text",
"fontSize": "12px",
"object" : {
    "title": {
      "main": {
        "fontSize" : "16px"
      }
    }
},
"dataColors": {
    "primaryColor": "@greenColor"
}
}

However, when I try to change the label font size, I cannot get it to work. This is the code I have come up with:

{

"_inherit": true,

"_variables" : {

"@greenColor" : "#61a729",

"@text": "#4c4c4c"

"color": "@text",

"fontSize": "24px",

"object" : {

"title": {

"main": {

"fontSize" : "24px"

}

"label": {

"name": {

"color": "@default",

"fontSize" : "24px"

"value": {

"color": "@default"

"fontSize": "24px"

}

"dataColors": {

"primaryColor": "@greenColor"

}

Please let me know what I am doing wrong. Thanks in advance!

Also, when can I expect the update that has font size as a drop-down bar in the app?

Re: Increasing font size with a custom theme

petercappelle — Thu, 15 Feb 2018 14:38:25 GMT

Hi Aaron Bishop,

Always try to validate your JSON code here: https://jsonlint.com/

If you validate it you will see you miss a "comma" after the second "@default" in the value block.

{
  "_inherit": true,
  "_variables" : {
    "@greenColor" : "#61a729",
    "@text": "#4c4c4c"
  },
  "color": "@text",
  "fontSize": "24px",
  "object" : {
    "title": {
      "main": {
        "fontSize" : "24px"
      }
    },
  "label": {
     "name": {
       "color": "@default",
       "fontSize" : "24px"
     },
     "value": {
       "color": "@default",
       "fontSize": "24px"
     } 
  }
  },
  "dataColors": {
    "primaryColor": "@greenColor"
  }
}

Re: Increasing font size with a custom theme

acbishop2 — Thu, 15 Feb 2018 17:10:25 GMT

Peter,

Thank you for the direction! That definitely helps. However, after adding the comma, none of the font sizes of the labels on my graphs changed. Any ideas?

Thanks again,

Aaron

Re: Increasing font size with a custom theme

acbishop2 — Thu, 15 Feb 2018 18:36:16 GMT

I figured out my problem. I thought that changing the "labels" values would change the labels for the axes in the graph. However, to change the labels on a graph's axis, I needed to do the following:

{

"_inherit": true,

"_variables" : {

"@greenColor" : "#61a729",

"@text": "#4c4c4c"

"color": "@text",

"fontSize": "24px",

"object": {

"title": {

"main": {

"fontSize" : "24px"

}

"axis" : {

"label" : {

"name" : {

"fontSize" : "20px"

}

"dataColors": {

"primaryColor": "@greenColor"

}

Re: Increasing font size with a custom theme

kristeljoymalapitan — Wed, 09 Oct 2019 07:16:19 GMT

Hi @acbishop2 ,

Where to place below sample code in resizing fonts? on Drive C:\?

Please confirm

Thank you

Re: Increasing font size with a custom theme

acbishop2 — Wed, 09 Oct 2019 14:26:11 GMT

Go to your Qlik folder, then Sense > Extensions >{Your theme folder here}.

For me, the path to this file was C:\Users\Me\Documents\Qlik\Sense\Extensions\my-font-theme\theme.json