Smartstaff
2,014
edits
Changes
m
→Overview
|-
||Heading Background
||Table Header background color. Typically a version of the of the header color at around 15% opacity. 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 font and background contrast [https://webaim.org/resources/contrastchecker/this tool] to check font and background contrast.
|-
||Top Border
||A Display options for the line at the top of each row in the table to give differentiation between rows. Typically set to a 1px solid FFFFFF (which is white).
|-
||Bottom Border
||A Display options for the line at the bottom of each row in the table to give differentiation between rows. Typically set to a 1px solid CCCCCC (which is a light grey).
|}
:# Close the modal window.
:# Click '''Save'''.
:# Reload the page in your browser with Force a forced cache refresh on your browser (CTRL + F5 on the PC, Cmd + R on Mac)to view your changes.
===Sample colors and styles file===
==Tip: Uploading images==
When you upload images to your system, always size the images to the desired dimensions and save to the desired file format with compression. Image optimization is typically done in photo editing software such as Adobe Photoshop. Take the time to ensure your image files are 1 MB or less. Larger images can take several seconds to download and display so take the time to ensure your image file size is around may cause a MB or lessnoticeable delay while pages load.
In regards to file formats JPG and PNG are the best options for your system.
'''JPG/JPEG''' Joint Photographic Experts Group is a lossy format best for photos images of people , landscapes, and landscapesrealistic photography.
'''PNG''' Portable Network Graphics is a lossless format that supports transparency and is best suited for logos , graphics, and graphicsicons.
==Tip: Sourcing imagery==
Don’t have photos to use in your system? Here are some websites that offer copyright -free stock photos for commercial use. Find the images you want, crop and size the images then upload them into your system.
* [https://unsplash.com/Unsplash]
* [https://gratisography.com/Gratisography]
* [https://morguefile.com/Morguefile]
* [https://pixabay.com/Pixabay]
* [https://www.stockvault.net/Stockvault]
* [https://www.pexels.com/Pexels]
* [https://picjumbo.com/Picjumbo]
* [https://www.rawpixel.com/Raw Pixel]
* [https://www.reshot.com/Reshot]
You may also want to check out the following paid stock photo sites.
* [https://www.iStockphoto.comiStock Photo]
* [https://www.Shutterstock.comShutterstock]
For free icons
* [https://www.flaticon.com/Flaticon]
[[Category:Interface]]
