https://github.com/borodean/sassy-escape
Sass wrapper for a JavaScript library for escaping CSS strings and identifiers
https://github.com/borodean/sassy-escape
Last synced: about 1 year ago
JSON representation
Sass wrapper for a JavaScript library for escaping CSS strings and identifiers
- Host: GitHub
- URL: https://github.com/borodean/sassy-escape
- Owner: borodean
- Created: 2015-04-08T00:20:10.000Z (about 11 years ago)
- Default Branch: master
- Last Pushed: 2017-01-31T14:58:22.000Z (over 9 years ago)
- Last Synced: 2024-04-25T21:20:37.719Z (about 2 years ago)
- Language: Ruby
- Size: 3.91 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Sassy Escape [](https://travis-ci.org/borodean/sassy-escape)
============
A Sass wrapper for [cssesc,](http://github.com/mathiasbynens/cssesc) a JavaScript library [for escaping text for use in CSS strings or identifiers.](http://mathiasbynens.be/notes/css-escapes)
`escape($value, $options...)`
-----------------------------------
This function takes a value and returns an escaped version of the value where any characters that are not printable ASCII symbols are escaped using the shortest possible (but valid) [escape sequences for use in CSS strings or identifiers.](http://mathiasbynens.be/notes/css-escapes)
```scss
body::after {
content: escape('Ich ♥ Bücher');
}
// Becomes this:
body::after {
content: 'Ich \2665 B\FC cher';
}
```
By default, `escape` returns a string that can be used as part of a CSS string. If the target is a CSS identifier rather than a CSS string, use the `$is-identifier: true` setting.
```scss
.#{ unquote(escape('123a2b', $is-identifier: true)) } {
color: red;
}
// Becomes this:
.\31 23ab {
color: red;
}
```
The optional keyword arguments accept the exact options which JavaScript version [cssesc uses](http://github.com/mathiasbynens/cssesc#api) only converted to the `dasherized-case`:
```scss
body::after {
content: escape('123a2b', $escape-everything: true, $quotes: 'single', $wrap: true);
}
```
Installation
------------
```bash
gem install sassy-escape
```
Use with Sass command line
--------------------------
```bash
sass -r sassy-escape --watch sass_dir:css_dir
```
Use with Compass
----------------
Add the following to your Compass configuration:
```ruby
require 'sass-escape'
```