feat: add ability to change font size in big number (#7003)

* Add ability to change font sizes in Big Number * rename big number to header * Add comment to clarify font size values
apache · Mar 31, 2019 · cf9eec8 · cf9eec8
1 parent 5fd5253
commit cf9eec8
Show file tree

Hide file tree

Showing 4 changed files with 144 additions and 2 deletions.
diff --git a/superset/assets/backendSync.json b/superset/assets/backendSync.json
@@ -2497,6 +2497,64 @@
       "default": "150",
       "description": "Font size for the biggest value in the list"
     },
+    "header_font_size": {
+      "type": "SelectControl",
+      "label": "Header Font Size",
+      "renderTrigger": true,
+      "clearable": false,
+      "default": 0.3,
+      "options": [
+        {
+          "label": "Tiny",
+          "value": 0.125
+        },
+        {
+          "label": "Small",
+          "value": 0.2
+        },
+        {
+          "label": "Normal",
+          "value": 0.3
+        },
+        {
+          "label": "Large",
+          "value": 0.4
+        },
+        {
+          "label": "Huge",
+          "value": 0.5
+        }
+      ]
+    },
+    "subheader_font_size": {
+      "type": "SelectControl",
+      "label": "Subheader Font Size",
+      "renderTrigger": true,
+      "clearable": false,
+      "default": 0.125,
+      "options": [
+        {
+          "label": "Tiny",
+          "value": 0.125
+        },
+        {
+          "label": "Small",
+          "value": 0.2
+        },
+        {
+          "label": "Normal",
+          "value": 0.3
+        },
+        {
+          "label": "Large",
+          "value": 0.4
+        },
+        {
+          "label": "Huge",
+          "value": 0.5
+        }
+      ]
+    },
     "instant_filtering": {
       "type": "CheckboxControl",
       "label": "Instant Filtering",

diff --git a/superset/assets/src/explore/controlPanels/BigNumber.js b/superset/assets/src/explore/controlPanels/BigNumber.js
@@ -29,19 +29,30 @@ export default {
       ],
     },
     {
-      label: t('Chart Options'),
+      label: t('Options'),
       expanded: true,
       controlSetRows: [
         ['compare_lag', 'compare_suffix'],
         ['y_axis_format', null],
         ['show_trend_line', 'start_y_axis_at_zero'],
+      ],
+    },
+    {
+      label: t('Chart Options'),
+      expanded: true,
+      controlSetRows: [
         ['color_picker', null],
+        ['header_font_size'],
+        ['subheader_font_size'],
       ],
     },
   ],
   controlOverrides: {
     y_axis_format: {
       label: t('Number format'),
     },
+    header_font_size: {
+      label: t('Big Number Font Size'),
+    },
   },
 };
diff --git a/superset/assets/src/explore/controlPanels/BigNumberTotal.js b/superset/assets/src/explore/controlPanels/BigNumberTotal.js
@@ -29,17 +29,28 @@ export default {
       ],
     },
     {
-      label: t('Chart Options'),
+      label: t('Options'),
       expanded: true,
       controlSetRows: [
         ['subheader'],
         ['y_axis_format'],
       ],
     },
+    {
+      label: t('Chart Options'),
+      expanded: true,
+      controlSetRows: [
+        ['header_font_size'],
+        ['subheader_font_size'],
+      ],
+    },
   ],
   controlOverrides: {
     y_axis_format: {
       label: t('Number format'),
     },
+    header_font_size: {
+      label: t('Big Number Font Size'),
+    },
   },
 };
diff --git a/superset/assets/src/explore/controls.jsx b/superset/assets/src/explore/controls.jsx
@@ -1400,6 +1400,68 @@ export const controls = {
     description: t('Font size for the biggest value in the list'),
   },
 
+  header_font_size: {
+    type: 'SelectControl',
+    label: t('Header Font Size'),
+    renderTrigger: true,
+    clearable: false,
+    default: 0.3,
+    // Values represent the percentage of space a header should take
+    options: [
+      {
+        label: t('Tiny'),
+        value: 0.125,
+      },
+      {
+        label: t('Small'),
+        value: 0.2,
+      },
+      {
+        label: t('Normal'),
+        value: 0.3,
+      },
+      {
+        label: t('Large'),
+        value: 0.4,
+      },
+      {
+        label: t('Huge'),
+        value: 0.5,
+      },
+    ],
+  },
+
+  subheader_font_size: {
+    type: 'SelectControl',
+    label: t('Subheader Font Size'),
+    renderTrigger: true,
+    clearable: false,
+    default: 0.125,
+    // Values represent the percentage of space a subheader should take
+    options: [
+      {
+        label: t('Tiny'),
+        value: 0.125,
+      },
+      {
+        label: t('Small'),
+        value: 0.2,
+      },
+      {
+        label: t('Normal'),
+        value: 0.3,
+      },
+      {
+        label: t('Large'),
+        value: 0.4,
+      },
+      {
+        label: t('Huge'),
+        value: 0.5,
+      },
+    ],
+  },
+
   instant_filtering: {
     type: 'CheckboxControl',
     label: t('Instant Filtering'),