Use Sass 3.1 ;-).
The syntax is thus:
@function contrast_color($color, $contrast: 100%) {
@if (lightness($color) > 50) { @return darken($color, $contrast) }
@else { @return lighten($color, $contrast) }
}
On Fri, Jan 28, 2011 at 2:02 PM, abierbaum <[email protected]> wrote:
> Thanks. I think I can make this work in some of my cases.
>
> Now the next step though. What I really want is a way to define a
> method in SASS that would do this.
>
> Ex:
>
> @mixin contrast_color($color, $contrast: 100%) {
> @if (lightness($color) > 50) { darken($color, $contrast) }
> @else { lighten($color, $contrast) }
> }
>
> Then:
>
> $base_color2: contrast_color($base_color)
> $widget_color2: contrast_color($widget_color)
>
> Basically make a bunch of little helper methods like this that can
> assist in creating derived color variables and values.
>
> Is this possible? (my guess is that someone will say 'use Sass
> 3.1' :)
>
> -Allen
>
>
> On Jan 27, 2:49 pm, Chris Eppstein <[email protected]> wrote:
> > Hmm. The presence of !default makes this hard to do like you'd expect.
> >
> > In sass 3.1 there's a new function called if() that you can use like so:
> >
> > $base_text_color: if(lightness($base_bg_color) > 50, black, white)
> !defalut;
> >
> > if you can't/won't upgrade to the alpha version this is a (non-elegant)
> work
> > around:
> >
> > $base_text_color: false !default;
> >
> > @if not $base_text_color {
> > @if (lightness($base_bg_color) > 50)
> > { $base_text_color: black; }
> > @else
> > { $base_text_color: white; }
> >
> > }
> >
> > Chris
> >
> >
> >
> >
> >
> >
> >
> > On Thu, Jan 27, 2011 at 12:40 PM, abierbaum <[email protected]> wrote:
> > > Is it possible to use an if conditional to set the default value for a
> > > variable in SASS?
> >
> > > I want to do something like this but I can't figure out a way to get
> > > it to work. It looks like if's are only good for CSS blocks, not
> > > variable assignment.
> >
> > > $base_bg_color: rgba(238, 238, 238, 0);
> >
> > > @if (lightness($base_bg_color) > 50)
> > > { $base_text_color: black !defalut; }
> > > @else
> > > { $base_text_color: white !default; }
> >
> > > Thanks,
> > > Allen
> >
> > > --
> > > You received this message because you are subscribed to the Google
> Groups
> > > "Haml" group.
> > > To post to this group, send email to [email protected].
> > > To unsubscribe from this group, send email to
> > > [email protected]<haml%[email protected]><
> haml%[email protected]<haml%[email protected]>
> >.
> > > For more options, visit this group at
> > >http://groups.google.com/group/haml?hl=en.
>
> --
> You received this message because you are subscribed to the Google Groups
> "Haml" group.
> To post to this group, send email to [email protected].
> To unsubscribe from this group, send email to
> [email protected] <haml%[email protected]>.
> For more options, visit this group at
> http://groups.google.com/group/haml?hl=en.
>
>
--
You received this message because you are subscribed to the Google Groups
"Haml" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to [email protected].
For more options, visit this group at http://groups.google.com/group/haml?hl=en.
