Jon Barnes
Kilo Sage

One thing that has bugged me since SP rolled out is the user experience for Glide List fields on Service Portal. It looks exactly like a free text field, with no other decorations, so users don't know until they select it that it is not a free-form text field, but a multi-select reference field.

Here is how the field looks OOB:

find_real_file.png

With some simple styling, we can make it look like this:

find_real_file.png

I used the font-awesome icon called search-plus, but you can pick any other one you want. here is the CSS you need to add to your service portal style sheet to get this effect:

/* put a magnifier glass on glide list fields */
.type-glide_list .select2-container-multi:after {
  font-family: 'FontAwesome';
  position: absolute;
  top: 7px;
  right: 10px;
  content: "\f00e";
  color: #aaa;
}

You can use just about any fontawesome icon from this list: https://fontawesome.com/v4.7.0/icons/

Just find the icon you want to use, then click it and when the icon page loads, it will tell you the unicode value to use in the "content" part of the css above.

find_real_file.png

Let me know if this works for you and mark helpful if applicable.

Version history
Last update:
‎03-03-2019 04:45 PM
Updated by: