The pythonic awesome stylesheet language
Project description
http://github.com/rimvaliulin/pass
The pythonic awesome stylesheet language.
About
Pass is a dynamic stylesheet language and css preprocessor for web-developers that makes ccs coding simple and beautiful by having dynamic behavior such as variables, inheritance, operations and functions with python like indented syntax.
Installation
pip install pass
Command-line usage
pass style.pass
Usage in Code
import Pass Pass('style.pass')
Syntax
Every piece of knowledge must have a single, unambiguous, authoritative representation within a system. “DRY - don’t repeat yourself”
There should be one — and preferably only one — obvious way to do it”, from “The Zen of Python”.
Variables and operators
Variables allow you to specify widely used values in a single place, and then re-use them throughout the stylesheet, making global changes as easy as changing one line of code.
// Pass link_active = #1f6ba2 link_hover = #ccc link_height = 32px link_size = 1em .menu-item color link_active line-height link_height / 2 a:hover color link_hover font-size link_size + 0.5 background #000 |
/* Compiled CSS */ .menu-item { color: #1f6ba2; line-height: 16px } a:hover { color: #ccc font-size: 1.5em background: #000 } |
Nested selectors
Rather than constructing long selector names to specify inheritance, you can simply nest selectors inside other selectors.
// Pass line_height = 16px .menu margin-bottom line_height/2 -item float left color #fff :visited color #eee _active :hover color #ccc span background-color #ccc |
/* Compiled CSS */ .menu { margin-bottom 8px } .menu-item { float left color #fff } .menu-item:visited { color #eee } .menu-item_active, .menu-item:hover { color #ccc } .menu span { background-color #ccc } |
Selector inheritance
Class naming scheme:
block-[element] [child_]parent-[[parent]_child]
// Pass ._foo pass .foo pass .сhild_foo pass .new_child_foo pass .bar -link pass _acive pass |
/* Compiled CSS */ ._foo,.foo,.сhild_foo,.new_child_foo{} .foo{} .child_foo,.new_child_foo{} .new_child_foo{} .bar-link,bar-link_active{} bar-link_active{} |
Parent directive
Usage:
@parent "style.pass"
Functions
Color initialization
rgb(r, g, b) - Converts an Rgb(r, g, b) triplet into a color
rgba(r, g, b, a) - Converts an Rgba(r, g, b, a) quadruplet into a color.
hsl(h, s, l) - Converts an Hsl(h, s, l) triplet into a color.
hsla(h, s, l, a) - Converts an Hsla(h, s, l) quadruplet into a color.
Get/set color components
red(color, value=None) - Return the red component of the given color.
green(color, value=None) - Return the green component of the given color.
blue(color, value=None) - Return the blue component of the given color.
hue(color, value=None) - Return the hue of the given color.
saturation(color, value=None) - Return the saturation of the given color.
lightness(color, value=None) - Return the lightness of the given color.
alpha(color, value=None) - Return the alpha component of the given color.
Color adjustment
spinin(color, value=Pr(10)) - Changes the hue of a color.
spinout(color, value=Pr(10)) - Changes the hue of a color.
lighten(color, value=Pr(10)) - Makes a color lighten.
darken(color, value=Pr(10)) - Makes a color darker.
saturate(color, value=Pr(10)) - Makes a color more saturated.
esaturate(color, value=Pr(10)) - Makes a color less saturated.
fadein(color, value=Pr(10)) - Add or change an alpha layer for any color value.
fadeout(color, value=Pr(10)) - Add or change an alpha layer for any color value.
grayscale(color) - Converts a color to grayscale.
complement(color) - Returns the complement of a color.
invert(color) - Returns the inverse of a color.
mix(color, color1, weight=Pr(50)) - Mixes two colors together.
String Functions
quote(s) - Removes the quotes from a string.
unquote(s) - Adds quotes to a string.
Number Functions
percentage(value) - Converts a unitless number to a percentage.
round_(value, digits=0) - Rounds a number to the nearest whole number.
ceil(value) - Rounds a number up to the nearest whole number.
floor(value) - Rounds a number down to the nearest whole number.
Command-line options
- --version
show program’s version number and exit
- -h, --help
show this help message and exit
- -i, --inherit
use selector inheritance, rather then property duplication
- -c, --compressed
compress imported .css files
- -e, --empty-selectors
keep empty selectors
- -r, --respect-indents
respect indentes
- -n, --newlines
use newlines
- -I INDENT, --indent=INDENT
.pass file indentation. default 2 breaks
- -C CSS_INDENT, --css-indent=CSS_INDENT
.css file indentation. default 4 breaks
- -C CSS_INDENT, --css-indent=CSS_INDENT
.css file indentation. default 4 breaks
License
See LICENSE file.
> Copyright (c) 2012 Rim Valiulin
- Author:
Rim Valiulin
Project details
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
File details
Details for the file Pass-1.0.5.tar.gz
.
File metadata
- Download URL: Pass-1.0.5.tar.gz
- Upload date:
- Size: 30.7 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | e1bde279afed9b238390565ed3d2dd6bc52ededb966bef0d394340f8e0d63538 |
|
MD5 | b71c915eb8764cb2298619eef3016af5 |
|
BLAKE2b-256 | 0853e4161ff2546d69216940bf3443225dbf19fcae1ca4c24b537bb61f31f95f |