Changes

||56 or 112 pixels high (the width of the logo can vary but something around only 250 pixels wide or less is recommended).

# ::: {{Icon-Menu}}: :* Select '''Global Settings'''.# :* Click on the '''Branding''' tab.# :* For '''Logo''' click on the '''Browse…''' button, which looks like an open folder and select the desired file you want to upload.# :* Click the '''Upload''' button.# :* Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).

:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# For '''Favicon''' click on the '''Browse…''' button which looks like an open folder and select the desired file.:# Click the '''Upload''' button.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC). ==Compact Header==Use the compact header for a cleaner and more streamlined look. This header option, gives you more screen real-estate to work within. Toggle this setting on or off based on your preference. Note this setting applies to all users of the system. [[File:branding-main-heading-2-2019.png|thumb|none|500px|Compact header]] ===How to enable the Compact Header===:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# Toggle on '''Enable Compact Header'''.:# Click the '''Save''' button.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).

:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# Click the '''Colors & Styles''' link.:# Click on the desired color picker to choose a new color or enter a Hexadecimal value (example: #000000).:# Click '''Save'''.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).

||The color of all fields set as mandatory. Typically, the mandatory field color is set to #D81A01 which is a shade of red. This red has enough contrast to meet with Accessibility guidelines.

||Text color for table headers. This must be a dark color. Typically, the header color if the header color is darkused.

||Table Header color. Typically, We recommend using a lighter version of the of the header color at around 15% is recommended. Note the header font and background color inverse when the header of a column is clicked.The sorting icons for list views are an opacity of the Heading Font, so be careful with the colors you choose to ensure you meet with accessibility standards for color contrast. You can use this tool to check https://webaim.org/resources/contrastchecker/

:# Click on the '''menu icon''' which looks like 9 squares in the top right of the header.:: {{Icon-Menu}}: :# Select '''Global Settings'''.:# Click on the '''Branding''' tab.:# Click the '''Colors & Styles''' link.:# In the action bar located near the header click on the '''Export Styles''' button.:# A modal window will open. Copy the code in the modal window.:# Go to the system where you want to apply these styles.:# Follow steps 1 to 4 above.:# In the action bar located near the header, click on the '''Import Styles''' button.:# Paste the styles you copied into the modal window of the desired system.:# Click the '''Import Styles''' button on the bottom of the modal window.:# Click '''OK''' on the alert.:# Close the alert and the modal window.:# Click '''Save'''.:# Reload the page in your browser with a forced cache refresh (CTRL + F5 on the PC).