fix(pfTrendsChart): In compact layout, tightened up space

[dtaylor113]

Description

In compact layout, tightened space up between labels and chart:

PR Checklist

• Unit tests are included
• Screenshots are attached (if there are visual changes in the UI)
• A Designer (@beanh66) is assigned as a reviewer (if there are visual changes in the UI)
• A CSS rep (@cshinn) is assigned as a reviewer (if there are visual changes in the UI)

Previous:

Now:

Fixes #579

@serenamarie125

[beanh66]

@dtaylor113 is there a rawgit link I should checkout?

[jeff-phillips-18]

Now would be a good time to lose the useless col-md values on these columns since they are the same as the col-sm value. Would clean it up and one less selector in the less file above.

[dtaylor113]

Ok, fixed

[dtaylor113]

@dtaylor113 is there a rawgit link I should checkout?

Hi @beanh66, here is the ngDoc example

[jeff-phillips-18]

I believe you wanted col-sm-2 here so that at small resolutions these stay on a single line. Only at xs should they be vertical. This goes for all the changes here.

[jeff-phillips-18]

Should only need the col-sm- selectors now.

[dtaylor113]

Hi @jeff-phillips-18, I (hopefully) fixed the col selectors

[beanh66]

@dtaylor113 The spacing looks good! I'm curious in general, why does the label get stacked on top instead of staying on the right or left at a view like this:

[beanh66]

@dtaylor113 It seems like it should only stack at an xs resolution. @jeff-phillips-18 thought this is how it currently works, but maybe the ngDocs just aren't updated with the latest code?

[jeff-phillips-18]

@beanh66 The rawgit branch hasn't been updated. I pulled and tested and the latest changes correctly stack only at the xs resolution.