Some elements that are not in focus do not scale down sufficiently while others do...

[maxxiimo]

Hello,

Thank you for the excellent plug-in. I'm using it here:

http://viewthought.com

Notice how when an LI loses focus, the icons (icon font) border is slightly larger than the space it occupies? (It becomes flush with the content on its right, and in some cases exceeds the lower boundary)

I've tried to fix this by targeting the CSS classes added by roundabout, but this method causes a slight shift when you drag an LI, or when the boxes change position through roundabout.

Here's the code:

• Markup
• Styles
• Supporting Mixin
• JavaScript

Here's an example of what happens when I target the roundabout classes:

http://viewthought-4.herokuapp.com

Here are the styles I added (targeting the widths also causes the shift):

.roundabout-moveable-item
  .circle
    +at-breakpoint($break6)
      width: (1.875em * 2) - 1
      height: (1.875em * 2) - 1

    +at-breakpoint($break9)
      width: (2.618em * 2) - 1
      height: (2.618em * 2) - 1

    +at-breakpoint($break12)
      width: (3.034em * 2) - 1
      height: (3.034em * 2) - 1

.roundabout-in-focus
  .circle
    +at-breakpoint($break6)
      width: 1.875em * 2
      height: 1.875em * 2

    +at-breakpoint($break9)
      width: 2.618em * 2
      height: 2.618em * 2

    +at-breakpoint($break12)
      width: 3.034em * 2
      height: 3.034em * 2

Do you have any suggestions on how I might be able to resolve this issue by chance?

Thanks in advance!=)

Chris