Download presentation
Presentation is loading. Please wait.
Published byChastity Weaver Modified over 9 years ago
1
Web parts, elements and user controls Width: 350 px / Height: 125 px Rounded corners: Rounding 6 px Background color: ? Name text: Arial, Bold, 12 px, #000000 Title text: Arial, 12 px, #000000 Image: 64 x 64 Font: 12 px Icon colour: #3e6b1c Link colour: #529900 Link hover: #F08C00 Button: Rounded corners: Radius 5 px Contact box Heading: Arial 15 px, #000000 Link text: Arial, 12 px, #529900 Background color: ? Icon colour: #3e6b1c Green teaser box
2
Summary links Title: Arial 16 px, #000000 Background color: ? Link color: #529900 Link hover: #F08C00 Icon colour #3e6b1c Link colour #529900 Hover link #F08C00 and underlined Link text 12 px Rounded corners: Radius 5 px
3
Example of web parts 3 Content editor web part Twitter web part RSS feed web part
4
Alert box 4 Background: Background color #ec3700, Text color #ffffff, Rounded corners 5px Wide Desktop Title: Corporate A, Regular, font-size 20px Text: Corporate S, Regular, font-size 16px Link: Corporate S, Regular, font-size 14px / Hover: underline Desktop Title: Corporate A, Regular, font-size 18px Text: Corporate S, Regular, font-size 15px Link: Corporate S, Regular, font-size 13px / Hover: underline Tablet Title: Corporate A, Regular, font-size 18px Text: Corporate S, Regular, font-size 15px Link: Corporate S, Regular, font-size 13px / Hover: underline Mobile Title: Corporate A, Regular, font-size 18px Text: Corporate S, Regular, font-size 15px Link: Corporate S, Regular, font-size 14px / Hover: underline Wide DesktopDesktop Tablet Mobile
5
Tables 5 Fortum data table: Light green # E4F4D2 Fortum coloured data table: Light green # E4F4D2 Light grey # F2F1F1
6
User controls User Controls for redirecting, filtering and updating the filtering on a page should be designed so that the information is immediately updated as soon as the user has finished making all the selections. Single selection field For a single selection field, the information should be updated as soon as the user has made a selection. The user should immediately get a visual cue that the information is being updated. In specific cases it is also possible to update only after the user has pressed a button to confirm the selection. 6
7
Multiple selection field 7 If the user can make several selections, these should be grouped in an information container and the information should be updated when the user clicks the button.
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.