Templates Requirements

This requirement documents will explain the different sections one-by-one in details. 

1. Header Menu

Header menu is shown on the screenshot above. Notice there is an icon (arrow pointing down) beside the menu item. There is also a hover effect on the menu item. 

The menu effects will be like : https://test889.jaramdo.de/ when user scroll up

Please note there is a thin line  border below the menu item. 

In Ark Site, we have 2 buttons that we can configured, for the buttons, we can just follow this shape on https://www.cash-lv.de/

1.1 Contact Bar information 

This contact bar design is different than our current templates. 

• Able to upload a background image for the Contact bar
• The tel-no, email, and address on the left
• Social Media Button displayed on the right (instead of at the footer) 

2. Primary & Secondary Color 

The Primary Color is the turquoise color ( # )

Secondary Color is magenta color ( # )

You may refer to the CI Manual PDF for the color code. Screenshot shared below

Please pick the right color code to apply according to mock up

3. Slider  

Section Template name : Regionalwerke | Slider 

This slider comes with a standard Quote design. We should allow text configuration for the Quote.

This is an example of a slider configuration, URL : https://test889.jaramdo.de/admin/page-editor/137445

4. Three-column image

Section template name: Regionalwerke | 3-column image "Experience"

Standard 3 column images with icons ( Asset will be provided) and text which can be configured later on. Text styling kindly follow as close as above.

5. News Sections 

Section template name : Regionalwerke | News Previews and Links 

5.1 News preview

Logic of the News Preview : 
It will always display the 2 latest news. The category will always show the 1st category assigned to the news article. 

When hover, the color of the link will change.

5.2 Quick Links 

For these links, these are standard buttons, however, the text can be changed by user. The "arrow" is an icon instead of font. 

These are quick links button where we will have preset color and text, which they can edit later. When hover, the button will change its color to below : 

Note: above button should be added to Button templates under Regionalwerke Templates

6. Header Image 

Section Template Name : Regionalwerke | Header Image with Headline

All image and text are preset and is editable. 

7. News Article Page

Section Template Name : Regionalwerke | News Article

• The small line above headline: News Teaser text ( If the text characters are too manu, it will be cut off with "..."
• The headline is the news headline
• The magenta label is the news category

Page Overview : 

Above is the /news/:id page, thus it should come with Published Date and Back Button. 

Note: Every /news/:id page in our Ark Template comes with Published date and Back Button. May refer to our staging : https://kws.jaramdo.de/admin/page-editor/134864?language=en

As for the 3 news below, it should be automatically taken from /news page 

8. News Highlight Section

Section Template Name : Regionalwerke | News Highlight 3 column

The logic for this section is : 

Admin is allowed to configure which category news to display here -- it should display the 3 latest news of the selected category. 

An example of what we've done before: 

Question : Do we allow a selection of only 1 category to apply for all 3 news tile, OR we allow configuration of category for each tile ? 

9. Icons and Text

Section Template Name : Regionalwerke | Icons & Text 6 Column

• These are icons and Editable text. We only need to do single row, if admin likes to duplicate, they can do so via the Container. 
• The color above are preset. 

10. Colored Table 

Requirement to be updated 

11. Footer 

• The footer comes with a background.
• Default text color is white, when hover & click, it will change to yellow
• Copyright text to move to the Center position.