playbook_ui 13.18.0.pre.alpha.powercentrainplaybookpt22201 → 13.18.0.pre.alpha.thor93bargraphoptions2211

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e3b922118d0b871f7207a63dfcca6202da7b077b9d3d5c43cabae7aa8c7d1466
-  data.tar.gz: 2a1a35a01923c0c19bc00fdbe33968bd6561ad16c99a1e79ecc98a6d1005b659
+  metadata.gz: ceb325111d4662aa6a0491153e357222b4f304d21c247fcc44a3db3aafda347a
+  data.tar.gz: 693e1c50633b9b8f309cd2c21ffaa457adbf54ed8a3bd3dfa965b9852c3f6ca6
 SHA512:
-  metadata.gz: 1caa21aff0eef77479226d387147d1aaa75da7086a8cb9563ccf138e5165bf2528dd6c26cf4c273e4ab3b6706968d0dda029bd4003d1f249253dd13bb8a7ee8f
-  data.tar.gz: ae88cb3b68a66351ea7c90b5477e9672c82f6376074ea37446afd33c637ce66c311456047873126562ea4487bcda82788f15381b6caa3360804a06023e1cca62
+  metadata.gz: 64ae9216199a92f0559d7b524f6165f93698366b2d01e05669293b5a0fb974294148caf6415e97bcff6f8a09b1d2931cdc17cd28f2fc3b421be1532962061b97
+  data.tar.gz: 8134787717615c18836ec47718dae3518c79500d1786b9076618a71d8f0e5605706bc355aa9398c8dea710c3604828d93aeb680f0c7a17f4a19aab9510dc00c8

data/app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx

