Thycotic Blog

One of the questions that I sometimes get from customers is, "I want the information on the Secret View page to display in a system font". The reason for this is it makes it easier to distinguish between O’s and zeros; and lower-case L’s and capital I’s.

This can easily be accomplished with CSS, and with since Secret Server 4.0 and up supports Themes, it is simple enough to add your own CSS to the default.css file.

Because of the way Copy to Clipboard works, all of the attributes that contain information are held in a custom attribute "t". This attribute is on the span elements and the text boxes when in edit mode. In theory, it should be as simple as this:

*[t]
{
    font-family:Consolas,System;
}

This is part of the CSS 2 specification, and the selector states "Any element with the attribute ‘t’." As expected, this works well with FireFox. This took care of the labels and the text boxes all-in-one. However, IE presented a bit of an issue. This simple solution didn’t seem to work. It’s not a secret to web developers that Trident, IE’s rendering engine, is pretty buggy as far as rendering engines go. What surprised me more was that the IE 8 beta, the up-and-coming super-compliant version of IE, still did not take. What was strange that when using a simple test page, the attribute selector did work; so it is supported in IE 7 and 8. There just appears to be an issue with that particular page.

So the solution became a little more complex. A lot of the elements on the secret view page don’t have classes or ID’s at the moment, which makes applying CSS to just some of the elements a bit trickier. In the end, this is how it turned out:

And the CSS used to accomplish this that works in both IE and FireFox:

div#SecretViewDialog * td.SecretFieldCell span, * span#iSM li
{
    font-family:Verdana ! important;
    font-size:10pt ! important;
}

input.SecretViewTextbox, input.SecretPasswordTextbox, div#SecretViewDialog * span
{
    font-family:Consolas,System;
    font-size:11pt;
}

The font of my choice is Consolas, a nice font that makes it easy to distinguish characters. It is a free font for user’s that own Visual Studio 2005 via download, and also ships with Visual Studio 2008.

– Kevin