This article shows how to create a Sass mixin for a colored button. The button's foreground color is dynamically chosen between either black or white, depending on the given background color.

It's a nice intro into @if and @else conditionals in Sass.

This card shows you how to format a card's content using Markdown. We use the Commonmarker interpreter, so here are examples for its dialect.

Formatting

**Bold**

Bold

_Italics_

Italics

`Monospaced`

Monospaced

> Quoted text

Quoted text

Here is [a link](http://makandra.com/).

Here is a link.

![An image; this is the alt text](http:/...

The .ova file format is a tar file with a .ovf file inside.
tar xvf virtualboximage.ova

You can change the color for text selection via CSS, using the ::selection and ::-moz-selection pseudo-elements.

Adding this to your Sass will make all text selections use a red background:

::selection
  background-color: #f00

::-moz-selection
  background-color: #f00

Unfortunately, those can't be combined into "::selection, ::-moz-selection". Doing so will have no effect.

Most of the JavaScript snippets have code that manipulates the DOM. For that reason dom manipulating javascript code should have been executed after the DOM has loaded completely. That means when the browser has finished HTML parsing and built the DOM tree. At that time, you can manipualte the DOM although not all resources (like images) are fully loaded.

The following snippets show how you can do this with plain JavaScript, jquery or prototype ([dom ready ...

You want Photoshop to always open files with "full" (100%) zoom and not try to fit them to your screen?
Tough luck -- there is no setting for this.

But, after opening the file, you can zoom to 100% by:

• pressing Ctrl-Alt-0 (on Windows; for Mac it's Meta-Alt-0)
• or double-clicking the magnifier tool icon.

When you print out a HTML pages, all raster images (like PNGs) will appear aliased. This is because a printer's resolution is usually much higher than that of a computer screen.

If an image absolutely must look awesome when printed, a solution is to embed the image in much higher solution than needed (e.g. four times the horizontal resolution), then scale it down to the desired width using CSS.

Note that this will slightly alter the image's appearance on the screen because browsers will scale down the image [using an anti-aliasing method](...

Note: capistrano_colors was merged into Capistrano starting from v2.13.5. However, this requires Ruby 1.9+.

If you cannot upgrade Capistrano to 2.13.5+ (e.g. because you're still running on Ruby 1.8), simply put capistrano_colors into your Gemfile and require 'capistrano_colors' in your config/deploy.rb file.

If you're using Paperclip to store and convert images attached to your models, processing a lot of images will probably cause headache for your system operation colleagues because CPU and/or memory peaking.

If you're on Unix you can use nice to tell the Kernel scheduler to prefer other processes that request CPU cycles. Keep in mind that this will not help if you're running into memory or IO trouble because you saved some bucks when you ordered (slow) harddrives.

ImageMagick (the tool which is used by Paperclip to do all that funky ima...

The unix command line tool less is a good choice for browsing logfiles. In the standard configuration, though, it does not interpret the escape sequences used in the rails logfiles. To enable this type:

less -R my_logfile.log

You can also have an alias to save yourself the typing

alias less='less -R'

List of non-standard CSS attributes that change how the browser resamples scaled images. Only use them if you know 100% which browser the client is going to use. Otherwise just stick with the default.

If you turn on stylesheet caching, it might happen that stylesheets from different locations with different relative pathes will be put together to one big stylesheet.

This stylesheet then resides in /stylesheets but still holds the old pathes, which aren't valid anymore. This leads to the effect that images are displayed on your local development machine (where caching is turned off automatically) but not on the server.

To fix this, either:
^

• Move all stylesheets to the same folder
• or have one cache per folder

If you would like to use language specific layout (e.g. background-images) in your applications stylesheets you can achieve this easily by using the lang attribute in your views (ERB):

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<%= I18n.locale || 'en' %>" lang="<%= I18n.locale || 'en'%>">
...
</html>

or in HAML:

%html :xmlns => "http://www.w3.org/1999/xhtml", :"xml:lang" => I18n.locale || 'en', :lang => I18n.locale || 'en'

Then, in your stylesheet you can for example declare different background-images fo...

If you want to know the exact hits on your website (or whatever logfile you want) for a specific date without duplicates, here's how.
"Unique" means you don't want to count hits to an URL originating from the same IP twice.

You can use the attached script to do so:

# ./log_parser.rb 2011-10-04

27 hits on /rss.xml
36 hits on /stylesheets/fonts/slkscr-webfont.woff
37 hits on /stylesheets/fonts/slkscrb-webfont.woff
37 hits on /images/bullet.png
38 hits on /images/download.png
38 hits on /images/play.png
39...

Since version 11.10 Opera provides support for linear gradients using -o-linear-gradient.

The syntax is pretty similar to Mozilla's -moz-linear-gradient. This will create a vertical gradient from yellow to red:

background-image: -o-linear-gradient(top, #ff0, #f00);

The first parameter defines where the gradient starts and which direction it will go. \
You can use top/left/bottom/right (and combinations of those) but also set any angle you like (0° being the left side, going counter-clock-wise):

background-image: -o-l...

The colors in Rails log files are helpful when watching them but, since they are ANSI color codes like ^[[4;36;1m, can be annoying when you are reading the logs with a tool that does just prints those control characters (like less or vim).

Remove them with sed:

cat staging.log | sed -r "s/\x1B\[([0-9]{1,3}((;[0-9]{1,3})*)?)?[m|K]//g"

This will print the log without colors to your terminal. You can pipe the result into less for example.

To have a file you can vim around with, just write that output into a new file:

ca...

The state_machine gem comes with a rake task that lets you generate PNG graphs from any model using state_machine.

Install the required dependencies like this:

sudo apt-get install graphviz
sudo gem install ruby-graphviz

You can now generate a graph like this:

rake state_machine:draw CLASS=ModelUsingStateMachine

Replace ModelUsingStateMachine with the name of your model class.

If it the raketask does not exist for you, add to Rakefile (in your pr...

There are many blog posts on encrypting backups, but none works for local drives.

#How to

• Encrypt the external backup drive using TrueCrypt or PGP or similar.
• Mount it. If possible, let this happen automatically.
• Tell Time Machine to use it for backup.

#What is NOT working

• Backing up to disk images as described in this blog post. Apparently, sparsebundle images & co. ar...

Microsoft provides virtual machine disk images to facilitate website testing in multiple versions of IE, regardless of the host operating system. Unfortunately, setting these virtual machines up without Microsoft's VirtualPC can be extremely difficult. These scripts aim to facilitate that process using VirtualBox on Linux or OS X. With a single command, you can have IE6, IE7, IE8 and IE9 running in separate virtual machines.

Did you check Copy to Projects Asset as ... and there is an existing file with the same name in your project folder?

Note that converting from RGB to CMYK will usually degrade your colors because no exact mapping is possible. Anyway, this Stackoverflow post worked for me:

gs -dSAFER -dBATCH -dNOPAUSE -dNOCACHE -sDEVICE=pdfwrite \
-sColorConversionStrategy=CMYK -dProcessColorModel=/DeviceCMYK \
-sOutputFile=output.pdf input.pdf

Consider this HTML:

<div style="line-height: 42px">
  <input type="checkbox" />
</div>

Even though the surrounding container defines a line-height, which vertically centers its inline elements, the check box will be top aligned if it is the only element inside the container.

It will be aligned correctly if the HTML looks like this:

<div style="line-height: 42px">
  <input type="checkbox" /> foo
</div>

Complex explanation here.

So the ac...

If you want to use the (badly implemented!) solarized color scheme in your Rubymine IDE:

1. Clone the IntelliJ IDEA port:

   git clone https://github.com/jkaving/intellij-colors-solarized.git

2. Import the settings in Rubymine by chosing the above directory File -> Import Settings

3. Change the color scheme in the settings (Ctrl-Alt-S) in Editor -> Colors & Fonts

Note that selecting a color scheme will also reset your previous editor font choice. You might want to change the font to [Envy Code R](http://damieng.com/blog/2008/05/2...