Thursday, March 1, 2012

LESS feature request and Zepto

LESS made writing CSS easy. There is a feature I wish were present in the framework. If the feature is already present, I couldn't find it. I want to be able to easily add properties which are common to parents and children without duplicating code. For example, I keep writing stuff like this -

aside {
  float: left;
  color: #666;
  font-family: serif;
  span, a {
     color: #666;
     font-family: serif;
  }
}


It will be great if we can write

aside {
  float: left;
  &, span, a {     color: #666;
     font-family: serif;
  }
}


There is another way to do this, but I don't like that very much.

aside {
  float: left;
}
aside, aside span, aside a{
  color: #666;
  font-family: serif;
}


Some time ago, I have tried Zepto for the mobile website expecting that it would let me add effects like fading. I had to fallback to jQuery for such effects. I wanted to write vanilla JavaScript for such effects, but left it for some other time. I don't think simple effects like fade are difficult to do. There was an fx.js in the Zepto repository and it had fadeIn, fadeOut etc., but those weren't implemented yet.

I have seen JavaScript libraries (tinymce, Zepto) using constants to specify what functionality is allowed. I found this annoying because you won't be able to know that unless you step through code. I really wish that something like console.log is as standard as printing to the stdout/stderr. That way these libraries could have printed a message saying fading is not yet done. Or is there some other reason there are no log messages in most of the libraries?