Created
December 14, 2011 02:35
-
-
Save ViliamKopecky/1474994 to your computer and use it in GitHub Desktop.
Personal suggestion for LESS path variables
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* | |
* Suggestion for LESS syntax - path variables (2011-12-14) | |
* By Viliam Kopecky <enoice(at)gmail> | |
* | |
**/ | |
// LESS SOURCE | |
/browser/ { | |
/page=.static, .homepage/ .menu { | |
.item { | |
// default | |
&/browser=.oldie/ { | |
// rules for old browsers | |
} | |
&/browser=.ie6, .ie7/ { | |
// rules specially for IE6 and IE7 | |
} | |
&.contact-call-to-action/page=.contact/ { | |
// this is not needed to be visible on contact page | |
} | |
&.contact-call-to-action/browser=.ie6/page=.contact/ { | |
// for example some fix for IE6 | |
} | |
} | |
} | |
} | |
// COMPILED CSS SOURCE | |
.static .menu .item { | |
// default | |
} | |
.homepage .menu .item { | |
// default | |
} | |
.oldie .static .menu .item { | |
// rules for old browsers | |
} | |
.ie6 .static .menu .item { | |
// rules specially for IE6 and IE7 | |
} | |
.ie7 .static .menu .item { | |
// rules specially for IE6 and IE7 | |
} | |
.ie6 .homepage .menu .item { | |
// rules specially for IE6 and IE7 | |
} | |
.ie7 .homepage .menu .item { | |
// rules specially for IE6 and IE7 | |
} | |
.contact .menu .item.contact-call-to-action { | |
// this is not needed to be visible on contact page | |
} | |
.ie6 .contact .menu .item.contact-call-to-action { | |
// for example some fix for IE6 | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Have you ever wanted to have nested css rule, but with slight modification in the parents' path?
Like when you have some nice button, which requires special treatment for oldie browsers, but writing the whole path again is kinda pain in the a**. isn't it? And it's against DRY (Don't Repeat Yourself). Well I have came up with this idea and I'm not sure if it isn't already implemented, but I couldnt find such feature.
The idea is about naming some 'variable' in the rule path and you can have nested rules with modification of this variable.
So, do you like it? Or are you going to tell me that this already works in some way?
Thanks guys ;)