-
Notifications
You must be signed in to change notification settings - Fork 1
Python, CSS'd: A library for easily generating CSS from pure Python.
License
slacy/pyssed
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
pyssed: ======= A library for generating CSS via pure Python. Author: ======= Steve Lacy ([email protected]) Description: ============ This is a simple library for expressing CSS selectors & style rules in Python, then generating a syntactically correct CSS file as output. It was written for easy inclusion and use from virtually any web framework: Pylons, web2py, Django, etc. It's just a Python library, and not tied to any framework in particular. Background & Motivation: ======================= When doing web development, one must work in several languages and syntaxes concurently. Typically, you will have 4 or more languages to work with: - Python (or whatever language you're using for your backend) - HTML - CSS - JavaScript Context switching between languages can lead to editing mistakes, like missing (or adding) semicolons at the end of lines, etc. In addition, CSS2 has a very lightweight syntax, missing many key features. Because of this, several CSS helper libraries and alternate syntaxes have arisen. For example: Less CSS: "Leaner CSS" http://lesscss.org/ Sass: "Style with attitude" http://sass-lang.com/ Clever CSS: "the pythonic way of webdesign" http://sandbox.pocoo.org/clevercss/ But, none of these helper libraries actually use native Python for generating the CSS itself, and all of them are "just another language" with some CSS-isms and a few extensions to make the developer's life a bit easier. But, this just compounds the multi-language problem even more. I want to write my stylesheets in Python. I have a web framework that can take Python and generate HTML, so why not have it generate syntactically correct CSS as well? That's exactly what pyssed is for. What it does is best expressed in some examples. Please browse the examples directory for some more fun stuff. Examples: ========= # A trivial example of pyssed # See actual source in pyssed/examples/simple.py import pyssed css = { 'a:hover': { 'font-weight': 'bold', } } print '\n'.join(pyssed.generate(css)) will generate the CSS: """ a:hover { font-weight: bold; } """ In addition, because it's pure Python, pyssed's syntax is as flexible as the language itself, and automatically supports all of the features of the previously mentioned CSS helpers. Here's an example showing off lots of pyssed's features, include variables, arithmetic, mixins, nested styles, and style reuse. # See source in pyssed/examples/everything.py import pyssed site_background = "#123450" red = pyssed.style('color: red;') blue = pyssed.style(color='blue') green = {'color': 'green'} bold = pyssed.style('font-weight: bold;') red_bold = red + bold def rounded(radius): return pyssed.style({ 'border-radius': radius, '-moz-border-radius': int(round(radius * 1.5)), '-webkit-border-radius': int(round(radius * 2.0)), }) css = { '.blue': blue, '.green': green, 'ul li': rounded(3) + blue + { 'font-style': 'italic', 'background': site_background, }, 'div.ground': rounded(7) + red_bold + { 'p': { 'text-align': 'left', 'em': { 'font-size': '14pt', 'background': site_background, } }, } } print '\n'.join(pyssed.generate(css)) Which will generate the following CSS (item ordering may vary): """ .green { color: green; } div.ground { border-radius: 7px; color: red; font-weight: bold; -webkit-border-radius: 14px; -moz-border-radius: 11px; } div.ground p { text-align: left; } div.ground p em { font-size: 14pt; background: #123450; } .blue { color: blue; } ul li { border-radius: 3px; background: #123450; color: blue; -webkit-border-radius: 6px; -moz-border-radius: 5px; font-style: italic; } """
About
Python, CSS'd: A library for easily generating CSS from pure Python.
Resources
License
Stars
Watchers
Forks
Releases
No releases published
Packages 0
No packages published