Stylesheets and themes

Purpose

Overview

• The usage of stylesheets
• Web Dynpro ABAP - Theming support matrix
• Priority of stylesheets
• Troubleshooting
• Relevant notes

The usage of style sheets

For Web Dynpro ABAP there are three ways for usage of style sheets:

1. SAP standard standalone style sheets, without portal integration. Please use parameter WDTHEMEROOT for selecting the correct parameter.

2. Stylesheets with portal integration. In this case, please ensure that the portal stylesheet version is equal or higher than the ABAP stylesheet. (See SAP Note 1446099).

3. Customer stylesheets, please use UI Theme Designer for creating custom themes.

Web Dynpro ABAP - Theming support matrix

Fallback theme is the default theme used on a certain release.

*Using FLP SAP_BELIZE is the fallback, otherwise SAP_CORBU

** Starting from SAP_UI 755 only FIORI Guideline is supported  (See SAP Note 2934021).
** The legacy themes SAP Corbu and SAP Tradeshow Plus are no longer available, This is also valid for custom themes, if they are based on SAP Corbu or SAP Tradeshow Plus.
** Web Dynpro guidelines 1.1 and 2.0 are deprecated. 

Glossary

• Deprecated - Use not recommended. To be removed in future releases.
• Not Supported - SAP does not give any guarantees about this functionality and does not provide any support.

Remarks

1. SAP Belize, SAP Belize Deep and SAP Quartz Light (sap_belize, sap_belize_plus and sap_fiori_3):
   
   • Only supported in Standards Mode. No support for Quirks Mode (Compatibility Mode in IE).
   • The usage of fonts from a remote server must not be blocked in the web browser.
   • "SAP Belize" uses a row height of 32px. This is larger than previous themes and may result in additional scrollbars, less visible information on the screen or layout issues if an application uses fixed sizes.
   • The height of table rows is 24px (+1px for the grid line). This is larger than classic themes but smaller than "SAP Corbu "and "SAP Blue Crystal".
     
   • Can be used only with WDUIGUIDELINE=FIORI.
   • The name of the Guideline must be written in capital letters. (GL11, GL20, FIORI)
   • Currently there is no visual difference between the "SAP Belize" and "SAP Belize Plus" theme for Unified Rendering based applications.
2. SAP Blue Crystal (sap_bluecrystal):
   • Only supported in Standards Mode. No support for Quirks Mode (Compatibility Mode in IE).
3. SAP Gold Reflection (sap_goldreflection):
   
   • This theme is only an alias for "SAP Corbu" to allow common theming with the SAPUI5 "Gold Reflection" theme in the UI theme designer
     

No longer supported themes

• • • SAP High Contrast (sap_highcontrast)
    • SAP Chrome (sap_chrome)
    • SAP Streamline (sap_standard) 

These themes are no longer supported as of Release 7.00.

Releases not mentioned in the Theming Support Matrix

1. Supported themes for SAP_BASIS 7.00:
   
   • SAP Tradeshow (sap_tradeshow)
   • SAP High Contrast Black (sap_hcb)
     
     
2. Supported themes for SAP_BASIS 7.30:
   • SAP Tradeshow Plus (sap_tradeshow_plus)
   • SAP Tradeshow (sap_tradeshow)
   • SAP High Contrast Black (sap_hcb)

Priority of stylesheets

The priority of style sheets increases as the scope reduces.

1. External style sheet:  in case of the WDA application is integrated in NWBC, Enterprise Portal or Fiori Launchpad  the external stylesheet will be used as default.

 The default value of parameter WDUSEEXTERNALSTYLESHEET is ON.    

2080430 - How to find out the version of the SAP portal style sheets

2080443 - How to find out the version of the WD ABAP style sheets

2. Application setting: Each Web Dynpro Application can have parameter settings that may influence the chosen style sheet.

Please check the Application Parameters and URL Parameters for your release to see the available parameters for your release.

3. Global setting: If no external stylesheet or application parameter available, the Global parameters (Web Dynpro application: WD_GLOBAL_SETTING) will be taken into account. 

Troubleshooting

Custom themes must match the version of their used UI technologies.

Therefore custom themes must be updated after a UI technology has been updated. This can be accomplished by using the "Rebuild" function of the UI theme designer.

1888970 - UI theme designer - update of customer themes

2843432 - The interaction and importance of the frontend and the backend system for (custom) themes

2505163 - How to Rebuild custom themes in UI Theme Designer

The style sheet version number of the SAP Portal must be the same as or higher than the style sheet version of the WDA application.

If the style sheet version number of the portal is too low, you must adjust the portal accordingly. To do so, you must import the most recent portal SP, including the most recent patches (epbasis or epflp)

1446099 - Application (Web Dynpro or ITS) is not displayed in customer theme

Relevant SAP notes

2934021 - Support of visual themes for WDA/FPM in SAP_UI 7.55 (and higher)

2124106 - Themes for Unified Rendering based UI technologies (Web Dynpro ABAP/Java, BSP, SAPGUI for HTML, BI, JSF)

2789396 - Visual Design SAP Quartz for Unified Rendering based applications 

2379058 - Support of visual themes for WDA/FPM in SAP_UI 7.51 (and higher)

2328598 - Visual Design "SAP Belize" for Unified Rendering based applications

2000125 - Visual Design "SAP Blue Crystal" for Unified Rendering based applications. 

1446099 - Application (Web Dynpro or ITS) is not displayed in customer theme

2408180 - UI theme designer on ABAP: Latest Unified Rendering and Base Themes

2843432 - The interaction and importance of the frontend and the backend system for (custom) themes

2505163 - How to Rebuild custom themes in UI Theme Designer

End of mainstream Maintenance:

2583882 - Web Dynpro ABAP: End of Mainstream Maintenance for SAP_UI 740

2972680 - End of Mainstream Maintenance for SAP_UI 7.50 (SAPUI5 1.38)

2864280 - End of Mainstream Maintenance for SAP_UI 7.51 (SAPUI5 1.44)

2972656 - End of Mainstream Maintenance for SAP_UI 7.52 (SAPUI5 1.52)