How to get the value of a CSS property in SASS?

Question

I'd like to store the current value of a property for later use. It's already been solved for jQuery.

The issue is that I'm using a @mixin to apply a CSS hack in several places (Justified Block List) and I'd like to restore the font-size property in .block-list * (currently all text in sub-elements is just collapsed).

Unsatisfactory workarounds:

• Save the global default font size in a separate file and pass it to the @mixin on @import. This is of course in the general case not the same font size as the objects which the mixin is applied to.
• Save the font size whenever you change it, and pass that. This tangles up the files involved, since it's not very elegant to @include the typography stylesheet in several otherwise unrelated files.
• Use more jQuery.

Possibly satisfactory workarounds:

• Override the font size with a stronger rule on the first ancestor which changes it. This could be tricky to determine.

Answer 1

There's no way to tell the computed value of a property until the styles are actually applied to a document (that's what jQuery examines). In the stylesheet languages, there's no "current" value except the initial value or the value you specify.

Save the font size whenever you change it, and pass that seems best, and @BeauSmith has given a good example. This variant lets you pass a size or fallback to a defined global:

=block-list($font-size: $base-font-size)
  font-size: 0
  > li
    font-size: $font-size