CSS Object-Fit ♥♥♥

I first heard of the object-fit attribute a couple of month ago and i make extensive use of it since this 'magic moment'. It's just so freaking helpfull for RWD that i won't miss it anymore.The worse thing about it, like most new techniques, some major browsers do not support it. It's just the IE & Edge ... so from my personal point of view i give a shit about this browsers. But as web professionals - sadly - we have to care about those.So i found a nice workaround which will work in all Browsers supporting the background-size property.It's pretty simple: In JavaScript, use modernizr to detect missing object-fit support, read out the image path, set the image as background to the parent container. The rest ist just a little css.

Make Firefox and Firefox Development Edition running together again (64-Bit)

After upgrading my Firefox and Firefox Development Edition to 64-Bit, i was no longer able to start them at the same time. Trying this will result in a message like "Firefox is already running but not responding".

Today i found the solution on the Mozilla support page - but only inside the google cache, because the topic is no longer available for some reason, so i publish it this way again.

Using Gulp-SFTP with Pageant (on Windows)

I tried multiple ways, pointing directly to the keyfile, etc. - everything fails or was not very practical.

Typesetter CMS: Create a reusable object, structured with page manager

Let's say you want to add a "call to action"-section beyond the content which is usable inside the template.

Smart Sticky Sidebar via hcSticky

If you ever need to have a sticky sidebar, which has a variable height, which is working well with a footer region, without having a second scrollbar ... try

Trying to build this with waypoint.js or something, is pain in the ass. This great library finished the job in < 5 minutes.

Smooth scrolling anchor links and hash url's - also base tag fix

This solution is also very usefull on pages with -Tag. Sometimes the basetag will make anchor links not working properly anymore (redirecting to the base url).

Typesetter Documentation

As the Typesetter documentation currently lacks a lot of informations, i will share some further things here.

(Known) Javascript Callbacks editor_area:loaded SectionAdded SectionCopied (Unclear - looks like only SectionAdded fired if a section is copied) SectionRemoved SectionSorted section_sorting:loaded section_options:loaded PreviewAdded PreviewRemoved

to be continued ...

Firefox Development Edition added new features

Just removed 3 plugins from my dev Firefox we do not need anymore! Just press F12 and hit the settings button. At the left bottom, you see some amazing options, like: Colorpicker, Ruler, Screenshot. Another interesting thing ist the "Scratchpad" a JavaScript console, who can store and run JS snippets.

The activated tools are now available at the top right.

Typesetter aka gpEasy - Remove edit and login locks

To remove the edit lock, simply navigate to your main directory, open the "data" folder, and delete the temporary "lock_...." file.

To reset the login lock, navigate to: "/data/_site/" and edit the "user.php". Now simply reset the "attempts" to 0.

Adaptive background (color taken from an image via JS)

Take a look at this amazing thing. Love it.

The library take´s the "primary color" of an image, and set it to the image container as background color. Similar to the tv technique "Ambient Light".