Generate CSS Sprites on the Fly with Lemonade
Lemonade’s goal as a sprite generator is to be incredible easy to use, so you’ll use ist for every project—just because there’s no overhead. It needs no configuration, no Rake task, no Photoshop, just a little change in your Sass or SCSS files.
Related cards:
Matching elements on complex web pages with Webrat
XPath matchers can be combined with CSS-selector matchers. This is really useful if not, for example, the content of an element should be matched but the element itself like in the following example. Here a form is used to display data as default ...
Automatically build sprites with Lemonade
How it works
See the lemonade descriptions.
Unfortunately, the gem has a few problems:
- it does not work with Sass2
- it always generates all sprites...
Bash: Build and execute command lines on the fly with "xargs"
xargs
is a powerful bash tool that can take input from $STDIN and pass it to a given command. I.e. you can do the following:
$> cat tmp/parallel_cucumber_failures.log
features/authentication.feature:33
features/backend/pages.feature:5
featu...
Module: Sass
Sass is a meta-language on top of CSS that‘s used to describe the style of a document cleanly and structurally, with more power than flat CSS allows. Sass both provides a simpler, more elegant syntax for CSS and implements various features that a...
mezzoblue § Sprite Optimization
Maybe I haven’t been paying close enough attention, but over the past few years an interesting variation of CSS Sprites has been getting a lot of play on large web sites that serve millions of users.
Generating and streaming ZIP archives on the fly
When your Rails application offers downloading a bunch of files as ZIP archive, you basically have two options:
- Write a ZIP file to disk and send it as a download to the user.
- Generate a ZIP archive on the fly while streaming it in chunks t...
Here’s what we’ve learned about doing UI for mobile web apps with WebKit
Lately, we’ve been exploring ways to offer web apps that perform like native apps on mobile devices. For this short sprint we targeted mobile WebKit browsers—especially the default browsers on iOS and Android—because of their widespread use and ex...
Use different CSS depending on whether elements render on the same line or multiple lines
You will find this useful when creating responsive designs that work well on small screens.
The attached Javascript gives a container different CSS classes (single_line
or multiple_lines
) depending on whether its children render on one line o...
Managing vendor libraries with the Rails asset pipeline
The benefit of the Rails asset pipeline is that it compiles your stylesheets and javascripts to a single file, respectively. However, the consequences are startling if you don't understand them. Among others, the raw asset pipeli...
IE-friendly mobile-first CSS with Sass 3.2
Building CSS mobile-first is the way forward, because blah blah blah progressive enhancement blah. Problem is, Internet Explorer prior to 9 ignores anything within media query blocks, leaving those browsers with mobile styles.
Not all of us can g...