Sass: Use black or white foreground color depending on the lightness of the background
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.
Related cards:
Postgres: DISTINCT ON lets you select only one record per ordered attribute(s) for each group
-
To retrieve only unique combinations of the selected attributes: You can omit rows, where all selected columns are equal with the
DISTINCT
statement. - To retrieve the group wise maximum of certain columns: You can keep only one record fo...
Lightning Talk: Coverage based Test Case Prioritization in Ruby on Rails
For my computer science bachelor's thesis I programmed and evaluated a CLI Test Case Prioritization (TCP) tool for makandra. It has been written as a Ruby Gem and was tested and evaluated against one Ruby on Rails project....
The Ruby Object Model
In Ruby (almost) everything is an Object
. While this enables a lot of powerful features, this concept might be confusing for developers who have been programming in more static languages, such as Java or C#. This card should help understanding t...
How to: Upgrade CarrierWave to 3.x
While upgrading CarrierWave from version 0.11.x to 3.x, we encountered some very nasty fails. Below are the basic changes you need to perform and some behavior you may eventually run into when upgrading your application. This aims to save you some...
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...
JavaScript: Testing whether the browser is online or offline
You can use the code below to check whether the browser can make connections to the current site:
await isOnline() // resolves to true or false
Limitations of navigator.onLine
While you can use the...
CSS: Matching against attributes and their values (or parts of them)
You probably know that you can use CSS selectors to match against elements and their attributes, such as:
a[title] { /* any <a> that has a "title" */ }
a[data-fancy="true"] { /* any <a> that has their "data-fancy" attribute set to "true" *...
RSpec: Leverage the power of Capybara Finders and Matchers for view specs
View specs are a powerful tool to test several rendering paths by their cases instead of using a more costing feature spec. This is especially useful because they become quite co...
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...
How to not leave trailing whitespace (using your editor or Git)
There is no reason to leave trailing whitespace characters in your project's files, so don't add any.
A git diff --check
will tell you if there are any and you should not commit when you see them. So go ahead and switch your editor/IDE to autom...