@@ -19,6 +19,7 @@ type BarGraphProps = {
   yAxisMax: number;
   chartData: { name: string; data: number[] }[];
   className?: string;
+  customOptions?: Partial<Highcharts.Options>;
   id: string;
   pointStart: number;
   htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
@@ -48,6 +49,7 @@ const BarGraph = ({
   className = "pb_bar_graph",
   colors,
   htmlOptions = {},
+  customOptions = {},
   id,
   pointStart,
   subTitle,
@@ -128,7 +130,7 @@ const BarGraph = ({
   const [options, setOptions] = useState({});
 
   useEffect(() => {
-    setOptions({ ...staticOptions });
+    setOptions({ ...staticOptions, ...customOptions });
   }, [chartData]);
 
   return (

data/app/pb_kits/playbook/pb_button/_button.scss

@@ -6,9 +6,9 @@
 @import "../tokens/typography";
 
 $pb_button_sizes: (
-  "sm":   $font_smaller,
-  "md":   $font_small,
-  "lg":   ($font_large - 2px),
+  "sm":   0.75rem,
+  "md":   0.875rem,
+  "lg":   1.125rem,
 );
 
 [class*=pb_button_kit]{

data/app/pb_kits/playbook/pb_button/_button_mixins.scss

@@ -9,7 +9,7 @@
 
 $pb_button_size: 40px;
 $pb_button_v_padding: 7px;
-$pb_button_h_padding: 28px;
+$pb_button_h_padding: 34px;
 $pb_button_hover_darken: 4%;
 $pb_button_border_width: 0px;
 
@@ -27,13 +27,12 @@ $pb_button_border_width: 0px;
   text-rendering: optimizeLegibility;
   font-size: $font_small;
   font-weight: $bold;
-  letter-spacing: $lspace_loose;
   text-align: center;
   vertical-align: middle;
   text-transform: none;
   border-width: $pb_button_border_width;
   border-style: solid;
-  border-radius: $border_rad_heavy;
+  border-radius: $border_rad_light;
   min-height: $pb_button_size;
   line-height: 1.5;
   padding: $pb_button_v_padding $pb_button_h_padding;

data/app/pb_kits/playbook/pb_caption/_caption_mixin.scss

@@ -24,7 +24,7 @@ $pb_dark_caption_colors: (
   color: $text_lt_light;
   text-transform: uppercase;
   font-size: $font_size;
-  letter-spacing: $lspace_loosest;
+  letter-spacing: $lspace_looser;
 }
 
 @mixin caption_color($color: $text_lt_light) {

data/app/pb_kits/playbook/pb_dashboard/commonSettings.js

@@ -53,7 +53,7 @@ const adjustAxisStyle = (axis) => {
   /* Change axis label styles */
   axis.labels.style.fontFamily = typography.font_family_base
   axis.labels.style.color = colors.charcoal
-  axis.labels.style.fontWeight = typography.regular
+  axis.labels.style.fontWeight = typography.light
   axis.labels.style.fontSize = typography.font_small
 }
 

data/app/pb_kits/playbook/pb_dashboard/pbChartsDarkTheme.ts

@@ -27,7 +27,7 @@ const highchartsDarkTheme: ThemeProps = {
     style: {
       color: colors.text_dk_default,
       fontFamily: typography.font_family_base,
-      fontWeight: typography.bold,
+      fontWeight: typography.regular,
       fontSize: typography.heading_3,
     },
   },

data/app/pb_kits/playbook/pb_dashboard/pbChartsLightTheme.ts

@@ -27,7 +27,7 @@ const highchartsTheme: ThemeProps = {
     style: {
       color: colors.text_lt_default,
       fontFamily: typography.font_family_base,
-      fontWeight: typography.bold,
+      fontWeight: typography.regular,
       fontSize: typography.heading_3,
     },
   },

data/app/pb_kits/playbook/pb_form_pill/_form_pill.scss

@@ -55,7 +55,7 @@ $form_pill_colors: (
     height: fit-content;
     height: -moz-fit-content;
     .pb_form_pill_text, .pb_form_pill_close, .pb_form_pill_tag {
-      font-size: $font_base;
+      font-size: 16px;
       font-weight: $regular;
     }
     .pb_form_pill_text, .pb_form_pill_tag {

data/app/pb_kits/playbook/tokens/_titles.scss

@@ -5,11 +5,10 @@
 @mixin pb_title(
     $fontSize: $heading_1,
     $fontWeight: $lighter,
-    $lineHeight: $lh_tighter,
-    $letterSpacing: $lspace_tight
+    $lineHeight: $lh_tighter
 ){
   font-size: $fontSize;
-  letter-spacing: $letterSpacing;
+  letter-spacing: $lspace_tight;
   font-weight: $fontWeight;
   color: $text_lt_default;
   margin: 0;
@@ -30,7 +29,8 @@
 }
 
 @mixin pb_title_4 {
-  @include pb_title($heading_4, $bolder, $letterSpacing: $lspace_normal);
+  @include pb_title($heading_4, $bolder);
+  letter-spacing: -0.03em;
 }
 
 @mixin pb_title_dark {

data/app/pb_kits/playbook/tokens/_typography.scss

@@ -1,11 +1,11 @@
-$font_family_base: "Power Centra", "Helvetica Neue", Helvetica, Arial, sans_serif !default;
+$font_family_base: "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans_serif !default;
 
 /* CLEAN UP AND REMOVE */
 $font_jumbo:        36px !default;
 $font_largest:      32px !default;
-$font_larger:       27px !default;
+$font_larger:       28px !default;
 $font_large:        20px !default;
-$font_base:         15.5px !default;
+$font_base:         16px !default;
 $font_default:      $font_base !default;
 $font_normal:       $font_base !default;
 $font_medium:       $font_base !default;
@@ -26,8 +26,8 @@ $text_smaller:      $font_smaller !default;
 $text_smallest:     $font_smallest !default;
 
 /* Headings */
-$heading_1: 44px !default;
-$heading_2: 32px !default;
+$heading_1: 46px !default;
+$heading_2: 34px !default;
 $heading_3: $font_larger !default;
 $heading_4: $font_base !default;
 
@@ -35,19 +35,19 @@ $heading_4: $font_base !default;
 $lspace_tightest:         -.1em !default;
 $lspace_tighter:          -.07em !default;
 $lspace_tight:            -.01em !default;
-$lspace_normal:           .003em !default;
+$lspace_normal:           0 !default;
 $lspace_loose:            .03em !default;
 $lspace_looser:           .07em !default;
 $lspace_loosest:          .1em !default;
 $lspace_super_loosest:    .2em !default;
 
 /* Standard Font Weights */
-$bold:          700 !default;
+$bold:          600 !default;
 $regular:       400 !default;
 
 /* Non_Standard Font Weights */
-$extrabold:     700 !default;
-$boldest:       700 !default;
+$extrabold:     900 !default;
+$boldest:       800 !default;
 $bolder:        700 !default;
 $light:         300 !default;
-$lighter:       300 !default;
+$lighter:       100 !default;