Skip to content

Latest commit

 

History

History
282 lines (185 loc) · 11.6 KB

collections.md

File metadata and controls

282 lines (185 loc) · 11.6 KB

SE Header Components

A collection of fragments that can be used to build a page header.

Language Selector

Image of Language Selector

Site Logo

Image of Site Logo

Configuration Type Default Value Description
Image Alternate Text text site-logo
Image Height text 56px
Image Width text 56px

User Personal Bar

Image of User Personal Bar

Site Name

Image of Site Name

Configuration Type Default Value Description
Heading Level select h2

Navigation

Image of Navigation

Search

Image of Search

SE Content Display

A collection of fragments designed to be used within a collection fragment or on a display page.

Map View

Image of Map View

Categories

Image of Categories

Configuration Type Default Value Description
Ignore Categories - Separate categories by commas to ignore them. text category
Hide if Empty checkbox False

SE Utilities

A collection of utility fragments that can be used to help create pages.

Constrained Image

Image of Constrained Image

Configuration Type Default Value Description
Aspect Ratio Height text 3
Aspect Ratio Width text 4

Flex Container

Image of Flex Container

Configuration Type Default Value Description
Items text 3
Flex Direction select
Align Items select align-items-center
Justify Content select justify-content-between
Flex Wrap select

Fragment Context Display

Image of Fragment Context Display

Modal

Image of Modal

Configuration Type Default Value Description
Delay in ms to Show Modal text 3000
Footer Button Type select primary
Modal Vertical Alignment select

SE Integrations

A collection of fragments that showcase the ease with which you can integrate other systems with Liferay.

Google Hangout

Image of Google Hangout

Twitter

Image of Twitter

Configuration Type Default Value Description
Tweet Text text Let me tell you why I love @Liferay ...
Icon Size select 4

Tableau

Image of Tableau

Configuration Type Default Value Description
Report Name text WorldIndicators/GDPpercapita It must be something like 'WorldIndicators/GDPpercapita'.
Host URL text https://public.tableau.com Use your tableau host url. Don't finish it with '/'.
Site Root (empty if you are using public.tableau.com) text Leave this field empty if you use the public Tableau server (public.tableau.com).

Hubspot Chatbot

Image of Hubspot Chatbot

Configuration Type Default Value Description
Tracking Code text 8842647

LinkedIn Share Button

Image of LinkedIn Share Button

Configuration Type Default Value Description
Share URL text https://www.liferay.com

Twitter Timeline

Image of Twitter Timeline

Configuration Type Default Value Description
Twitter Handle text @Liferay
Number of Tweets to Display text 3

SE Components

A collection of fragments that can be used to composed pages mostly based off of Liferay's Clay web component framework.

Clay Icon

Image of Clay Icon

Configuration Type Default Value Description
Icon Name text check-circle
Icon Size select 32px

Overlay Slider

Image of Overlay Slider

Configuration Type Default Value Description
Number of Slides text 3
Show Overlay Effect checkbox True
Show Parallax Effect checkbox True
Overlay Color (e.g. #000000) text #000000 Valid values are hexadecimal values with 6 characters (e.g. #000000)
Overlay Opacity (e.g. 0.5) text 0.5 Valid values are float values between 0 and 1 with one decimal (e.g. 0.5)

Clay Alert

Image of Clay Alert

Configuration Type Default Value Description
Alert Type select alert-info
Display as Stripe checkbox False
Dismissable checkbox True
Hide Alert automatically checkbox True
Hide Delay (ms) text 5000

Mappable Video

Image of Mappable Video

Configuration Type Default Value Description
Use Mappable URL checkbox True
URL (Only use if not mapping the URL) text
Autoplay checkbox False
Loop checkbox False
Mute checkbox True
Hide Controls checkbox False
Width text
Height text
Align select flex-start

Background Video Container

Image of Background Video Container

Configuration Type Default Value Description
Video URL text https://storage.googleapis.com/coverr-main/mp4/Mt_Baker.mp4
Mobile Fallback Image text https://source.unsplash.com/XT5OInaElMw/1600x900
Video Height text 75vh
Video Min Height text 25rem
Overlay Color text #000
Overlay Opacity text 0.5

Display Heading

Image of Display Heading

Configuration Type Default Value Description
Heading Level select display-2

Background Gradient Container

Image of Background Gradient Container

Configuration Type Default Value Description
Starting Color text #ee0979
Finishing Color text #ff6a00
Angle text 90deg

Parallax Container

Image of Parallax Container

SE Billboard Charts

A collection of fragments build using Billboard Charts that can be used to demonstrate dashboard capabilities.

Bar Chart

Image of Bar Chart

Configuration Type Default Value Description
Data text [["data1", 100, 20, 30], ["data2", 20, 70, 100]] chart-data

Radar Chart

Image of Radar Chart

Configuration Type Default Value Description
Axis Max text 400 axis-max
Level Depth text 4 level-depth
Clockwise checkbox True clockwise
Data text [["x", "Data A", "Data B", "Data C", "Data D", "Data E"],["data1", 330, 350, 200, 380, 150],["data2", 130, 100, 30, 200, 80],["data3", 230, 153, 85, 300, 250]] chart-data

Area Chart

Image of Area Chart

Configuration Type Default Value Description
Data text [["data1", 300, 350, 300, 0, 0, 0],["data2", 130, 100, 140, 200, 150, 50]] chart-data

Line Chart

Image of Line Chart

Configuration Type Default Value Description
Data text [["data1", 30, 200, 100, 400, 150, 250], ["data2", 50, 20, 10, 40, 15, 25]] chart-data

Donut Chart

Image of Donut Chart

Configuration Type Default Value Description
Title text Donut Chart Title chart-title
Data text [["data1", 30],["data2", 120],["data3", 75]] chart-data