makandra dev
content-security-policy.com

tl;dr The strict-dynamic source list keyword allows you to simplify your CSP policy by favoring hashes and nonces...

If you want to to create maps within SASS/SCSS-files, it normally works like this: $some-map: (key1: value1, key2: value2...

Haml 6 was a major rewrite with performance in mind. To achieve a performance improvement of 1.7x, some design...

Maintaining larger projects makes it more difficult to balance refactoring and upgrade tasks according to its actual value. Consider to...

Let's say we have posts with an attribute title that is mandatory. Our example feature request is to tag...

SASS has an @extend keyword to inherit styles. .alert color: red &.-framed border: 1px solid red padding: 5px &.-homepage

developer.mozilla.org

Container queries enable you to apply styles to an element based on the size of the element's container. If...

makandra dev

Rails partials have a lot of "hidden" features and this card describes some non-obvious usages of Rails Partials.

Not all email clients support external images in all situations, e.g. an image within a link. In some cases, a...

vertical-align is hard. Have you ever wanted to vertically center an icon with text? This usually means "vertically align...

To read the current breakpoint tier in JavaScript, employ this CSS: :root { --current-breakpoint-tier: xs; @media (min-width: $screen...

makandra dev

In a Jasmine spec you want to spy on a function that is imported by the code under test. This...

You have some SVG files you want to use as icons on your website. How would you embed them?

In esbuild, you usually import other files using relative paths: import './some-related-module' import `../../utils/some-utility-module` import `../../../css/some-css.sass` This is totally fine...

As a developer you may have many tools watching your project for changes: Your IDE, Webpack, Guard, etc. This is...

Jasmine specs for the frontend often need some DOM elements to work with. Because creating them is such a common...

tl;dr In Chrome DevTools in the Layouts tab you have handy options to debug CSS Flexbox and Grid. Including...

drafts.csswg.org

While in CSS zero is usually referenced without specifying a unit (e.g. padding: 0), you must not use a unitless...

tl;dr The Chrome DevTools are a neat collection of tools for the daily work as a web developer. If...

sass >= 1.35.0 has the option quietDeps and silenceDeprecations to silence deprecation warnings from dependencies. quietDeps: No deprecation warnings for dependencies...

When writing a Sass function, you may run into an error message that may be confusing: @function rules may not...

tl;dr In Chrome DevTools in the Elements tab or in Firefox in the Inspector tab you can right click...

Unpoly's [up-observe], [up-autosubmit] and [up-validate] as well as their programmatic variants up.observe() and up.autosubmit...

You can use ETags to allow clients to use cached responses, if your application would send the same contents as...