Configure the layout of your tile
In this topic, you learn how to configure the layout of your tile.
Prerequisites
-
You have configured the general settings of your tile in Configure general information about your tile.
Procedure
-
To make layout changes to the tile icon, open the Icon tab.
-
In the Tile Icon section, you can add an icon on the tile from the integrated SAP Icon Explorer.
Icon fonts from the integrated SAP Icon Explorer adapt automatically the underlying color scheme of the base UI5 theme selected for a launchpad layout, either for a light or dark appearance respectively. You can alternatively select an image file as an icon from the Media Library instead of an icon font from the integrated SAP Icon Explorer. In this case, the image file does not adapt to the underlying color scheme of the base UI5 theme. Select image files from the Media Library for the tile icon in a light and dark appearance respectively. If you have already selected an icon from the integrated SAP Icon Explorer, it takes precedence over images for light and dark appearance selected during display. -
In Image tab, you can add a custom source image for the tile for light appearance and dark appearance from the Media Library.
-
-
To make layout changes to the tile appearance, open the Layout tab.
-
In Tile Layouts for Light Appearance, select Add Tile Layout to add one or more predefined tile layout settings from the Tile Layout tool to apply to your tile for a light appearance. If same tile layout settings are shared between multiple tile layouts, the top tile layout is prioritized when applying settings.
-
By default, tile layouts added for light appearance are also used for dark appearance. In Tile Layouts for Dark Appearance, select Do Not Inherit Light Appearance Tile Layout to prevent the inheritance of light appearance for tile layouts for dark appearance and to add tile layouts for dark appearance separately.
-
Select Add Tile Layout to add one or more predefined tile layout settings from the Tile Layout tool to apply to your tile for a dark appearance. If the same tile layout settings are shared between multiple tile layouts, the top tile layout is prioritized when applying settings.
-
In the Tile Layout Settings section, select Force Tile Layout Attributes! to enable the settings defined in the tile layouts added to this tile instead of the tile inheriting tile layout settings configured in launchpad layouts and tile group layouts by default. Select Clickable Tiles to make all selected tile clickable. Buttons previously displayed on tiles are hidden and the whole tile areas is clickable. You can access tile actions from the right-click context menu Enter the custom CSS style class in CSS Style Class for the tile.
-
In the Tile Size section, you can select the width and height of the tile. The default is 4x4 grid of cells that is based on a CSS grid that contain cells that individually have an approximate minimum height of 32px and width of 32px.
If you select the width and height in the tile group layout, the settings take precedence over tile size settings made in the Tile tool.
-
-
Select Save.
Next steps
-
Optional: Further configure your tile