Jonathan Rehm

2 minute read

Winner!

Introduction

Working with PeopleSoft’s Fluid interface is a challenge for me. Its style is reminiscent of jQuery Mobile has not be especially fashionable since ~2010 and iOS 4. But no one has asked my opinion and it would not be considered in any case. So I learn to live with it.

One especially difficult part of the Fluid interface is its navigation. It may be better for students (questionable) but it’s a major step back in ease-of-use for power users. I miss my breadcrumbs any time I’m forced to solely use the navigator, being forced to open the navigator again and again.

The Problem

A few days ago I realized that the part that I hate the most is just how slow it is. I feel myself growing older every time I have to click the icon to open the menu. Then I decided that I’m a developer and I don’t have to live like that.

Using my browser’s developer tools to inspect the navbar and found its CSS transition property. As I suspected, it was set to take one second to open/close. One whole second devoted to its slide-out animation. That may not sound like a lot, but it is very noticeable when all you want to do is navigate to the next page in whatever task you’re doing. For example, in jQuery’s fadeIn API, the “slow” setting is set at 600 milliseconds, while “normal” is 400 milliseconds. 1000 milliseconds is glacial by comparison.

Let’s do something about that.

The Solution

Depending on which browser you’re using, the implementation will be somewhat different. Firefox has custom styling built into it (via its developer tools Style Editor). Chrome requires an extension. There are a number of options (search the Chrome Webstore for “style” or “css”) but the one that I like is Control Freak because it combines CSS & JavaScript tweaks into one package. Regardless what you use to make it happen, the fix will be the same.

Add this CSS to light a fire under that navbar:

.PTNavBarModal {
  transition: transform 0.25s;
}

You can play with the speed, but 250 milliseconds feels about right to me. It is quick, but I can still easily track what is going on.

BeforeAfter

What gripes (if any) do you have with Fluid and what have you done to resolve them? I’m always interested in learning what others have done to improve their life. Let me know in the comments below.

comments powered by Disqus