Compact view in the UI is optimized to display more information in the browser window when this setting is enabled. When Compact View is enabled on an instance with Fuji or Geneva installed, the text is pushed down in single-line text fields within the Service Catalog. For example, this pesky catalog text issue causes the bottom of the letter "g" to be cut off and looks like this:
When it should look like this:
If I didn't know better I would think I had my elbow resting on the "a" key. This can cause some confusion with your users and they may try to delete and retype it without realizing that it is being cut off. This issue has been common if you are using the IE10 browser, but wasn't seen in IE11.
This is a PRB that effects you if you take the following steps and it results in tall letters like "g" and "y"getting cut off at the bottom.
- Using Internet Explorer, open an instance with the Fuji or Geneva release installed.
- Click the cog wheel in the upper right corner.
- Turn the Compact View option on.
- Navigate to Service Catalog > Catalog Variables > Item Variables.
- Find a Cat Item with a Single Line Text variable and note the Name. For example, the Item Designer Category Request catalog item uses a Single Line Text variable in the title field.
- Navigate to Service Catalog > Catalogs.
- In the Search catalog text box, type the name of the item identified in step 6 (for example, Item Designer Category Request) and press Enter or Return on your keyboard.
- Open the item.
- Type some text into the field identified in step 6 (for example, title).
Note that the text is cut off and letters such as g and y are not fully visible. Cut off text in compact view on the service catalog is fixed in Fuji Patch 12, but here are workarounds you can use on Fuji and Geneva instances if it effects you.
For instances with Fuji installed:
- Navigate to System UI > UI Macros.
- Open the macro named catalog_item.
- Insert the following in line number 3.
<style type="text/css">
HTML[data-doctype=true].compact .question_padding_container input.questionsettext,
HTML[data-doctype=true].compact .form-control {
padding-top:0px;
padding-bottom:0px;
}
</style>
For instances with Geneva installed:
- Navigate to System UI > UI Macros.
- Open the macro named catalog_item.
- Insert the following in line number 3.
<style type="text/css">
HTML[data-doctype=true].compact .sc-content-pad {
padding: 0px 6px;
}
</style>
Additional Information
For additional information, see the following:
- The known error article associated with this issue is KB0562882: When Compact View is enabled, it pushes the text down in single-line text fields within t....
- For more information about variables, see Service Catalog Variables in the product documentation.
- For more information about compact view, see UI15 banner frame.
